/* Lugia. Black stage, pearl type, one rose accent taken from the wordmark's "g".
   System type on purpose: SF Pro on Apple devices, Segoe UI Variable on Windows (where the app runs), both with optical sizing. */
:root{
  --bg:#000;--surface:#121214;--surface-2:#1b1b1e;--ink:#f5f5f7;--ink-2:#a1a1a6;--line:rgba(255,255,255,.12);
  --rose:#e8a9b4;--rose-deep:#c3808b;--rose-glow:rgba(232,169,180,.16);
  --paper:#f5f5f7;--paper-ink:#1d1d1f;--paper-2:#515154;
  --max:1180px;--gutter:clamp(20px,5vw,48px);--edge:max(var(--gutter),calc((100vw - var(--max)) / 2));
  --ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI Variable Display","Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;
  interpolate-size:allow-keywords;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.47 var(--font);letter-spacing:-.011em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-optical-sizing:auto;overflow-x:clip}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
h1,h2,h3,h4{font-weight:700;color:var(--ink)}
p{color:var(--ink-2)}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
::selection{background:var(--rose);color:#1a0b0f}
:focus-visible{outline:2px solid var(--rose);outline-offset:3px;border-radius:6px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:10px;z-index:200;padding:10px 16px;border-radius:10px;background:var(--ink);color:#000;font-weight:600;transform:translateY(-200%);transition:transform .3s var(--ease)}
.skip-link:focus{transform:none}
.wrap{width:100%;max-width:calc(var(--max) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter)}
.icon{width:18px;height:18px;flex:none}

/* Type. Tracking tightens as size grows; leading tightens with it. */
.kicker{font-size:17px;font-weight:600;color:var(--rose);letter-spacing:-.01em;margin-bottom:14px}
h2{font-size:clamp(40px,6vw,80px);line-height:1.04;letter-spacing:-.035em}
h2 span,h1 span{color:var(--ink-2)}
h3{font-size:21px;line-height:1.24;letter-spacing:-.02em;font-weight:650}
.lede{font-size:clamp(19px,1.9vw,23px);line-height:1.38;font-weight:500;letter-spacing:-.018em;color:var(--ink-2);max-width:40ch}
.fine{font-size:13px;line-height:1.5;color:var(--ink-2);letter-spacing:0}
.center-head{text-align:center;display:grid;justify-items:center;gap:0}
.center-head .lede{margin-top:22px}

/* Buttons. Feedback on press, not on release. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:999px;font-size:17px;font-weight:550;letter-spacing:-.015em;white-space:nowrap;transition:background-color .25s var(--ease),color .25s var(--ease),box-shadow .25s var(--ease),transform .12s ease-out}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--rose);color:#1a0b0f}
.btn-primary:hover{background:#f2bcc5}
.btn-ghost{color:var(--ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.32)}
.btn-ghost:hover{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)}
.btn-sm{min-height:34px;padding:0 15px;font-size:14px}
.actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.link{display:inline-flex;align-items:center;gap:6px;color:var(--rose);font-weight:550;min-height:44px}
.link .icon{transition:transform .4s var(--ease)}
.link:hover .icon{transform:translateX(4px)}
.link.center{display:flex;width:max-content;margin:48px auto 0}
.inline{color:var(--rose);text-decoration:underline;text-underline-offset:3px}

/* Navigation: the one translucent layer. Transparent over the hero, materializes once content scrolls under it. */
.nav{position:fixed;inset:0 0 auto;z-index:100;transition:background-color .4s var(--ease),backdrop-filter .4s var(--ease),-webkit-backdrop-filter .4s var(--ease)}
.nav::after{content:"";position:absolute;inset:auto 0 0;height:1px;background:var(--line);opacity:0;transition:opacity .4s}
.nav.scrolled,.nav.open{background:rgba(10,10,12,.72);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
.nav.scrolled::after{opacity:1}
.nav-inner{position:relative;z-index:2;display:flex;align-items:center;gap:28px;height:56px;max-width:calc(var(--max) + var(--gutter) * 2);margin:0 auto;padding-inline:var(--gutter)}
.nav-brand{display:flex;align-items:center;min-height:44px;margin-right:auto}
.nav-brand img{width:88px;height:auto}
.nav-links{display:flex;gap:28px;font-size:14px}
.nav-links a{color:rgba(245,245,247,.8);transition:color .2s;padding:12px 0}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-toggle{display:none;position:relative;width:44px;height:44px;margin-right:-10px}
.nav-toggle span{position:absolute;left:13px;width:18px;height:1.5px;border-radius:2px;background:var(--ink);transition:transform .45s var(--ease)}
.nav-toggle span:first-child{top:18px}.nav-toggle span:last-child{top:25px}
.nav.open .nav-toggle span:first-child{transform:translateY(3.5px) rotate(45deg)}
.nav.open .nav-toggle span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.nav.open{bottom:0}
.nav-menu{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;gap:6px;padding:96px var(--gutter) 40px;background:rgba(0,0,0,.94);visibility:hidden;opacity:0;transition:opacity .35s var(--ease),visibility 0s .35s}
.nav-menu>a:not(.btn){font-size:32px;font-weight:700;letter-spacing:-.03em;padding:6px 0;opacity:0;transform:translateY(-10px);transition:opacity .4s var(--ease),transform .5s var(--ease)}
.nav-menu .btn{margin-top:28px;align-self:flex-start;opacity:0;transition:opacity .4s var(--ease) .25s}
.nav.open .nav-menu{visibility:visible;opacity:1;transition:opacity .35s var(--ease)}
.nav.open .nav-menu>*{opacity:1;transform:none}
.nav.open .nav-menu>a:nth-child(2){transition-delay:.04s}.nav.open .nav-menu>a:nth-child(3){transition-delay:.08s}.nav.open .nav-menu>a:nth-child(4){transition-delay:.12s}.nav.open .nav-menu>a:nth-child(5){transition-delay:.16s}

/* Hero: full-bleed art that settles into a rounded frame as you scroll away from it. --p is scroll progress 0..1, set by app.js. */
.hero{position:relative;height:100svh;min-height:620px;max-height:1100px;display:grid;align-items:end;overflow:clip;--p:0}
.hero-media{position:absolute;inset:0;overflow:hidden;transform:scale(calc(1 - var(--p) * .1)) translateZ(0);border-radius:calc(var(--p) * 48px);transform-origin:50% 0}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;animation:hero-in 2.2s var(--ease) both}
.hero-media::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 75% 70% at 50% 45%,transparent 25%,rgba(0,0,0,.98) 100%),linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4)),linear-gradient(180deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.78) 10%,rgba(0,0,0,0) 32%,rgba(0,0,0,.2) 52%,rgba(0,0,0,.92) 88%,#000 100%),radial-gradient(90% 60% at 50% 100%,rgba(0,0,0,.6),transparent 70%)}
.hero-copy{position:relative;z-index:1;text-align:center;display:grid;justify-items:center;padding-bottom:clamp(96px,19vh,210px);transform:translateY(calc(var(--p) * -80px));opacity:calc(1 - var(--p) * 1.6)}
.hero-kicker{font-size:clamp(17px,1.6vw,21px);font-weight:600;color:var(--ink);letter-spacing:-.015em;margin-bottom:18px;animation:rise 1.1s var(--ease) .2s both}
.hero h1{font-size:clamp(50px,9.4vw,132px);line-height:.98;letter-spacing:-.048em;font-weight:750}
.hero h1 .line{display:block;animation:rise 1.2s var(--ease) both}
.hero h1 .line:first-child{color:var(--ink);animation-delay:.32s}
.hero h1 .line:last-child{animation-delay:.46s;padding-bottom:.06em}
.accent{background:linear-gradient(100deg,#ffd9df 0%,var(--rose) 45%,var(--rose-deep) 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.hero-sub{max-width:38ch;margin-top:26px;font-size:clamp(18px,1.7vw,21px);line-height:1.4;font-weight:500;color:rgba(245,245,247,.78);animation:rise 1.2s var(--ease) .6s both}
.hero .actions{justify-content:center;margin-top:34px;animation:rise 1.2s var(--ease) .74s both}
@keyframes hero-in{from{opacity:0;transform:scale(1.14);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}

/* Statement: words light up as the paragraph passes through the viewport. */
.statement{padding-block:clamp(64px,12vh,120px)}
.statement p{font-size:clamp(30px,4.4vw,60px);line-height:1.13;font-weight:700;letter-spacing:-.032em;color:var(--ink);max-width:24ch}
.js .statement .w{color:rgba(245,245,247,.16);transition:color .5s var(--ease)}
.js .statement .w.on{color:var(--ink)}

/* ESP: the copy scrolls, the stage stays. Each step adds one layer of the overlay. */
.esp{padding-block:40px clamp(80px,12vh,140px)}
.esp-head{max-width:820px}
.esp-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,88px)}
.esp-steps{counter-reset:step}
.esp-steps li{min-height:72vh;display:flex;flex-direction:column;justify-content:center;max-width:400px;transition:opacity .6s var(--ease)}
.esp-steps li:first-child{min-height:60vh}
.esp-steps h3{font-size:clamp(28px,3vw,40px);letter-spacing:-.03em;margin-bottom:12px}
.esp-steps p{font-size:19px;line-height:1.42}
.js .esp-steps li{opacity:.26}
.js .esp-steps li.active{opacity:1}
.esp-sticky{position:sticky;top:0;height:100svh;align-self:start;display:flex;align-items:center}
.esp-stage{position:relative;width:100%;aspect-ratio:8/5;border-radius:clamp(20px,2.4vw,32px);overflow:hidden;background:#060607;box-shadow:0 0 0 1px var(--line),0 40px 120px -40px rgba(0,0,0,.9)}
.esp-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 60%;opacity:.42;filter:saturate(.7) brightness(.8)}
.esp-stage figcaption{position:absolute;left:16px;bottom:12px;font-size:12px;color:var(--ink-2)}
.esp-svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke-linecap:round;stroke-linejoin:round}
.esp-svg text{font-family:var(--font);font-weight:650;text-anchor:middle;fill:var(--ink);stroke:none;letter-spacing:0}
.esp-skel>*{stroke:rgba(255,255,255,.92);stroke-width:2}
.esp-box{stroke:#fff;stroke-width:2.2}
.esp-dist{fill:var(--ink-2);font-weight:500}
.esp-player *{transition:stroke .6s var(--ease),fill .6s var(--ease),stroke-dashoffset 1.4s var(--ease)}
.esp-stage.s1 .is-hidden .esp-skel>*,.esp-stage.s1 .is-hidden .esp-box{stroke:var(--rose)}
.esp-stage.s1 .is-hidden text,.esp-stage.s1 .is-hidden .esp-dist{fill:var(--rose)}
.esp-wall rect{fill:rgba(255,255,255,.05);stroke:rgba(255,255,255,.2);stroke-dasharray:3 6}
.esp-wall text{fill:var(--rose);font-weight:500}
.esp-soul circle:first-child{fill:var(--rose);stroke:none}
.esp-soul-ring{stroke:var(--rose);stroke-opacity:.5;stroke-width:1.5}
.esp-soul text{fill:var(--rose);font-weight:500}
.esp-trooper rect{stroke:rgba(255,255,255,.7);stroke-width:1.5}
.esp-trooper text{fill:var(--ink-2);font-weight:500}
.esp-sinner path{stroke:var(--rose);stroke-width:2;fill:var(--rose-glow)}
.esp-sinner text{fill:var(--ink);font-weight:500}
.esp-snap path{stroke:rgba(255,255,255,.55);stroke-width:1.4}
.js .esp-layer{opacity:0;transition:opacity .7s var(--ease)}
.js .esp-stage.s0 .esp-players,.js .esp-stage.s1 .esp-wall,.js .esp-stage.s2 .esp-world,.js .esp-stage.s3 .esp-snap{opacity:1}
.js .esp-players path,.js .esp-snap path{stroke-dasharray:1;stroke-dashoffset:1}
.js .esp-snap path{transition:stroke-dashoffset 1.2s var(--ease)}
.js .esp-stage.s0 .esp-players path,.js .esp-stage.s3 .esp-snap path{stroke-dashoffset:0}
.js .esp-world>g{transform-box:fill-box;transform-origin:center;transform:scale(.4);opacity:0;transition:transform .8s var(--ease),opacity .6s var(--ease)}
.js .esp-stage.s2 .esp-world>g{transform:none;opacity:1}
.js .esp-stage.s2 .esp-world>g:nth-child(2){transition-delay:.06s}.js .esp-stage.s2 .esp-world>g:nth-child(3){transition-delay:.12s}.js .esp-stage.s2 .esp-world>g:nth-child(4){transition-delay:.18s}.js .esp-stage.s2 .esp-world>g:nth-child(5){transition-delay:.24s}.js .esp-stage.s2 .esp-world>g:nth-child(6){transition-delay:.3s}.js .esp-stage.s2 .esp-world>g:nth-child(7){transition-delay:.36s}
.esp-copy>.link{margin-bottom:8vh}

/* Aim demo: a live, interruptible spring chasing the chosen bone or its predicted point. */
.aim{padding-block:clamp(60px,8vh,100px) clamp(100px,16vh,180px)}
.aim-demo{margin-top:clamp(48px,7vh,80px);border-radius:clamp(22px,3vw,36px);background:radial-gradient(70% 90% at 50% 40%,#151518 0%,#0a0a0b 70%);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;position:relative}
.aim-demo svg{width:100%;height:auto;fill:none;stroke-linecap:round;stroke-linejoin:round}
.aim-fov{stroke:rgba(255,255,255,.2);stroke-width:1.5;stroke-dasharray:2 9;fill:rgba(255,255,255,.015)}
.aim-target .esp-skel>*{stroke-width:2.6;transition:stroke .4s}
.aim-demo.out .aim-target .esp-skel>*{stroke:rgba(255,255,255,.3)}
.aim-lead{stroke:var(--rose);stroke-width:1.5;stroke-dasharray:3 6;transition:opacity .3s}
.aim-predict{stroke:var(--rose);stroke-width:2;transition:opacity .3s}
.aim-cross circle{stroke:var(--rose);stroke-width:2;fill:var(--rose-glow)}
.aim-cross path{stroke:var(--rose);stroke-width:2}
.aim-demo.no-predict .aim-lead,.aim-demo.no-predict .aim-predict,.aim-demo.out .aim-lead,.aim-demo.out .aim-predict{opacity:0}
.aim-controls{display:flex;flex-wrap:wrap;gap:12px 20px;justify-content:center;align-items:center;padding:0 20px 20px;margin-top:-8px}
.seg{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:2px;padding:4px;border:0;margin:0;border-radius:999px;background:rgba(255,255,255,.07)}
.seg label{position:relative;cursor:pointer}
.seg input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.seg span{display:flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;font-size:15px;font-weight:550;color:var(--ink-2);transition:background-color .3s var(--ease),color .3s var(--ease)}
.seg label:hover span{color:var(--ink)}
.seg input:checked+span{background:rgba(255,255,255,.16);color:var(--ink)}
.seg input:focus-visible+span{outline:2px solid var(--rose);outline-offset:1px}
.switch{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:15px;font-weight:550;cursor:pointer;position:relative}
.switch input{position:absolute;opacity:0;width:51px;height:31px;margin:0;cursor:pointer}
.switch-track{position:relative;width:51px;height:31px;border-radius:999px;background:rgba(255,255,255,.18);transition:background-color .3s var(--ease)}
.switch-track::after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.25);transition:transform .45s cubic-bezier(.3,1.25,.5,1)}
.switch input:checked+.switch-track{background:var(--rose-deep)}
.switch input:checked+.switch-track::after{transform:translateX(20px)}
.switch input:focus-visible+.switch-track{outline:2px solid var(--rose);outline-offset:2px}
.switch:active .switch-track::after{width:31px}
.switch input:checked:active+.switch-track::after{transform:translateX(16px)}
.aim-demo figcaption{position:absolute;left:18px;top:14px;font-size:12px;color:var(--ink-2)}
.aim-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);margin-top:clamp(56px,8vh,88px)}
.aim-notes h3{margin-bottom:8px}

/* Carousel: native scroll-snap, edge-aligned with the page grid, buttons for mouse users. */
.more{padding-block:clamp(80px,12vh,140px)}
.more-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px}
.car-nav{display:flex;gap:12px;flex:none}
.round{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.1);color:var(--ink);transition:background-color .25s,opacity .25s,transform .12s ease-out}
.round:hover{background:rgba(255,255,255,.18)}
.round:active{transform:scale(.92)}
.round:disabled{opacity:.3;cursor:default}
.car{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--edge);scrollbar-width:none;overscroll-behavior-x:contain}
.car::-webkit-scrollbar{display:none}
.car:focus-visible{outline-offset:-2px;border-radius:0}
.car-track{display:flex;gap:20px;width:max-content;padding:6px var(--edge) 28px}
.card{scroll-snap-align:start;width:clamp(272px,29vw,360px)}
.card>a{display:flex;flex-direction:column;height:100%;min-height:480px;border-radius:28px;background:var(--surface);overflow:hidden;transition:transform .6s var(--ease),background-color .4s var(--ease)}
.card>a:hover{transform:scale(1.018);background:var(--surface-2)}
.card>a:active{transform:scale(.985);transition-duration:.15s}
.card>a:focus-visible{outline-offset:-2px;border-radius:28px}
.card-art{width:100%;height:auto;padding:30px 18px 0;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.card-art *{transform-box:fill-box;transform-origin:center;transition:transform .9s var(--ease),opacity .6s var(--ease)}
.a-faint{stroke:rgba(255,255,255,.22)}.a-ring{stroke:rgba(255,255,255,.78)}.a-accent{stroke:var(--rose)}.a-thick{stroke-width:7}.a-dash{stroke-dasharray:4 8}
.a-fill{fill:var(--rose);stroke:none}.a-dot{fill:rgba(255,255,255,.55);stroke:none}
.a-sweep{fill:rgba(232,169,180,.2);stroke:none;transform-box:view-box;transform-origin:160px 100px}
.card>a:hover .a-sweep{animation:sweep 2.6s linear infinite}
.card-soul-aim>a:hover .a-ring{transform:scale(1.22)}
.card-soul-aim>a:hover .a-fill{transform:scale(1.35)}
.card-triggerbot .a-grow{transform-origin:left center;transform:scaleX(.45)}
.card-triggerbot>a:hover .a-grow{transform:none}
.card-auto-parry .a-incoming{transform:translate(48px,-38px);opacity:.5}
.card-auto-parry>a:hover .a-incoming{transform:none;opacity:1}
.card-visuals>a:hover .a-accent{transform:scale(1.5)}
.card-visuals>a:hover .a-fill{transform:translateX(8px)}
.card-settings>a:hover .k1{transform:translateX(72px)}.card-settings>a:hover .k2{transform:translateX(-64px)}.card-settings>a:hover .k3{transform:translateX(40px)}
@keyframes sweep{to{transform:rotate(360deg)}}
.card-copy{display:block;margin-top:auto;padding:28px 30px 32px}
.card-copy .kicker{display:block;font-size:15px;margin-bottom:6px}
.card h3{font-size:28px;letter-spacing:-.03em;line-height:1.1}
.card-text{display:block;margin-top:10px;color:var(--ink-2);font-size:16px;line-height:1.45}

/* Principles: the one light section, inset like a sheet, so the page breathes once before the offer. */
.principles{margin-inline:clamp(8px,1.4vw,20px);border-radius:clamp(24px,3.4vw,48px);background:var(--paper);color:var(--paper-ink);padding-block:clamp(96px,15vh,170px)}
.principles h2{color:var(--paper-ink);max-width:15ch}
.principles h2 span{color:#86868b}
.pr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);margin-top:clamp(56px,9vh,100px)}
.pr-grid article{border-top:1px solid rgba(0,0,0,.14);padding-top:24px}
.pr-grid h3{color:var(--paper-ink);font-size:24px;margin-bottom:10px}
.pr-grid p{color:var(--paper-2)}

/* Access */
.access{padding-block:clamp(110px,18vh,200px) clamp(80px,12vh,140px)}
.access-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px;margin-top:clamp(48px,7vh,80px);align-items:stretch}
.tile{border-radius:clamp(24px,2.6vw,34px);padding:clamp(28px,4.2vw,56px);background:var(--surface);display:flex;flex-direction:column;align-items:flex-start}
.tile h3{font-size:clamp(26px,2.6vw,34px);letter-spacing:-.03em;line-height:1.1;margin-bottom:12px}
.tile>p:not(.kicker):not(.price):not(.fine){max-width:44ch}
.tile .btn{margin-top:auto}
.tile-free{background:radial-gradient(120% 90% at 100% 0%,rgba(195,128,139,.22) 0%,rgba(195,128,139,0) 55%),var(--surface);box-shadow:inset 0 0 0 1px rgba(232,169,180,.2)}
.tile-free .btn{margin-top:36px}
.tile-free .fine{margin-top:14px}
.tile-private .btn{margin-top:auto}
.tile-private h3{margin-top:auto;padding-top:48px}
.tile-private>p:not(.kicker){margin-bottom:36px}
.price{font-size:clamp(104px,15vw,196px);line-height:.86;font-weight:750;letter-spacing:-.06em;margin:4px 0 28px;background:linear-gradient(170deg,#fff 10%,var(--rose) 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.price span{font-size:.42em;vertical-align:.95em;letter-spacing:-.02em;margin-right:.04em}
.ticks{display:grid;gap:10px;margin-top:22px}
.ticks li{display:flex;gap:10px;align-items:flex-start;color:var(--ink)}
.ticks .icon,.group .icon{color:var(--rose);margin-top:3px}

/* FAQ: native <details>, animated where the browser can interpolate to auto. */
.faq{padding-block:clamp(80px,12vh,140px)}
.faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,6vw,96px);align-items:start}
.faq-side{position:sticky;top:96px}
.faq-side h2{font-size:clamp(36px,4.4vw,56px)}
.faq-side .link{margin-top:12px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item:first-child{border-top:1px solid var(--line)}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:44px;padding:24px 0;cursor:pointer;list-style:none;border-radius:6px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item h3{font-size:clamp(19px,1.8vw,22px);font-weight:600;transition:color .25s}
.faq-item summary:hover h3{color:#fff}
.faq-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);flex:none;transition:transform .5s var(--ease),background-color .3s}
.faq-item[open] .faq-mark{transform:rotate(45deg);background:rgba(232,169,180,.18);color:var(--rose)}
.faq-item::details-content{block-size:0;overflow:hidden;opacity:0;transition:block-size .5s var(--ease),opacity .4s var(--ease),content-visibility .5s allow-discrete}
.faq-item[open]::details-content{block-size:auto;opacity:1}
.faq-body p{padding:0 56px 28px 0;max-width:62ch}

/* Finale */
.finale{padding-block:clamp(120px,20vh,220px) clamp(100px,16vh,180px);text-align:center}
.finale .wrap{display:grid;justify-items:center}
.finale h2{font-size:clamp(64px,13vw,180px);letter-spacing:-.06em;line-height:.92}
.finale .lede{margin-top:26px}
.finale .actions{justify-content:center;margin-top:36px}
.finale .fine{margin-top:22px}

/* Footer: one row of real links, one row of legal. */
.foot{border-top:1px solid var(--line);padding-block:44px 36px;font-size:14px}
.foot-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.foot-brand img{width:80px;height:auto}
.foot-links{display:flex;flex-wrap:wrap;gap:4px 24px}
.foot-links a{color:var(--ink-2);padding:10px 0;transition:color .2s}
.foot-links a:hover{color:var(--ink)}
.foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.foot-legal p{font-size:13px}

/* Inner pages */
.page-hero{padding-block:calc(56px + clamp(72px,14vh,150px)) clamp(56px,9vh,100px)}
.page-hero h1{font-size:clamp(46px,7.6vw,104px);line-height:1;letter-spacing:-.045em;max-width:14ch}
.page-hero .lede{margin-top:26px;max-width:46ch}
.page-hero .actions{margin-top:34px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--ink-2);margin-bottom:28px}
.crumbs a{transition:color .2s;padding:10px 0;margin-block:-10px}
.crumbs a:hover{color:var(--ink)}
.crumbs [aria-current]{color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:44px}
.chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;background:rgba(255,255,255,.07);font-size:15px;font-weight:550;transition:background-color .25s,transform .12s ease-out}
.chips a:hover{background:rgba(255,255,255,.14)}
.chips a:active{transform:scale(.96)}
.chips.big a{min-height:56px;padding:0 24px;font-size:19px}
.inventory{padding-bottom:40px}
.inv-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);padding-block:clamp(48px,8vh,80px);border-top:1px solid var(--line)}
.inv-head{position:sticky;top:96px;align-self:start}
.inv-head h3{font-size:clamp(30px,3.4vw,44px);letter-spacing:-.035em;line-height:1.05;margin-bottom:14px}
.inv-head h3 a:hover{color:var(--rose)}
.inv-head .link{margin-top:10px}
.inv-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 32px}
.group h3,.group h4{font-size:17px;font-weight:650;letter-spacing:-.015em;margin-bottom:12px}
.group li{display:flex;gap:10px;align-items:flex-start;padding:5px 0;color:var(--ink-2);font-size:16px;line-height:1.45}
.dev{margin-top:clamp(56px,8vh,96px);border-radius:32px;padding:clamp(28px,4.4vw,60px);background:var(--surface)}
.dev h2{font-size:clamp(32px,4vw,52px)}
.dev .lede{margin-top:16px;font-size:19px}
.dev-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:44px}
.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.detail-grid .group{border-radius:28px;background:var(--surface);padding:clamp(26px,3vw,36px)}
.detail-grid .group h3{font-size:22px;margin-bottom:16px}
.quote{margin-block:clamp(80px,14vh,150px);max-width:900px}
.quote p{font-size:clamp(28px,3.6vw,48px);line-height:1.14;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.scope{border-radius:28px;box-shadow:inset 0 0 0 1px var(--line);padding:clamp(26px,3.6vw,44px);display:grid;gap:12px;max-width:900px}
.scope h2{font-size:24px;letter-spacing:-.02em}
.related{padding-block:clamp(80px,12vh,130px) 0}
.related h2{font-size:clamp(30px,3.4vw,44px);margin-bottom:28px}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.related-link{display:flex;flex-direction:column;gap:6px;border-radius:24px;background:var(--surface);padding:30px;transition:transform .6s var(--ease),background-color .4s}
.related-link:hover{transform:translateY(-4px);background:var(--surface-2)}
.related-link .kicker{margin:0;font-size:15px}
.related-title{font-size:24px;font-weight:700;letter-spacing:-.025em}
.related-text{color:var(--ink-2);font-size:16px}
.alpha-access{padding-bottom:40px}
.alpha-access .access-grid{margin-top:0}
.notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}
.notes article{border-radius:28px;background:var(--surface);padding:clamp(26px,3.6vw,44px)}
.notes h2{font-size:24px;letter-spacing:-.02em;margin-bottom:12px}
.inside{padding-block:clamp(80px,12vh,140px)}
.inside h2{font-size:clamp(36px,4.6vw,60px)}
.narrow{max-width:calc(820px + var(--gutter) * 2)}
.faq-page{padding-top:0}
.faq-contact{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin-top:64px;padding:clamp(26px,3.6vw,40px);border-radius:28px;background:var(--surface)}
.faq-contact h2{font-size:24px;letter-spacing:-.02em}
.legal{padding-bottom:clamp(80px,12vh,140px)}
.legal article{padding-block:30px;border-top:1px solid var(--line);display:grid;gap:10px}
.legal h2{font-size:24px;letter-spacing:-.02em}
.not-found{min-height:88svh;display:grid;align-items:center}

/* Reveal: content materializes (opacity, lift, focus) once, as it enters. Without JS it is simply there. */
.js .reveal{opacity:0;transform:translateY(36px);filter:blur(8px);transition:opacity 1s var(--ease),transform 1.3s var(--ease),filter 1s var(--ease);transition-delay:var(--d,0ms)}
.js .reveal.in{opacity:1;transform:none;filter:none}
.js .card.reveal{transform:none}
.js .card.reveal:not(.in)>a{transform:translateX(64px)}

/* Responsive */
@media (max-width:1023px){
  .esp-grid,.faq-grid,.inv-row{grid-template-columns:1fr}
  .esp-sticky{position:sticky;top:56px;height:auto;padding-block:12px;order:-1;z-index:2;background:linear-gradient(#000 85%,rgba(0,0,0,0))}
  .esp-steps li,.esp-steps li:first-child{min-height:56vh;max-width:none}
  .esp-copy>.link{margin-bottom:0}
  .faq-side,.inv-head{position:static}
  .access-grid{grid-template-columns:1fr}
  .tile-private h3{margin-top:0;padding-top:12px}
  .related-grid{grid-template-columns:1fr}
}
@media (max-width:833px){
  .nav-links,.nav-cta{display:none}
  .nav-toggle{display:block}
  .aim-notes,.pr-grid,.dev-grid,.notes,.inv-groups{grid-template-columns:1fr}
  .more-head{align-items:center}
  .card>a{min-height:440px}
  .statement p{max-width:none}
  .faq-body p{padding-right:0}
  .foot-legal{flex-direction:column}
}
@media (max-width:479px){
  body{font-size:16px}
  .hero .actions,.finale .actions{flex-direction:column;align-items:stretch;width:100%;max-width:320px}
  .hero h1{font-size:clamp(44px,13.4vw,60px)}
  .seg span{padding:0 11px;font-size:14px}
  .car-nav{display:none}
}

/* Reduced motion: keep every state change, drop movement. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important}
  .hero-media,.hero-copy{transform:none!important;border-radius:0!important;opacity:1!important}
  .js .reveal,.js .card.reveal:not(.in)>a{transform:none;filter:none}
  .js .reveal{transition:opacity .4s ease}
  .js .esp-players path,.js .esp-snap path{stroke-dasharray:none}
  .js .esp-world>g{transform:none}
  .card>a:hover,.related-link:hover{transform:none}
  .card-art *{transition:none}
}
@media (prefers-reduced-transparency:reduce){
  .nav.scrolled,.nav.open{background:#0a0a0c;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-contrast:more){
  :root{--ink-2:#d2d2d7;--line:rgba(255,255,255,.4)}
  .js .statement .w{color:rgba(245,245,247,.5)}
}

.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;user-select:none}
