:root{
  --ink:#11231f;
  --paper:#f4efe5;
  --mint:#8ed9c8;
  --melon:#ef875e;
  --acid:#d8ff76;
  --blue:#8ab8d7;
  --line:#203c35;
  --white:#fffdf8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}
.cursor-halo{position:fixed;z-index:80;width:160px;height:160px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(216,255,118,.25),transparent 68%);transform:translate(-50%,-50%);mix-blend-mode:multiply}

.masthead{position:sticky;top:0;z-index:60;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px 28px;background:rgba(244,239,229,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand,.footer-brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-mark{width:44px;height:44px;display:grid;place-items:center;background:var(--ink);color:var(--acid);border-radius:50% 50% 12% 50%;font:600 18px "Fraunces",serif}
.brand-mark.small{width:38px;height:38px}
.brand-copy b,.footer-brand b{display:block;font:600 10px "IBM Plex Mono";letter-spacing:.08em}
.brand-copy small,.footer-brand small{font-size:11px;color:#60756e}
.nav{display:flex;gap:26px}
.nav a{text-decoration:none;font-size:13px}
.header-cta{justify-self:end;text-decoration:none;background:var(--ink);color:var(--white);padding:10px 15px;border-radius:999px;font-size:12px}

.opening{min-height:calc(100vh - 73px);display:grid;grid-template-rows:1fr auto;border-bottom:1px solid var(--line)}
.opening-grid{display:grid;grid-template-columns:1.05fr .95fr;min-height:740px}
.opening-copy{padding:10vw 6vw 6vw;display:flex;flex-direction:column;justify-content:center}
.eyebrow,.section-tag{font:600 10px "IBM Plex Mono";letter-spacing:.12em}
.opening h1{font:700 clamp(74px,10vw,150px)/.83 "Fraunces",serif;letter-spacing:-.05em;margin:22px 0 28px}
.opening h1 em{font-style:italic;color:var(--melon)}
.lead{font-size:21px;line-height:1.55;max-width:650px}
.opening-actions{display:flex;gap:16px;align-items:center;margin-top:24px}
.btn{font-weight:700;font-size:13px;text-decoration:none}
.btn.primary{background:var(--mint);border:1px solid var(--line);padding:14px 18px;border-radius:16px;box-shadow:7px 7px 0 var(--ink)}
.btn.text{border-bottom:1px solid var(--ink)}
.opening-visual{position:relative;border-left:1px solid var(--line);background:var(--blue);overflow:hidden;display:grid;place-items:center}
.paper-sheet{position:absolute;width:70%;height:66%;border:1px solid var(--line);background:var(--white);border-radius:30px}
.sheet-a{transform:rotate(-8deg);left:9%;top:13%;background:var(--mint)}
.sheet-b{transform:rotate(8deg);right:8%;bottom:10%;background:var(--melon)}
.app-tile{position:relative;z-index:5;width:62%;padding:30px;background:var(--white);border:1px solid var(--line);border-radius:24px;display:grid;grid-template-columns:130px 1fr;gap:24px;align-items:center;box-shadow:12px 12px 0 var(--ink);animation:floaty 5s ease-in-out infinite}
.app-tile img{width:130px;border:1px solid var(--line);border-radius:24px}
.app-tile span{font:600 9px "IBM Plex Mono";display:block;margin-bottom:9px}
.app-tile strong{font:700 44px/.9 "Fraunces",serif}
.stamp{position:absolute;z-index:7;border:1px dashed var(--ink);background:var(--acid);padding:9px 12px;font:600 9px "IBM Plex Mono"}
.stamp-one{top:12%;right:6%;transform:rotate(7deg)}.stamp-two{bottom:10%;left:7%;transform:rotate(-5deg);background:var(--white)}
@keyframes floaty{50%{transform:translateY(-14px) rotate(-1deg)}}
.opening-footer{display:flex;justify-content:space-between;padding:15px 28px;border-top:1px solid var(--line);font:600 9px "IBM Plex Mono"}

.company-strip{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;padding:85px 5vw;background:var(--ink);color:var(--white)}
.company-quote p{font:700 clamp(48px,5vw,78px)/1 "Fraunces",serif;margin:0;max-width:900px}
.company-facts{display:grid;gap:16px;align-content:end}
.company-facts div{border-top:1px solid #6f817c;padding-top:14px}
.company-facts small{display:block;font:600 9px "IBM Plex Mono";color:var(--mint);margin-bottom:6px}
.company-facts b{font-size:18px}

.release{padding:90px 5vw;background:var(--white);border-bottom:1px solid var(--line)}
.release-head{display:grid;grid-template-columns:180px 1fr;gap:30px;align-items:end}
.release-title{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:end}
.release-title h2{font:700 clamp(72px,8vw,118px)/.86 "Fraunces",serif;margin:0;letter-spacing:-.045em}
.release-title p{font-size:18px;line-height:1.6;margin:0}
.release-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:26px;margin-top:52px}
.screens-stage{position:relative;min-height:790px;background:var(--paper);border:1px solid var(--line);overflow:hidden}
.phone{position:absolute;margin:0;width:300px;transition:.4s}
.phone img{border:1px solid var(--line)}
.phone-main{left:11%;top:40px;transform:rotate(-5deg);z-index:3}
.phone-side{right:8%;bottom:36px;transform:rotate(6deg)}
.screens-stage:hover .phone-main{transform:translateY(-12px) rotate(-8deg)}
.screens-stage:hover .phone-side{transform:translateY(10px) rotate(10deg)}
.stage-note{position:absolute;padding:8px 10px;border:1px solid var(--line);font:600 9px "IBM Plex Mono";background:var(--acid)}
.note-a{right:8%;top:10%}.note-b{left:8%;bottom:11%;background:var(--mint)}
.release-features{display:grid;gap:14px}
.release-card{border:1px solid var(--line);padding:26px;background:var(--paper)}
.release-card span{font:600 10px "IBM Plex Mono";color:var(--melon)}
.release-card h3{font:700 30px "Fraunces",serif;margin:8px 0 12px}
.release-card p{margin:0;line-height:1.55;color:#4d5e59}
.play-link{display:block;background:var(--ink);color:var(--white);text-decoration:none;padding:18px 20px;font:600 10px "IBM Plex Mono"}
.banner-window{margin-top:26px;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:#fff}
.banner-window img{width:100%}

.interlude{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:75px 5vw;background:var(--melon);border-bottom:1px solid var(--line)}
.interlude-copy span{font:600 9px "IBM Plex Mono"}
.interlude-copy h2{font:700 68px/.95 "Fraunces",serif;margin:14px 0 0}
.interlude-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mini-box{min-height:130px;border:1px solid var(--line);display:grid;place-items:center;background:rgba(255,255,255,.35);font:600 9px "IBM Plex Mono"}

.capabilities{padding:90px 5vw}
.cap-title{display:grid;grid-template-columns:180px 1fr;gap:30px;align-items:end}
.cap-title h2{font:700 clamp(68px,8vw,110px)/.88 "Fraunces",serif;margin:0;letter-spacing:-.04em}
.dark{color:var(--melon)}
.cap-list{margin-top:46px;border-top:1px solid var(--line)}
.cap-row{display:grid;grid-template-columns:70px 1fr 120px;gap:22px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line);transition:.3s}
.cap-row:hover{padding-left:14px;background:var(--mint)}
.num{font:700 46px "Fraunces",serif}
.cap-row h3{font:700 32px "Fraunces",serif;margin:0 0 6px}
.cap-row p{margin:0;color:#53645f}
.chip{justify-self:end;border:1px solid var(--line);padding:7px 10px;border-radius:999px;font:600 9px "IBM Plex Mono"}

.process{background:var(--acid);border-block:1px solid var(--line);overflow:hidden}
.process-bar{display:flex;align-items:center;gap:18px;padding:20px 28px;justify-content:center}
.process-bar span{font:600 10px "IBM Plex Mono"}
.process-bar i{display:block;width:52px;height:1px;background:var(--ink);position:relative}
.process-bar i:after{content:"";position:absolute;right:-1px;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--ink)}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:90px 5vw;background:var(--paper)}
.contact-left h2{font:700 clamp(72px,8vw,112px)/.88 "Fraunces",serif;margin:15px 0 25px}
.contact-left p{font-size:19px;line-height:1.6;max-width:620px}
.contact-card{background:var(--white);border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:14px 14px 0 var(--ink)}
.contact-line{display:grid;grid-template-columns:100px 1fr;gap:18px;padding:15px 0;border-bottom:1px solid var(--line)}
.contact-line span{font:600 9px "IBM Plex Mono"}
.contact-line strong,.contact-line a{font-size:16px;line-height:1.45;text-decoration:none}
.big-mail{display:block;margin-top:18px;background:var(--mint);border:1px solid var(--line);text-align:center;text-decoration:none;padding:15px;font:600 10px "IBM Plex Mono"}

.footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;background:var(--ink);color:var(--white);padding:28px 5vw}
.footer-note{font:600 9px "IBM Plex Mono";color:#9fb0aa}
.footer-links{justify-self:end;display:flex;gap:18px}
.footer-links a{text-decoration:none;font:600 9px "IBM Plex Mono"}

.reveal{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s ease}
.reveal.visible{opacity:1;transform:none}

/* privacy */
.policy-page{background:var(--paper)}
.policy-top{display:flex;justify-content:space-between;align-items:center;padding:18px 5vw;border-bottom:1px solid var(--line)}
.policy-top a{text-decoration:none;border:1px solid var(--line);padding:9px 12px;border-radius:999px;font:600 9px "IBM Plex Mono"}
.policy-main{padding:65px 5vw 90px}
.policy-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:44px;align-items:end}
.policy-intro h1{font:700 clamp(76px,10vw,144px)/.84 "Fraunces",serif;margin:12px 0 0}
.policy-intro p{font-size:18px;line-height:1.65;margin:0}
.policy-board{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:45px}
.policy-card{grid-column:span 6;padding:24px;border:1px solid var(--line);background:var(--white);min-height:250px}
.policy-card:nth-child(2n){background:var(--mint)}
.policy-card:nth-child(5n){background:var(--melon)}
.policy-card.wide{grid-column:span 12}
.policy-card h2{font:600 10px "IBM Plex Mono";letter-spacing:.08em;margin:0 0 14px}
.policy-card p{font-size:16px;line-height:1.65;margin:0}
.policy-card a{font-weight:700}
.policy-effective{margin-top:28px;border-top:1px solid var(--line);padding-top:14px;font:600 9px "IBM Plex Mono"}

@media(max-width:980px){
  .masthead{grid-template-columns:1fr auto}.nav{display:none}.header-cta{justify-self:end}
  .opening-grid,.company-strip,.release-layout,.interlude,.contact{grid-template-columns:1fr}
  .opening-visual{border-left:0;border-top:1px solid var(--line);min-height:620px}
  .release-head,.cap-title{grid-template-columns:1fr}
  .release-title{grid-template-columns:1fr}
  .policy-intro{grid-template-columns:1fr}
}
@media(max-width:700px){
  .masthead{padding:12px 16px}.brand-copy small{display:none}.header-cta{font-size:10px}
  .opening-copy{padding:70px 20px}.opening h1{font-size:68px}.lead{font-size:18px}
  .app-tile{width:82%;grid-template-columns:92px 1fr;padding:20px}.app-tile img{width:92px}.app-tile strong{font-size:34px}
  .company-strip,.release,.interlude,.capabilities,.contact{padding:56px 20px}
  .company-quote p,.interlude-copy h2{font-size:48px}
  .release-title h2,.cap-title h2,.contact-left h2{font-size:62px}
  .screens-stage{min-height:580px}.phone{width:215px}.phone-main{left:4%}.phone-side{right:-8%}
  .cap-row{grid-template-columns:52px 1fr}.chip{grid-column:2;justify-self:start}.cap-row h3{font-size:27px}
  .interlude-grid{grid-template-columns:1fr}
  .process-bar{gap:10px;justify-content:flex-start;overflow:auto}.process-bar i{min-width:34px}
  .footer{grid-template-columns:1fr}.footer-note{display:none}.footer-links{justify-self:start}
  .policy-main{padding:50px 20px 70px}.policy-board{grid-template-columns:1fr}.policy-card,.policy-card.wide{grid-column:auto}.policy-intro h1{font-size:68px}
}