img{max-width:100%}
/* Layout: 1200px column on a near-black ground; full-bleed hero, then alternating two-column and centered bands, matching the Figma frame. Single dark look by design. */
:root{
  color-scheme:dark;
  --bg:#121219;
  --card:#191920;
  --fg:#FFFFFF;
  --fg-80:rgba(255,255,255,.8);
  --fg-60:rgba(255,255,255,.6);
  --fg-40:rgba(255,255,255,.4);
  --line:rgba(255,255,255,.24);
  --line-soft:rgba(255,255,255,.12);
  --muted:#D0D0D1;
  --accent:#CF4726;
  --cta:#D8502F;
  --cta-hover:#E2603F;
  --chip:rgba(255,255,255,.08);
  --ink:#121219;
  --font:"DM Sans",sans-serif;
  --font-ui:"DM Sans",sans-serif;
  --gut:max(16px, env(safe-area-inset-left, 0px));
  --gut-r:max(16px, env(safe-area-inset-right, 0px));
  --pad-l:max(var(--gut), min(120px, 8.3vw));
  --pad-r:max(var(--gut-r), min(120px, 8.3vw));
}
@media (max-width:640px){:root{--pad-l:max(env(safe-area-inset-left, 0px), 24px);--pad-r:max(env(safe-area-inset-right, 0px), 24px)}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
h1,h2,h3,p{margin:0}
h1,h2{text-wrap:balance}

.wrap{width:100%;max-width:1440px;margin:0 auto;padding-left:var(--pad-l);padding-right:var(--pad-r)}

/* Nav */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:31;background:var(--bg)}
.nav{position:absolute;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:30;height:80px;background:none}
.nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo img{display:block;width:107px;height:28px}
.links{display:flex;align-items:center;gap:16px}
.links a.link{font-family:var(--font-ui);font-weight:500;font-size:16px;letter-spacing:-.011em;padding:12px 16px;color:var(--fg);opacity:.9;transition:opacity .2s}
.links a.link:hover{opacity:1;text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--accent)}

/* Pill buttons */
.pill{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:999px;font-weight:700;font-size:16px;letter-spacing:-.011em;text-transform:uppercase;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.pill.solid{background:var(--cta);color:#000}
.pill.solid:hover{background:var(--cta-hover)}
.pill.ghost{border:2px solid var(--fg);color:var(--fg)}
.pill.ghost:hover{background:var(--fg);color:var(--ink)}

/* Hero */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;max-width:none}
.hero::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5)}
.hero{background:var(--bg)}
.hero-vf .hero-img{opacity:0;transition:opacity 2.8s ease}
.hero-vf .hero-img.ready{opacity:1}
.hero .wrap{position:relative;z-index:1;padding-block:120px clamp(40px,6vw,72px);display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.hero-copy{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:clamp(16px,2vw,28px)}
.hero h1{margin:0;font-size:clamp(42px,5.9vw,92px);font-weight:400;font-variation-settings:'opsz' 14;line-height:1.04;letter-spacing:-.035em;text-shadow:0 1px 2px rgba(0,0,0,.2),0 2px 10px rgba(0,0,0,.18);max-width:12.5em}
.hero p{margin:0;max-width:34em;font-size:clamp(18px,1.8vw,26px);line-height:1.4;color:var(--muted);letter-spacing:-.011em;text-shadow:0 1px 2px rgba(0,0,0,.2),0 2px 10px rgba(0,0,0,.18)}
/* Boxed scroll arrow, bottom-right of the hero */
.hero-arrow{flex:none;width:clamp(44px,4.2vw,60px);aspect-ratio:1;border:1px solid rgba(255,255,255,.55);border-radius:4px;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;margin-bottom:.2em;transition:background .25s,color .25s,border-color .25s}
.hero-arrow svg{width:44%;height:44%}
.hero-arrow:hover,.hero-arrow:focus-visible{background:#fff;color:#000;border-color:#fff}
@keyframes arrowDrop{0%{transform:none}25%{transform:translateY(140%)}26%{transform:translateY(-140%)}55%,100%{transform:none}}
@media (prefers-reduced-motion: no-preference){.hero-arrow{animation:heroIn .9s cubic-bezier(.2,.7,.2,1) .8s both}.hero-arrow:hover svg,.hero-arrow:focus-visible svg{animation:arrowDrop 1.4s infinite}}
@keyframes heroIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: no-preference){.hero-copy>*{animation:heroIn .9s cubic-bezier(.2,.7,.2,1) both}.hero-copy>:nth-child(1){animation-delay:.15s}.hero-copy>:nth-child(2){animation-delay:.35s}.hero-copy>:nth-child(3){animation-delay:.55s}}
/* Line rise: headline lines slide up from behind a mask (scripts/hero-lines.js); paragraph + buttons follow */
.hero-lr .hero h1{visibility:hidden;animation:none}
.hero-lr.hero-lr-go .hero h1{visibility:visible}
.hl-line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.hl-line>span{display:block;animation:hlRise 1.1s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.12s + .1s)}
@keyframes hlRise{from{transform:translateY(140%)}to{transform:none}}
@media (prefers-reduced-motion: no-preference){.hero-lr .hero-copy>:nth-child(2){animation-delay:.6s}.hero-lr .hero-copy>:nth-child(3){animation-delay:.8s}}

/* Eyebrow */
.eyebrow{display:flex;align-items:center;gap:12px;font-weight:700;font-size:18px;color:var(--fg-80);letter-spacing:.06em;font-variant-caps:all-small-caps}
.eyebrow::before{content:"";width:9px;height:9px;background:var(--accent);flex:none}

/* Thesis */
.thesis{min-height:719px;display:flex;align-items:center}
.thesis .wrap{display:grid;grid-template-columns:minmax(0,560fr) minmax(0,600fr);gap:32px;align-items:center;padding-block:72px}
.thesis-copy{display:flex;flex-direction:column;gap:16px;min-width:0}
.thesis h2{white-space:nowrap;font-size:clamp(28px,3.05vw,44px);font-weight:400;line-height:1.2;letter-spacing:-.011em;color:var(--fg-80)}
.thesis h2 b{color:var(--fg);font-weight:700}
.thesis p{font-size:clamp(17px,1.6vw,20px);color:var(--muted);letter-spacing:-.011em;margin-top:8px}
.venn{width:100%;max-width:680px;justify-self:center;aspect-ratio:1/1}
.venn svg{display:block;width:100%;height:auto}
.venn text{font-family:var(--font)}

/* Method */
.method .wrap{display:flex;flex-direction:column;gap:56px;padding-block:88px}
.rule{display:flex;flex-direction:column;gap:16px}
.rule hr{border:0;border-top:1px dashed var(--line);margin:0;width:100%}
.method-head{display:block}
.method-head h2{font-size:clamp(32px,4.4vw,48px);font-weight:400;line-height:1.2;letter-spacing:-.011em;color:var(--fg-80)}
.method-head h2 b{color:var(--fg);font-weight:700}
.method-head h2 span{display:inline-block}
@media (max-width:640px){.method-head h2{font-size:28px}}
.method-head p{font-size:clamp(18px,2vw,24px);color:var(--fg-80);letter-spacing:-.011em}
.cards{display:flex;flex-direction:column;gap:24px}
.card{--progress:0;position:relative;overflow:hidden;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:56px 44px;display:flex;justify-content:space-between;align-items:flex-start;column-gap:56px;row-gap:24px;transition:background-color .5s ease,border-color .5s ease}
.card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:var(--cta);transform-origin:left center;transform:scaleX(var(--progress));opacity:0;transition:opacity .4s ease}
.card.is-open{background:#202127;border-color:#202127}
.card.is-open::after{opacity:1}
.card.is-active{background:#202127;border-color:#202127}
.card.is-active::after{opacity:1}
.card{--nf:clamp(26px,3.4vw,40px);--ng:16px;--indent:0px}
.card-main{display:flex;gap:var(--ng);align-items:flex-start;min-width:0}
.card-icon{width:56px;height:56px;flex:none;display:flex;align-items:center;opacity:.6;transition:opacity .5s ease,filter .5s ease}
.card.is-open .card-icon{opacity:1}
.card.is-active .card-icon{opacity:1}
.card-icon img{display:block}
.card h3{font-size:clamp(26px,3.4vw,40px);font-weight:400;line-height:1.2;letter-spacing:-.011em;color:rgba(255,255,255,.6);min-height:56px;display:flex;align-items:center;transition:color .5s ease}
.card.is-open h3{color:var(--fg)}
.card.is-active h3{color:var(--fg)}
.card-body{display:flex;flex-direction:column;max-width:600px;min-width:0}
.card-acc{display:grid;grid-template-rows:0fr;transition:grid-template-rows .9s cubic-bezier(.16,1,.3,1)}
.card.is-open .card-acc{grid-template-rows:1fr}
.card-acc-inner{min-height:0;overflow:hidden;opacity:0;transition:opacity .25s ease}
.card.is-open .card-acc-inner{opacity:1;transition:opacity .6s ease .15s}
.card-body p{padding-top:16px;font-size:clamp(17px,1.6vw,20px);line-height:1.3;color:rgba(255,255,255,.7);letter-spacing:-.011em;transition:color .5s ease}
.card.is-open .card-body p{color:rgba(255,255,255,.8)}
.card .num{flex:none;width:1.26em;font-size:var(--nf);font-weight:400;line-height:1.2;letter-spacing:-.011em;min-height:56px;display:flex;align-items:center;color:rgba(255,255,255,.6);transition:color .5s ease}
.card.is-open .num{color:var(--fg)}
.card.is-active .num{color:var(--fg)}
.card-out{display:flex;flex-direction:column;gap:8px;margin-top:16px;padding-top:32px;border-top:1px solid rgba(255,255,255,.24)}
.card-out h4{margin:0;font-size:16px;font-weight:700;line-height:1.2;letter-spacing:.02em;font-variant-caps:all-small-caps;color:rgba(255,255,255,.6)}
.card-body .card-out p{padding-top:0}
.card-walk{display:flex;flex-direction:column;gap:16px;padding-top:24px}
.card-body .card-walk.ruled{margin-top:24px;border-top:1px solid rgba(255,255,255,.24)}
.card-body p b{font-weight:700;color:var(--fg)}
.card-walk h4{margin:0;font-size:16px;font-weight:700;line-height:1.2;letter-spacing:.02em;font-variant-caps:all-small-caps;color:rgba(255,255,255,.6)}
.card-tags{display:flex;flex-wrap:wrap;gap:8px}
.card-tags span{border:1px solid rgba(255,255,255,.32);border-radius:99px;padding:8px 16px;font-size:16px;line-height:1.2;letter-spacing:-.011em;white-space:nowrap}
.card-art{display:grid;grid-template-rows:0fr;width:min(456px,38%);flex:none;margin-left:auto;align-self:flex-start;transition:grid-template-rows .9s cubic-bezier(.16,1,.3,1)}
.card-art>div{min-height:0;overflow:hidden;opacity:0;transition:opacity .25s ease}
.card-art img{display:block;width:100%;height:auto;border-radius:12px}
.deck-stage{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#0d0d14;border:1px solid rgba(255,255,255,.12)}
.card-art .deck-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;opacity:0;transition:opacity .35s ease}
.card-art .deck-stage img.on{opacity:1}
.deck-strip{display:flex;align-items:stretch;gap:6px;margin-top:10px}
.deck-thumbs{flex:1;display:flex;gap:6px;min-width:0}
.deck-thumbs button{flex:1;min-width:0;padding:0;border:0;border-radius:3px;overflow:hidden;aspect-ratio:16/9;background:#0d0d14;cursor:pointer;opacity:.4;transition:opacity .2s}
.deck-thumbs button:hover{opacity:.7}
.deck-thumbs button.on{opacity:1;box-shadow:0 0 0 2px var(--cta)}
.card-art .deck-thumbs img{width:100%;height:100%;object-fit:cover;border-radius:0}
.deck-nav{flex:none;width:28px;border:1px solid rgba(255,255,255,.28);border-radius:3px;background:transparent;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background .2s,border-color .2s}
.deck-nav svg{width:16px;height:16px;display:block}
.deck-next{background:rgba(255,255,255,.1)}
.deck-nav:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.45)}
.deck-nav:focus-visible,.deck-thumbs button:focus-visible{outline:2px solid var(--cta);outline-offset:2px}
.card.is-open .card-art{grid-template-rows:1fr}
.card.is-open .card-art>div{opacity:1;transition:opacity .6s ease .15s}
@media (prefers-reduced-motion: reduce){.card,.card *,.card::after,.card-acc,.card-acc-inner,.card-art,.card-art>div{transition:none!important}}
.num{font-size:32px;font-weight:600;line-height:1.2;color:var(--fg-40);font-variant-numeric:tabular-nums;flex:none}

/* Proof */
.proof{min-height:719px;display:flex;align-items:center}
.proof .wrap{display:flex;flex-direction:column;align-items:center;gap:56px;padding-block:72px}
.stat{text-align:center}
.stat strong{display:block;font-size:clamp(84px,12vw,160px);font-weight:700;line-height:1.2;letter-spacing:-.011em;color:var(--accent);font-variant-numeric:tabular-nums}
.stat span{font-size:18px;color:var(--fg-60);letter-spacing:-.011em}
.stat .tick{font:inherit;color:inherit;letter-spacing:inherit}
.tick.is-odo{display:inline-flex;gap:.05em;height:1.2em;overflow:hidden;vertical-align:top;-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(transparent,#000 10%,#000 90%,transparent)}
.stat .tick-col{display:flex;flex-direction:column;align-items:center;overflow:visible;font:inherit;color:inherit;letter-spacing:inherit}
.stat .tick-col span{display:block;height:1.2em;line-height:1.2em;text-align:center;font:inherit;color:inherit;letter-spacing:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:100%;max-width:1176px}
/* Case cards (Figma 80-75): stat + title by default; hover lifts in the detail line and Learn more button */
.case{display:block;position:relative;overflow:hidden;border-radius:9px;aspect-ratio:371/467;min-width:0;color:#fff;container-type:inline-size}
.rv .case{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.rv .case.in{opacity:1;transform:none}
.case>*{--u:calc(100cqw / 371)}
.case--havoc{background:#004276;--acc:#0099FF}
.case--karman{background:#8572B4;--acc:#fff}
.case--gi{background:#F6F3EA;color:#000;--acc:#EECC2F}
.case:focus-visible{outline:2px solid var(--cta);outline-offset:4px}
.case-art{position:absolute;right:0;top:0;height:auto;max-width:none;pointer-events:none;transform-origin:100% 0;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.case--havoc .case-art{width:calc(var(--u)*177)}
.case--karman .case-art{width:calc(var(--u)*214);top:calc(var(--u)*2.7)}
.case--gi .case-art{width:calc(var(--u)*281)}
.case-logo{position:absolute;z-index:2;left:calc(var(--u)*24);top:calc(var(--u)*24);height:auto;display:block}
.case--havoc .case-logo{width:calc(var(--u)*120)}
.case--karman .case-logo{width:calc(var(--u)*150)}
.case-name{position:absolute;z-index:2;left:calc(var(--u)*24);top:calc(var(--u)*24);right:calc(var(--u)*24);font-size:calc(var(--u)*24);font-weight:400;line-height:1.2;letter-spacing:-.011em}
.case-body{position:absolute;z-index:2;left:calc(var(--u)*24);right:calc(var(--u)*24);bottom:calc(var(--u)*27);display:flex;flex-direction:column;transition:bottom .6s cubic-bezier(.16,1,.3,1)}
.case-was{display:block;font-size:calc(var(--u)*18);font-weight:700;line-height:1.2;letter-spacing:-.011em;text-transform:uppercase;opacity:.6;font-variant-numeric:tabular-nums}
.case-num{display:block;font-size:calc(var(--u)*60);font-weight:700;line-height:1.2;letter-spacing:-.011em;font-variant-numeric:tabular-nums}
.case-title{margin:calc(var(--u)*9) 0 0;font-size:calc(var(--u)*23);line-height:1.2;letter-spacing:-.02em;text-wrap:balance}
.case-more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s cubic-bezier(.16,1,.3,1)}
.case-more-in{min-height:0;overflow:hidden;display:flex;flex-direction:column;opacity:0;transform:translateY(calc(var(--u)*12));transition:opacity .25s ease,transform .5s cubic-bezier(.16,1,.3,1)}
.case-detail{margin:calc(var(--u)*17) 0 0;font-size:calc(var(--u)*16);line-height:1.2;letter-spacing:-.011em}
.case-btn{margin-top:calc(var(--u)*21);height:calc(var(--u)*44);flex:none;border-radius:calc(var(--u)*8);background:var(--acc);color:#000;display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*10);font-size:calc(var(--u)*18);font-weight:400;letter-spacing:-.011em}
.case-btn svg{width:calc(var(--u)*20);height:calc(var(--u)*20);flex:none}
@media (hover:hover){
  .case:hover .case-art,.case:focus-visible .case-art{transform:scale(1.08)}
  .case:hover .case-body,.case:focus-visible .case-body{bottom:calc(var(--u)*24)}
  .case:hover .case-more,.case:focus-visible .case-more{grid-template-rows:1fr}
  .case:hover .case-more-in,.case:focus-visible .case-more-in{opacity:1;transform:none;transition:opacity .4s ease .15s,transform .6s cubic-bezier(.16,1,.3,1) .1s}
}
/* Touch: always show the expanded (hover) layout, without the darker overlay */
@media (hover:none){
  .case-body{bottom:calc(var(--u)*24)}
  .case-more{grid-template-rows:1fr}
  .case-more-in{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){.case-art,.case-body,.case-more,.case-more-in{transition:none!important}}

/* CTA */
.contact{display:flex;align-items:center}
.contact .wrap{display:grid;grid-template-columns:minmax(0,556fr) minmax(0,564fr);gap:80px;align-items:center;padding-block:120px}
.contact-copy{display:flex;flex-direction:column;gap:32px;color:var(--fg-80);min-width:0}
.contact h2{color:var(--fg);font-size:clamp(32px,4.2vw,44px);font-weight:400;line-height:1.2;letter-spacing:-.011em;text-shadow:0 0 4px rgba(0,0,0,.25)}
.contact-copy p{font-size:clamp(18px,2vw,24px);letter-spacing:-.011em}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.tile{height:227px;border-radius:8px;padding:32px;display:flex;flex-direction:column;justify-content:space-between;font-weight:700;font-size:20px;line-height:1.5;letter-spacing:-.011em;text-transform:uppercase;transition:background .2s,border-color .2s,color .2s}
.tile svg{align-self:flex-end;width:24px;height:24px;transition:transform .25s ease}
.tile:hover svg,.tile:focus-visible svg{transform:translate(4px,-4px)}
.tile.primary{background:var(--cta);color:#000}
.tile.primary:hover{background:var(--cta-hover)}
.tile.secondary{border:2px solid rgba(255,255,255,.32);color:var(--fg-80)}
.tile.secondary:hover{border-color:var(--fg);color:var(--fg)}

.contact{position:relative;z-index:1}
.foot{position:relative}
.foot::before{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:603px;background:url(assets/footer-octo-3.webp) calc(100% + 216px) 0/1656px 1003px no-repeat;filter:blur(24px);mix-blend-mode:lighten;pointer-events:none;-webkit-mask-image:linear-gradient(transparent,#000 45%),linear-gradient(90deg,transparent,#000 45%);-webkit-mask-composite:source-in;mask-image:linear-gradient(transparent,#000 45%),linear-gradient(90deg,transparent,#000 45%);mask-composite:intersect}
.foot .wrap{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:40px;padding-block:44px}
.foot .wrap::before{content:"";position:absolute;top:0;left:var(--pad-l);right:var(--pad-r);height:1px;background:rgba(255,255,255,.12)}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:40px;width:100%}
.foot-offices{display:flex;gap:40px;flex-wrap:wrap}
.office{font-style:normal;display:flex;flex-direction:column;gap:8px;width:240px;max-width:100%}
.office .lbl{font-size:24px;line-height:1.2;letter-spacing:-.011em;color:var(--fg-60)}
.office span:not(.lbl){font-size:18px;line-height:1.35;letter-spacing:-.011em;color:var(--fg)}
.foot-copy{font-size:16px;line-height:1.2;letter-spacing:-.011em;color:var(--fg-60)}
.to-top{flex:none;width:64px;height:88px;border-radius:99px;border:1px solid var(--fg);color:var(--fg);display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background .2s,color .2s}
.to-top svg{width:22px;height:22px;display:block}
.to-top:hover,.to-top:focus-visible{background:var(--fg);color:var(--ink)}
@keyframes arrowShoot{
  0%{transform:translateY(0);animation-timing-function:cubic-bezier(.55,0,.75,.2)}
  22%{transform:translateY(-64px);animation-timing-function:steps(1,end)}
  23%{transform:translateY(64px);animation-timing-function:cubic-bezier(.2,.75,.35,1)}
  50%,100%{transform:translateY(0)}
}
@media (prefers-reduced-motion: no-preference){.to-top:hover svg,.to-top:focus-visible svg{animation:arrowShoot 1.8s infinite}}
@media (max-width:640px){
  .foot .wrap{gap:32px;padding-block:40px}
  .foot-row{align-items:flex-end}
  .foot-offices{flex-direction:column;gap:28px}
  .office{width:auto}
  .office .lbl{font-size:20px}
  .office span:not(.lbl){font-size:16px}
  .foot-copy{font-size:14px}
  .to-top{width:56px;height:76px}
  .to-top svg{width:20px;height:20px}
}

/* Mobile menu */
.menu-btn{display:none;position:relative;width:44px;height:44px;margin-right:-10px;padding:0;border:0;background:none;color:var(--fg);cursor:pointer;-webkit-tap-highlight-color:transparent}
.menu-btn span{position:absolute;left:10px;right:10px;height:2px;background:currentColor;border-radius:2px;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.menu-btn span:first-child{top:17px}
.menu-btn span:last-child{top:25px}
.menu-btn[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.menu-btn:focus-visible{outline:2px solid var(--cta);outline-offset:2px;border-radius:8px}
.menu{position:fixed;inset:0;z-index:-1;background:var(--bg);display:flex;flex-direction:column;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 120px) var(--pad-r) calc(env(safe-area-inset-bottom,0px) + 40px) var(--pad-l);opacity:0;transition:opacity .3s ease}
.menu[hidden]{display:none}
.menu.is-open{opacity:1}
.menu-links{display:flex;flex-direction:column}
.menu-links a{font-size:36px;line-height:1.2;letter-spacing:-.011em;color:var(--fg);padding:16px 0;border-bottom:1px solid rgba(255,255,255,.12);opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .5s cubic-bezier(.16,1,.3,1)}
.menu.is-open .menu-links a{opacity:1;transform:none}
.menu.is-open .menu-links a:nth-child(2){transition-delay:.05s}
.menu.is-open .menu-links a:nth-child(3){transition-delay:.1s}
.menu-cta{height:56px;width:100%;opacity:0;transition:opacity .4s ease .15s,background .2s}
.menu.is-open .menu-cta{opacity:1}
html.menu-open{overflow:hidden}
/* Hide the nav Book a call pill while the menu is open (the menu has its own) */
.links .pill{transition:background .2s,color .2s,border-color .2s,opacity .25s ease,visibility 0s linear 0s}
html.menu-open .links .pill{opacity:0;visibility:hidden;pointer-events:none;transition:background .2s,color .2s,border-color .2s,opacity .2s ease,visibility 0s linear .2s}
@media (max-width:900px){
  .links{margin-left:auto}
  .menu-btn{display:block}
}
@media (min-width:901px){.menu{display:none!important}}
@media (max-width:640px){.links .pill{height:38px;padding:0 14px;font-size:14px}}
@media (prefers-reduced-motion: reduce){.menu,.menu *,.menu-btn span{transition:none!important}}
/* Responsive */
@media (max-width:1100px){
}
@media (max-width:900px){
  .links a.link{display:none}
  .thesis .wrap,.contact .wrap{grid-template-columns:1fr;gap:48px}
  .thesis h2{font-size:clamp(30px,6vw,40px);white-space:normal}
  .thesis h2 .lb{display:none}
  .venn{max-width:600px}
  .method-head{grid-template-columns:1fr}
  .card{flex-wrap:wrap}
  .card-main{flex:1 1 0}
  .card-art{order:3;flex:0 0 calc(100% - var(--indent));width:auto;margin-left:var(--indent);align-self:auto}
  .card.is-open .card-art>div{transition:opacity .6s ease .5s}
  .card{row-gap:0}
  .card-art>div::before{content:"";display:block;height:32px}
  .thesis,.proof,.contact{min-height:0}
}
@media (max-width:1200px){
  /* Stacked cards (tablet + mobile): always expanded, no darker overlay, full-width button */
  .cases{grid-template-columns:1fr;max-width:none;align-self:stretch}
  .case{aspect-ratio:auto;display:flex;flex-direction:column}
  .case>*{--u:calc(min(100cqw,460px) / 371)}
  .case-logo,.case-name{position:relative;left:auto;top:auto;right:auto;margin:calc(var(--u)*24) calc(var(--u)*24) 0}
  .case-body,.case:hover .case-body{position:relative;left:auto;right:auto;bottom:auto;margin:calc(var(--u)*44) calc(var(--u)*24) calc(var(--u)*24)}
  .case-title,.case-detail{max-width:calc(var(--u)*400)}
  .case-more{grid-template-rows:1fr}
  .case-more-in{opacity:1;transform:none}
}
@media (max-width:640px){
  .card{padding:24px 20px 20px}
  .card{flex-direction:column;align-items:flex-start}
  .card-art{margin-left:var(--indent);flex:none;width:calc(100% - var(--indent))}
  .card-tags span{white-space:normal;font-size:14px;padding:6px 12px}
  .card-tags{gap:6px}
  .card,.card.is-active,.card.is-open{background:#202127;border-color:#202127}
  .card::after{display:none}
  .card h3{color:var(--fg)}
  .card-body p{color:rgba(255,255,255,.8)}
  .card .card-acc,.card .card-art{grid-template-rows:1fr}
  .card .card-acc-inner,.card .card-art>div{opacity:1}
  .card,.card h3,.card-body p,.card-acc,.card-acc-inner,.card-art,.card-art>div{transition:none!important}
  .card{--ng:12px}
  .card .num{min-height:0;align-items:flex-start}
  .card h3{min-height:0}
  .tiles{grid-template-columns:1fr;gap:16px}
  .tile{height:150px;padding:24px}
  .method .wrap{padding-block:80px;gap:40px}
  /* Compact hero: arrow pinned bottom-right so the text gets the full width */
  .hero .wrap{position:relative;align-self:stretch;align-items:center;padding-block:112px 32px;gap:16px}
  /* Title scales with the screen and always breaks as: We help startups / raise more money / at higher valuations / in less time */
  .hero h1{font-size:min(calc((100vw - var(--pad-l) - var(--pad-r)) / 8.55),60px);line-height:1.06;max-width:8.45em}
  .hero p{max-width:none;font-size:17px}
  .hero-copy{padding-bottom:76px}
  .hero-arrow{position:absolute;right:var(--pad-r);bottom:32px;margin:0}
  .thesis{overflow-x:clip}
  .thesis .wrap{padding-bottom:24px;gap:24px}
  /* Pull the diagram up past its built-in top padding so it sits closer to the thesis text */
  .venn{--vw:calc((100vw - 40px) * 680 / 576);width:var(--vw);max-width:none;justify-self:start;margin-left:calc((100% - var(--vw)) / 2);margin-top:calc(var(--vw) * -.09 - 15px)}
  .proof .wrap{padding-bottom:40px}
  .contact .wrap{padding-top:40px}
}

/* Touch: tapping the down/up arrows just scrolls, with no hover fill, arrow animation or tap flash */
.hero-arrow,.to-top{-webkit-tap-highlight-color:transparent}
@media (hover:none){
  .hero-arrow:hover,.hero-arrow:focus{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
  .to-top:hover,.to-top:focus{background:transparent;color:var(--fg)}
  .hero-arrow:hover svg,.hero-arrow:focus svg,.to-top:hover svg,.to-top:focus svg{animation:none}
}