:root{
  color-scheme:dark;
  --bg:#07090d;
  --bg-2:#0b0e14;
  --surface:#10141b;
  --ink:#f1f3f7;
  --muted:#9ba4b2;
  --secondary:#697384;
  --line:rgba(206,218,233,.12);
  --line-hi:rgba(206,218,233,.27);
  --chrome:linear-gradient(108deg,#7b8796 0%,#edf4ff 18%,#8b98aa 34%,#f5f8fc 47%,#758395 65%,#e3eaf4 79%,#718096 100%);
  --ease:cubic-bezier(.19,.75,.21,1);
  --gutter:clamp(20px,5.4vw,100px);
  --mono:'Geist Mono',ui-monospace,monospace;
  --sans:'Geist',Inter,ui-sans-serif,system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;min-width:320px;overflow-x:clip;color:var(--ink);font:400 16px/1.54 var(--sans);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#080b10 0%,#07090d 58%,#07090d 100%)}
[hidden]{display:none!important}
::selection{background:#c4d2e4;color:#090c13}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid #c8d8f0;outline-offset:4px}
.skip{position:fixed;left:20px;top:-90px;z-index:100;padding:10px 16px;color:#080a10;background:#fff;border-radius:8px}
.skip:focus{top:12px}
.honeypot{position:absolute!important;left:-99999px!important;width:1px!important;height:1px!important;opacity:0!important}
.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}
.layout{width:min(1600px,100%);padding-inline:var(--gutter);margin-inline:auto}
.micro{font:500 10px/1.6 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.metal-text{background:var(--chrome);color:transparent;-webkit-background-clip:text;background-clip:text}
.hairline{height:1px;position:fixed;top:0;left:0;right:0;z-index:100;background:linear-gradient(90deg,transparent,#c6d3e3 50%,transparent);opacity:.2;pointer-events:none}

/* Quiet editorial navigation. */
.topbar{position:fixed;z-index:70;top:0;left:0;right:0;height:82px;background:rgba(7,9,13,.94);border-bottom:1px solid rgba(216,227,241,.08)}
.topbar-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:inline-flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.11em;font-size:15px;white-space:nowrap}
.brand img{width:36px;height:36px;object-fit:cover;border-radius:50%;border:1px solid rgba(220,232,246,.18)}
.brand sup{align-self:flex-start;margin:4px 0 0 -8px;color:#858e9c;font:500 9px var(--mono)}
.navlinks{display:flex;gap:clamp(16px,2.4vw,38px);align-items:center;font:500 10px var(--mono);letter-spacing:.12em;color:#aab2bf;white-space:nowrap}
.navlinks a{transition:color .2s}.navlinks a:hover{color:#fff}
.navright{display:flex;align-items:center;gap:22px;white-space:nowrap}
.edition{color:#767f8d;font:500 9px var(--mono);letter-spacing:.11em}
.navcta{border:1px solid var(--line-hi);border-radius:999px;display:flex;gap:24px;align-items:center;justify-content:center;padding:11px 16px;font:500 10px var(--mono);letter-spacing:.12em;transition:background .25s,border-color .25s}
.navcta:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.4)}
.navcta span{font-size:16px}

/* Hero: no noise texture, no tiled SVG turbulence, no follower flare. */
.hero{position:relative;padding-top:82px;border-bottom:1px solid var(--line);overflow:hidden}
.hero::before{content:"";position:absolute;inset:82px 0 0;pointer-events:none;background:radial-gradient(circle at 70% 45%,rgba(115,132,164,.085) 0%,rgba(115,132,164,.020) 30%,transparent 54%)}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.07fr) minmax(0,.93fr);gap:clamp(14px,2.8vw,50px);align-items:center;min-height:calc(100svh - 142px)}
.hero-copy{position:relative;z-index:3;padding-top:clamp(48px,7vh,80px);padding-bottom:clamp(12px,3vh,35px);max-width:790px}
.hero-kicker{display:flex;align-items:center;gap:12px;margin:0 0 29px;color:#9ba8bb}
.pin{height:6px;width:6px;display:inline-block;border-radius:50%;background:#dce9fa;box-shadow:0 0 0 4px rgba(220,233,250,.055)}
.kicker-divider{color:#576271}
.hero-title{margin:0;font-size:clamp(58px,6.8vw,110px);line-height:.91;letter-spacing:-.086em;font-weight:700;white-space:nowrap}
.title-row{display:block;overflow:hidden;padding:.065em .07em .025em 0;margin:-.05em -.07em -.02em 0}
.title-row>span{display:block;transform:translateY(110%);animation:title-up 1.12s var(--ease) forwards}
.title-row:nth-child(2)>span{animation-delay:.10s}
.title-row:nth-child(3)>span{animation-delay:.21s}
.title-row:nth-child(4)>span{animation-delay:.32s}
@keyframes title-up{to{transform:translateY(0)}}
.tone-muted{font-weight:400;color:#adb4c1}
.hero-subcopy{color:#b3bcc9;margin:25px 0 0;max-width:46ch;font-size:clamp(15px,1.25vw,18px);line-height:1.56}
.lead-form{position:relative}
.hero-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin:23px 0 0;max-width:580px}
.lead-form input[type=email],.signup-card input[type=email]{display:block;min-width:0;height:53px;padding:0 16px;border:1px solid var(--line-hi);background:rgba(255,255,255,.018);color:#f4f6fa;border-radius:9px;outline:0;transition:border-color .2s,background .2s,box-shadow .2s}
.lead-form input::placeholder,.signup-card input::placeholder{color:#687485}
.lead-form input:focus,.signup-card input:focus{border-color:#b9c8db;background:rgba(255,255,255,.045);box-shadow:0 0 0 3px rgba(186,202,225,.10)}
.button{min-height:53px;display:inline-flex;justify-content:center;align-items:center;gap:16px;padding:0 19px;border-radius:9px;border:1px solid transparent;font:500 10px var(--mono);letter-spacing:.08em;white-space:nowrap;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.button span{font-size:17px}
.button:hover{transform:translateY(-2px)}
.button-metal{background:linear-gradient(115deg,#e8edf5,#a5b2c2 48%,#f2f5fa);color:#081019;border-color:rgba(240,246,255,.38);box-shadow:0 14px 30px rgba(0,0,0,.24),0 1px rgba(255,255,255,.58) inset}
.button-metal:hover{box-shadow:0 17px 34px rgba(0,0,0,.32),0 1px rgba(255,255,255,.58) inset}
.hero-form .form-status{grid-column:1/-1;margin:0}
.form-status{font-size:13px;line-height:1.5;min-height:0;color:#d7e4f3}
.form-status:empty{display:none}
.privacy-note{color:#788493;margin:10px 0 0;letter-spacing:.08em}
.hero-bottomline{display:flex;align-items:end;flex-wrap:wrap;gap:20px 27px;margin-top:23px;padding-top:20px;border-top:1px solid rgba(216,228,247,.10);max-width:580px}
.countdown-caption{display:block;color:#98a8be;margin-bottom:10px}
.countdown{display:flex;gap:0}
.countdown>div{min-width:61px;padding:0 12px;border-right:1px solid var(--line)}
.countdown>div:first-child{padding-left:0}
.countdown>div:last-child{border-right:0}
.countdown strong{display:block;font-size:24px;line-height:1.1;letter-spacing:-.04em;font-weight:600;font-variant-numeric:tabular-nums}
.countdown small{display:block;margin-top:5px;color:#737c8b;font:400 8px var(--mono);letter-spacing:.12em}
.text-link{display:flex;align-items:center;gap:10px;font:500 10px var(--mono);letter-spacing:.05em;margin-bottom:4px}
.play-circle{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--line-hi);font:400 18px var(--sans);transition:border-color .25s,transform .25s}
.text-link:hover .play-circle{transform:translateY(3px);border-color:#d5e1f0}
.hero-visual{position:relative;min-height:480px;height:clamp(490px,59vw,770px);display:grid;place-items:center;isolation:isolate;touch-action:pan-y}
.visual-guides{position:absolute;left:50%;top:50%;width:min(111%,720px);height:auto;transform:translate(-50%,-50%);pointer-events:none}
.medallion-stage{width:min(90%,620px);aspect-ratio:1;display:grid;place-items:center;perspective:1100px;touch-action:pan-y;position:relative}
.medallion{width:100%;aspect-ratio:1;position:relative;transform-style:preserve-3d;will-change:transform;cursor:grab;filter:drop-shadow(0 29px 47px rgba(0,0,0,.48))}
.medallion.dragging{cursor:grabbing}
.medallion-image{width:100%;height:100%;display:block;object-fit:cover;pointer-events:none;user-select:none;-webkit-user-drag:none;border-radius:50%;mask-image:radial-gradient(circle,#000 58%,#000 66%,rgba(0,0,0,.94) 70%,transparent 79%);transform:translateZ(12px)}
.medallion-depth{position:absolute;inset:10%;border-radius:50%;transform:translateZ(-6px);background:conic-gradient(from -25deg,#1a2532,#a2adbc,#27313e,#697989,#16202d,#aeb9c7,#263341,#1a2532);box-shadow:0 18px 24px rgba(0,0,0,.44);opacity:.75}
.medallion-edge{position:absolute;inset:13%;border-radius:50%;border:1px solid rgba(216,229,246,.13);transform:translateZ(17px);pointer-events:none}
.visual-label{position:absolute;left:0;top:20%;color:#a0adbf;display:flex;gap:9px;align-items:center;z-index:3}
.visual-label i{height:5px;width:5px;border-radius:50%;background:#d1deed}
.visual-footer{position:absolute;right:0;bottom:8%;display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right;color:#708093;z-index:3}
.visual-footer strong{font-weight:500;color:#c0cbd9}
.hero-foot{position:relative;display:flex;justify-content:space-between;align-items:center;padding-bottom:21px;padding-top:15px;color:#67717f}
.scroll-hint{display:flex;gap:15px;align-items:center;color:#b2bdca}
.scroll-hint b{font:400 20px var(--sans)}

/* Sticky manifesto: the large chrome progress line scrubs across all chapters. */
.manifesto{position:relative;height:410vh;background:#080a0e;border-bottom:1px solid var(--line)}
.manifesto-pin{height:100svh;min-height:540px;position:sticky;top:0;overflow:hidden;background:linear-gradient(130deg,#07090d,#0b1017 58%,#07090d)}
.manifesto-top{position:absolute;top:clamp(96px,12vh,128px);left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;color:#8a95a6}
.manifesto-top>span:first-child{color:#c2d0df}
.tiny-star{display:inline-block;height:6px;width:6px;background:#d5e4f7;border-radius:50%;margin-right:10px}
.manifesto-content{position:relative;display:grid;grid-template-columns:minmax(260px,.28fr) minmax(0,.72fr);gap:clamp(32px,6vw,110px);align-items:center;height:100%;z-index:3}
.manifesto-heading{max-width:290px}
.manifesto-heading p:first-child{color:#9caabc}
.manifesto-aside{font-size:clamp(18px,1.8vw,26px);line-height:1.4;color:#7f8a9a;letter-spacing:-.025em;margin:18px 0 0}
.scene-viewport{position:relative;height:360px;max-height:52svh}
.scene{position:absolute;inset:0;opacity:0;pointer-events:none;will-change:transform,opacity,clip-path}
.scene h2{margin:15px 0 21px;font-size:clamp(64px,8vw,133px);font-weight:700;line-height:.89;letter-spacing:-.09em;white-space:nowrap}
.scene h2 span{display:block}
.scene-number{color:#95a3b7}
.scene-copy{margin:0;color:#bbc3ce;max-width:43ch;font-size:clamp(16px,1.5vw,20px);line-height:1.5}
.scene .thin-word{font-weight:400;color:#a5afbd}
.manifesto-decor{position:absolute;width:min(49vw,710px);height:auto;right:-8%;top:49%;transform:translateY(-50%);opacity:.23;z-index:1;pointer-events:none}
.manifesto-decor svg{width:100%;height:auto;display:block;transform:rotate(var(--orbit-angle,0deg)) scale(var(--orbit-scale,1));transition:transform .07s linear}
.manifesto-progress{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(30px,6vh,65px);display:flex;align-items:center;gap:24px;z-index:5;color:#98a5b8}
.manifesto-progress .micro{white-space:nowrap}
.progress-track{height:2px;flex:1;position:relative;background:rgba(209,224,242,.16)}
.progress-track i{position:absolute;inset:0 auto 0 0;width:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,#8292aa,#eef4fb 58%,#9bacc2);box-shadow:0 0 8px rgba(232,242,255,.15)}
.progress-track .mark{position:absolute;width:5px;height:5px;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:#9aa7b9}
.progress-side{color:#667383}
.manifesto-side{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%) rotate(90deg) translateY(-100%);transform-origin:top right;z-index:4;color:#586575;white-space:nowrap}
.manifesto-side span{color:#d9e5f4}

/* Two worlds, expandable cards. */
.worlds{padding-block:clamp(105px,13vw,190px) clamp(100px,12vw,170px)}
.section-kicker{color:#a5b1c2;display:flex;align-items:center;gap:16px}
.section-kicker span{display:inline-block;height:1px;width:52px;background:var(--line-hi)}
.worlds-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.43fr);gap:45px;align-items:end;margin:25px 0 54px}
.worlds-head h2{margin:0;font-size:clamp(53px,6.8vw,111px);letter-spacing:-.078em;line-height:.94}
.worlds-head p{font-size:clamp(16px,1.3vw,19px);color:#a5adba;line-height:1.65;margin:0;max-width:40ch}
.worldcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.worldcard{background:#0b0f15;border:1px solid var(--line);border-radius:16px;padding:clamp(25px,3.1vw,45px);min-height:615px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:background .3s,border-color .3s;transform-style:preserve-3d}
.worldcard:hover{background:#10151e;border-color:rgba(223,233,248,.25)}
.card-top{display:flex;align-items:center;justify-content:space-between;color:#91a0b5}
.card-icon{width:42px;height:42px;border:1px solid var(--line-hi);display:grid;place-items:center;border-radius:50%;font:400 21px var(--sans);color:#d9e4f3}
.card-art{height:255px;display:grid;place-items:center;margin:11px 0 4px;position:relative}
.card-art::before{content:"";position:absolute;inset:12% 27%;border-radius:50%;border:1px solid rgba(233,241,254,.04)}
.card-art svg{width:min(100%,350px);height:100%;transition:transform .6s var(--ease)}
.worldcard:hover .card-art svg{transform:scale(1.055) rotate(-2deg)}
.worldcard h3{margin:4px 0 14px;font-size:clamp(36px,3.7vw,64px);letter-spacing:-.07em;line-height:.95;white-space:nowrap}
.card-intro,.card-extra{color:#9ea8b8;font-size:16px;line-height:1.6;max-width:47ch}
.card-intro{margin:0 0 10px}
.card-extra{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease);overflow:hidden}
.card-extra p{margin:0;overflow:hidden}
.worldcard.expanded .card-extra{grid-template-rows:1fr}
.worldcard.expanded .card-extra p{padding-block:9px}
.card-bottom{margin-top:auto;padding-top:26px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#6e7a8d;border-top:1px solid var(--line)}
.expand-card{background:none;border:0;color:#dce6f4;display:flex;align-items:center;gap:11px;font:500 10px var(--mono);letter-spacing:.1em;white-space:nowrap;padding:8px 0}
.expand-card span{font-size:20px;transition:transform .3s var(--ease)}
.worldcard.expanded .expand-card span{transform:rotate(45deg)}

/* Optional real film embed; hidden until a YouTube ID is configured. */
.video-section{padding-bottom:110px}
.video-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin:24px 0 32px}
.video-heading h2{font-size:clamp(40px,5.7vw,82px);letter-spacing:-.075em;line-height:.95;margin:0}
.video-heading p{color:var(--muted);max-width:31ch;font-size:17px}
.video-frame{aspect-ratio:16/9;border:1px solid var(--line-hi);border-radius:16px;background:linear-gradient(130deg,#10151e,#07090d 70%);display:grid;place-items:center;overflow:hidden;position:relative}
.video-frame::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 0 49.8%,rgba(255,255,255,.055) 50%,transparent 50.2%)}
.video-frame button{position:relative;z-index:1;display:flex;gap:20px;align-items:center;padding:16px 25px;border-radius:80px;border:1px solid var(--line-hi);background:rgba(255,255,255,.06);color:#f5f7fb;font:500 11px var(--mono);letter-spacing:.13em}
.video-frame button:hover{background:rgba(255,255,255,.12)}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.after-submit{display:flex;align-items:center;gap:14px;grid-column:1/-1;margin-top:6px;flex-wrap:wrap}
.download-link{font:500 10px var(--mono);letter-spacing:.07em;color:#edf4ff;text-decoration:underline;text-underline-offset:4px}

/* Editorial divider and final signup. */
.bridge{overflow:hidden;background:#d6dce5;color:#080b10;height:145px;display:flex;align-items:center;position:relative}
.bridge-line{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 115px,rgba(18,32,50,.06) 116px,transparent 117px);pointer-events:none}
.bridge-inner{display:flex;justify-content:space-between;align-items:center;gap:22px;width:100%;font-size:clamp(48px,8.2vw,126px);font-weight:700;line-height:1;letter-spacing:-.09em;white-space:nowrap}
.outline-word{color:transparent;-webkit-text-stroke:1px rgba(10,18,30,.48)}
.signup{padding-block:clamp(120px,15vw,220px) clamp(115px,14vw,200px)}
.signup-inner{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);gap:clamp(40px,6vw,100px);align-items:center}
.signup-eyebrow{color:#a5b3c7}
.signup-copy h2{font-size:clamp(60px,8vw,130px);font-weight:700;letter-spacing:-.085em;line-height:.92;margin:20px 0 26px}
.signup-copy>p:not(.micro){max-width:53ch;color:#a9b3c2;font-size:19px;line-height:1.6}
.signup-footnote{color:#708092;margin-top:44px}
.signup-card{background:#10141b;border:1px solid rgba(218,232,248,.18);padding:clamp(24px,3vw,44px);border-radius:18px;box-shadow:0 35px 100px rgba(0,0,0,.28)}
.signup-card>p:first-child{color:#95a3b8}
.signup-card h3{font-size:clamp(36px,3.8vw,62px);font-weight:600;letter-spacing:-.06em;line-height:1.05;margin:30px 0}
.signup-card label{display:block;color:#9eabbf;margin-bottom:9px}
.signup-card input[type=email],.signup-card .button{width:100%}
.signup-card .button{margin-top:12px}
.signup-card .form-status{margin:10px 0 0}
.signup-note{font-size:13px;color:#7e899a;margin:18px 0 0;line-height:1.5}
.footer{border-top:1px solid var(--line);padding-block:30px 42px}
.footer-inner{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:#798598}
.footer a:hover{color:#f1f5fa}
.appear{opacity:0;transform:translateY(23px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.appear.visible{opacity:1;transform:none}

@media(max-width:1330px){
  .hero-title{font-size:clamp(56px,6.5vw,91px)}
  .hero-visual{height:clamp(460px,57vw,690px)}
  .navright .edition{display:none}
}
@media(max-width:1080px){
  .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
  .hero-title{font-size:clamp(52px,6.35vw,77px)}
  .hero-subcopy{font-size:15px}
  .hero-form{max-width:100%}
  .hero-bottomline{flex-direction:column;align-items:start}
  .scene h2{font-size:clamp(56px,7.6vw,89px)}
  .worlds-head{grid-template-columns:minmax(0,1fr) minmax(200px,.45fr)}
}
@media(max-width:850px){
  .topbar{height:72px}.navlinks{display:none}
  .hero{padding-top:72px}
  .hero-grid{grid-template-columns:1fr;min-height:auto}
  .hero-copy{padding-top:66px;max-width:720px}
  .hero-title{font-size:clamp(64px,9.5vw,100px)}
  .hero-visual{height:min(79vw,680px);min-height:390px;max-width:720px;width:100%;justify-self:center}
  .hero-foot{padding-top:8px}
  .manifesto-content{grid-template-columns:1fr;align-content:center;gap:30px}
  .manifesto-heading{max-width:80%;position:relative}
  .manifesto-aside{font-size:18px;margin-top:8px}
  .scene-viewport{height:325px;max-height:43svh}
  .manifesto-top>span:nth-child(2){display:none}
  .manifesto-decor{width:80vw;right:-26%;opacity:.18}
  .manifesto-side{display:none}
  .worlds-head{grid-template-columns:1fr;gap:20px}
  .worlds-head p{max-width:65ch}
  .worldcards{grid-template-columns:1fr}
  .video-heading{display:block}
  .worldcard{min-height:520px}
  .signup-inner{grid-template-columns:1fr}
  .signup-card{max-width:600px}
  .bridge{height:110px}
}
@media(max-width:560px){
  :root{--gutter:22px}
  .topbar{height:67px}
  .brand{font-size:13px;letter-spacing:.06em;gap:9px}.brand img{width:31px;height:31px}
  .topbar-inner{gap:8px}.navcta{padding:10px 13px;font-size:9px;gap:12px}
  .hero{padding-top:67px}
  .hero-copy{padding-top:62px}
  .hero-kicker{font-size:9px;letter-spacing:.07em;margin-bottom:20px;gap:9px}
  .hero-title{font-size:clamp(44px,11.7vw,68px);letter-spacing:-.085em}
  .hero-subcopy{font-size:15px;line-height:1.55;margin-top:21px}
  .hero-form{grid-template-columns:1fr;margin-top:21px;gap:9px}
  .hero-form .button,.hero-form input{width:100%}
  .hero-bottomline{margin-top:19px;padding-top:17px;gap:16px}
  .countdown>div{min-width:57px;padding:0 11px}
  .hero-visual{height:min(104vw,440px);min-height:315px;margin-bottom:3px}
  .visual-guides{width:109%}
  .medallion-stage{width:86%}
  .visual-label{left:0;top:7%;font-size:9px}
  .visual-footer{bottom:0;right:0}
  .hero-foot{padding-top:10px;padding-bottom:16px}
  .hero-foot span:first-child{font-size:8px;letter-spacing:.08em}
  .scroll-hint{display:none}
  .manifesto{height:360vh}
  .manifesto-top{top:calc(89px + env(safe-area-inset-top,0px))}
  .manifesto-content{padding-top:55px;gap:10px}
  .manifesto-heading{max-width:100%}
  .manifesto-heading .micro{font-size:9px}
  .manifesto-aside{font-size:16px;max-width:24ch}
  .scene-viewport{height:300px;max-height:45svh}
  .scene h2{font-size:clamp(52px,12vw,72px);line-height:.9;white-space:normal}
  .scene h2 span{white-space:nowrap}
  .scene-copy{font-size:16px;max-width:33ch}
  .manifesto-progress{bottom:36px;gap:12px}
  .progress-side{display:none}
  .manifesto-decor{width:112vw;right:-55%;opacity:.11}
  .worlds{padding-block:95px 112px}
  .worlds-head{margin:20px 0 30px}
  .worlds-head h2{font-size:clamp(46px,11vw,68px)}
  .worlds-head p{font-size:15px}
  .worldcard{min-height:500px;padding:24px}
  .card-art{height:210px}
  .worldcard h3{font-size:clamp(35px,9vw,52px)}
  .card-intro,.card-extra{font-size:15px}
  .card-bottom .micro{font-size:8px;letter-spacing:.05em}
  .bridge{height:96px}.bridge-inner{font-size:clamp(40px,10vw,62px)}
  .signup{padding-block:98px 110px}
  .signup-copy h2{font-size:clamp(57px,12vw,79px)}
  .signup-card{padding:25px}
}
@media(max-width:370px){
  .hero-title{font-size:43px}
  .hero-kicker{font-size:8px}
  .hero-visual{min-height:300px}
  .scene h2{font-size:47px}
  .countdown>div{min-width:54px;padding:0 8px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-title .title-row>span{animation:none;transform:none}
  .appear{opacity:1;transform:none}
  .manifesto{height:auto!important}
  .manifesto-pin{position:relative;height:auto;min-height:0;padding-top:120px;padding-bottom:80px;overflow:visible}
  .manifesto-content{display:block}
  .manifesto-heading{margin-bottom:35px}
  .scene-viewport{height:auto;max-height:none}
  .scene{position:relative;opacity:1!important;transform:none!important;clip-path:none!important;margin-bottom:65px;pointer-events:auto}
  .manifesto-progress,.manifesto-decor,.manifesto-side{display:none}
  .medallion{transform:none!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* ==========================================================
   SKILL ISSUE V4 / MOTION FILM ADDITIONS
   The original frozen-metal design stays unchanged. Only
   kinetic typography, scroll motion, subtle 3D and film added.
   ========================================================== */
/* Fast title entrance, followed by gentle scroll departure. */
.hero-title .title-row>span{animation-duration:.78s}
.hero-title .title-row:nth-child(2)>span{animation-delay:.075s}
.hero-title .title-row:nth-child(3)>span{animation-delay:.15s}
.hero-title .title-row:nth-child(4)>span{animation-delay:.225s}
.hero-title{transform:translate3d(0,var(--hero-scroll-y,0px),0);will-change:transform}
.hero-subcopy{transform:translate3d(0,var(--hero-description-y,0px),0);will-change:transform}
/* Headline lines slide from opposite directions as the section enters. */
.worlds{overflow:clip}
.worlds-head{overflow:hidden}
.worldcards{overflow:clip}
.worlds-heading-kinetic .world-line{display:block;overflow:visible;min-width:0}
.worlds-heading-kinetic .world-line > span{display:block;will-change:transform,opacity}
.worlds-heading-kinetic .world-line-one > span{transform:translate3d(var(--world-x1,0px),var(--world-y1,0px),0);opacity:var(--world-opacity,1)}
.worlds-heading-kinetic .world-line-two > span{transform:translate3d(var(--world-x2,0px),var(--world-y2,0px),0);opacity:var(--world-opacity,1)}
/* Cards fall from above on scroll; on mouse hover they gain a restrained 3D tilt. */
.motion-card{
  --fall-y:0px;--fall-rot:0deg;--tilt-x:0deg;--tilt-y:0deg;--hover-lift:0px;--cursor-x:50%;--cursor-y:50%;
  transform:perspective(1300px) translate3d(0,calc(var(--fall-y) + var(--hover-lift)),0) rotateZ(var(--fall-rot)) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
  transform-origin:50% 40%;will-change:transform,opacity;
  transition:background .3s,border-color .3s,box-shadow .3s;
  backface-visibility:hidden;
}
.motion-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
 background:radial-gradient(400px 280px at var(--cursor-x) var(--cursor-y),rgba(219,229,248,.07),transparent 72%);opacity:0;transition:opacity .28s}
.motion-card:hover::before{opacity:1}
.motion-card:hover{box-shadow:0 28px 65px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.035)}
.motion-card>*{position:relative;z-index:1}
.motion-card .card-art svg{transition:transform .36s var(--ease)}
.motion-card:hover .card-art svg{transform:translate3d(0,-5px,15px) scale(1.025)}
/* Film is a real player. No YouTube ID? Use our locally shipped preview instead. */
.video-section{padding-top:clamp(35px,6vw,90px);padding-bottom:clamp(100px,12vw,180px)}
.film-kicker .film-dot{width:auto;height:auto;background:none;color:#acb8c9;font-size:9px}
.kinetic-film-heading h2{overflow:visible}
.film-title-line{display:block;will-change:transform,opacity;transform:translateY(var(--film-y,0px));opacity:var(--film-opacity,1)}
.film-title-line:nth-child(2){transform:translate3d(var(--film-x,0px),var(--film-y2,0px),0)}
.video-heading p{max-width:33ch}
.video-frame{border-radius:22px;min-height:280px;box-shadow:0 24px 75px rgba(0,0,0,.2);background:#080c14}
.video-frame::before{display:none}
.film-poster{position:absolute;inset:0;display:block;overflow:hidden;background:radial-gradient(ellipse at 64% 44%,#1c2533 0%,#0a0e15 42%,#07090e 80%)}
.film-poster::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(3,5,8,.38),transparent 76%)}
.film-poster-grid{position:absolute;inset:0;opacity:.24;background:repeating-linear-gradient(90deg,transparent 0,transparent 129px,rgba(227,238,255,.10) 130px,transparent 131px)}
.film-medallion{position:absolute;right:3%;top:50%;width:49%;max-height:90%;object-fit:contain;transform:translateY(-50%);border-radius:50%;mask-image:radial-gradient(circle,#000 55%,transparent 78%);opacity:.93;filter:drop-shadow(0 30px 50px rgba(0,0,0,.42))}
.film-poster-content{position:absolute;inset:0;z-index:2;display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:18px;padding:clamp(22px,6vw,90px);pointer-events:none}
.film-poster-content .micro{color:#bbc8da;font-size:clamp(8px,.9vw,11px)}
.film-poster-content strong{font-weight:700;font-size:clamp(36px,5.2vw,98px);line-height:.91;letter-spacing:-.08em}
.film-play{position:absolute!important;left:clamp(22px,6vw,90px);bottom:clamp(22px,5vw,60px);z-index:4!important;display:inline-flex!important;gap:13px!important;align-items:center;border-radius:100px!important;background:rgba(242,246,253,.94)!important;color:#080d13!important;border:1px solid rgba(255,255,255,.5)!important;padding:14px 20px!important;box-shadow:0 10px 28px rgba(0,0,0,.25);font:500 10px var(--mono)!important}
.film-play:hover{background:#fff!important;transform:translateY(-2px)}
.film-play small{font-size:9px;color:#5c6678}
.film-play-icon{border-radius:50%;display:grid;place-items:center;height:19px;width:19px;border:1px solid rgba(8,13,19,.35);font-size:9px;padding-left:2px}
.video-frame video,.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#05070c;z-index:8;border:0}
.film-footer{margin-top:18px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#748194}
/* Motivational strip replaces the short BUILD/NOT BORN banner. */
.bridge{height:clamp(126px,12vw,190px);display:flex;flex-direction:column;justify-content:center;gap:0;contain:layout paint}
.marquee-scroll{width:100%;transform:translate3d(var(--scroll-shift,0px),0,0);will-change:transform}
.marquee-track{display:flex;width:max-content;align-items:center;animation:marqueeMove 42s linear infinite;will-change:transform}
.marquee-group{display:flex;align-items:center;gap:clamp(28px,3.6vw,65px);flex:none;padding-right:clamp(28px,3.6vw,65px)}
.marquee-group span{display:block;font-size:clamp(48px,8vw,126px);font-weight:750;line-height:1.08;letter-spacing:-.09em;white-space:nowrap}
.marquee-group b{font-size:clamp(25px,3vw,48px);font-weight:400;color:#606e80}
@keyframes marqueeMove{to{transform:translateX(-50%)}}
/* Final invitation also falls naturally into place on scroll. */
.motion-signup{--signup-y:0px;--signup-r:0deg;--signup-alpha:1;opacity:var(--signup-alpha);transform:translate3d(0,var(--signup-y),0) rotateZ(var(--signup-r));transform-origin:50% 0;will-change:transform,opacity}
.signup-line{display:block}
/* Accessible static fallback when reduced motion is preferred. */
@media(prefers-reduced-motion:reduce){
 .hero-title,.hero-subcopy{transform:none!important}
 .world-line>span,.film-title-line,.motion-card,.motion-signup{transform:none!important;opacity:1!important}
 .marquee-track{animation:none}.marquee-scroll{transform:none!important}
 .film-poster{display:block}
}
@media(max-width:1080px){.navlinks{gap:14px;font-size:9px}}
@media(max-width:850px){
 .motion-card{transform:translate3d(0,var(--fall-y),0) rotateZ(var(--fall-rot))}
 .film-poster-content{padding:clamp(20px,5vw,50px)}
 .film-poster-content strong{font-size:clamp(36px,7vw,72px)}
 .film-play{left:clamp(20px,5vw,50px);bottom:clamp(20px,5vw,35px)}
}
@media(max-width:560px){
 .video-section{padding-top:34px;padding-bottom:90px}
 .video-heading p{font-size:15px}
 .video-frame{min-height:0;aspect-ratio:4/3}
 .film-poster-content{justify-content:flex-start;padding-top:27px;gap:10px}
 .film-poster-content strong{font-size:clamp(38px,9vw,56px)}
 .film-medallion{width:70%;right:-20%;top:55%;opacity:.36}
 .film-play{padding:12px 14px!important;gap:9px!important;font-size:9px!important}
 .film-footer{font-size:8px;letter-spacing:.06em}
 .bridge{height:115px}
 .marquee-group span{font-size:52px}
 .worlds-heading-kinetic .world-line{white-space:nowrap}
}

/* ============================================================
   V5 / CHROME KINETIC — interaction polish, not a redesign.
   Controlled, visible scroll entrances and pointer depth.
   ============================================================ */

/* The hero title enters deliberately slowly, including after returning to top. */
.hero-title .title-row>span{transform:translateY(0);animation:none}
.hero-title.is-entering .title-row>span{
  animation:v5TitleDrop 1.68s cubic-bezier(.16,.72,.18,1) both;
}
.hero-title.is-entering .title-row:nth-child(2)>span{animation-delay:.16s}
.hero-title.is-entering .title-row:nth-child(3)>span{animation-delay:.32s}
.hero-title.is-entering .title-row:nth-child(4)>span{animation-delay:.48s}
.hero-kicker{letter-spacing:.105em}

/* Card falling motion lives on a wrapper; mouse 3D rotation lives on the
   nested article. Separate elements prevent transforms cancelling each other. */
.worldcards{overflow:visible;perspective:1300px}
.worlds{overflow-x:clip;overflow-y:visible}
.card-flight{min-width:0;display:flex;align-self:stretch;transform-origin:50% 16%;opacity:1}
.card-flight .worldcard{width:100%;height:100%;min-width:0}
html.motion-ready .card-flight:not(.landed){
  opacity:0;transform:translate3d(0,-185px,0) rotateZ(var(--initial-r,-8deg)) scale(.955);
  filter:blur(2px);pointer-events:none;
}
.card-flight:nth-child(2){--initial-r:8deg}
.card-flight.landed{animation:card-drop 1.55s cubic-bezier(.17,.68,.20,1) both}
.card-flight:nth-child(2).landed{animation-delay:.24s}
@keyframes card-drop{
  0%{opacity:0;filter:blur(2px);transform:translate3d(0,-185px,0) rotateZ(var(--initial-r,-8deg)) scale(.955)}
  50%{opacity:1;filter:blur(0);transform:translate3d(0,17px,0) rotateZ(-.9deg) scale(1.008)}
  73%{opacity:1;filter:none;transform:translate3d(0,-8px,0) rotateZ(.4deg) scale(1)}
  88%{transform:translate3d(0,3px,0) rotateZ(-.1deg)}
  100%{opacity:1;filter:none;transform:translate3d(0,0,0) rotateZ(0) scale(1)}
}
.motion-card{
  --tilt-x:0deg;--tilt-y:0deg;--hover-lift:0px;
  --cursor-x:50%;--cursor-y:50%;--art-x:0px;--art-y:0px;
  transform:perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(var(--hover-lift));
  transform-origin:50% 55%;transform-style:preserve-3d;
  transition:background .3s,border-color .3s,box-shadow .3s;
  backface-visibility:hidden;
}
.motion-card:hover{box-shadow:0 36px 72px rgba(0,0,0,.43),0 0 0 1px rgba(226,238,255,.12)}
.motion-card .card-art svg{
  transform:translate3d(var(--art-x),var(--art-y),18px);
  transition:transform .12s linear;
  filter:drop-shadow(0 16px 18px rgba(0,0,0,.19));
}
.motion-card:hover .card-art svg{transform:translate3d(var(--art-x),var(--art-y),18px) scale(1.045)}
.motion-card .card-top,.motion-card h3,.motion-card .card-bottom{transform:translateZ(14px)}
.motion-card .card-intro,.motion-card .card-extra{transform:translateZ(7px)}

/* Faster visible running band and a clear alternative to BUILT, NOT BORN. */
.bridge{height:clamp(130px,13vw,192px);background:#d8dee7}
.bridge-line{background:repeating-linear-gradient(90deg,transparent 0,transparent 126px,rgba(18,32,50,.055) 127px,transparent 128px)}
.marquee-track{animation:marqueeMove 23s linear infinite}
.marquee-scroll{transform:translate3d(var(--scroll-shift,0px),0,0)}
.marquee-group span{font-size:clamp(52px,8.6vw,135px);letter-spacing:-.09em}
.marquee-group b{color:#718095;font-size:clamp(26px,3vw,48px)}

/* Finale: actual staggered falling text, then a card landing later. */
.signup{position:relative;min-height:105svh;padding-block:clamp(125px,15vw,215px) clamp(130px,14vw,210px);overflow:hidden}
.signup-inner{perspective:1300px}
.signup-copy{transform:translate3d(0,var(--final-copy-parallax,0px),0)}
.signup-line{display:block;overflow:hidden;padding-bottom:.105em;margin-bottom:-.10em}
.signup-line-inner{display:block;transform:translateY(0)}
html.motion-ready .signup:not(.active) .signup-line-inner{transform:translateY(-120%)}
.signup.active .signup-line-inner{animation:final-line-fall 1.65s cubic-bezier(.18,.75,.16,1) both}
.signup.active .signup-line:nth-child(2) .signup-line-inner{animation-delay:.20s}
@keyframes final-line-fall{
  0%{transform:translate3d(0,-125%,0) rotateZ(-2deg)}
  65%{transform:translate3d(0,5%,0) rotateZ(.2deg)}
  100%{transform:translate3d(0,0,0) rotateZ(0)}
}
html.motion-ready .signup:not(.active) .signup-eyebrow,
html.motion-ready .signup:not(.active) .signup-lead-motion,
html.motion-ready .signup:not(.active) .signup-footnote{opacity:0;transform:translate3d(0,-35px,0)}
.signup.active .signup-eyebrow,.signup.active .signup-lead-motion,.signup.active .signup-footnote{
  animation:final-copy-fall .95s cubic-bezier(.22,.7,.2,1) both;
}
.signup.active .signup-lead-motion{animation-delay:.44s}
.signup.active .signup-footnote{animation-delay:.65s}
@keyframes final-copy-fall{
  from{opacity:0;transform:translate3d(0,-48px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
/* Override V4 scroll transform on cards: it previously finished too early. */
.motion-signup{opacity:1;transform:none;will-change:auto}
html.motion-ready .signup:not(.active) .signup-card{opacity:0;transform:perspective(1200px) translate3d(0,-170px,0) rotateX(13deg)}
.signup.active .signup-card{
  animation:final-card-drop 1.45s cubic-bezier(.2,.72,.18,1) .34s both;
  transform-origin:50% 20%;
}
@keyframes final-card-drop{
  0%{opacity:0;transform:perspective(1200px) translate3d(0,-170px,0) rotateX(13deg)}
  61%{opacity:1;transform:perspective(1200px) translate3d(0,14px,0) rotateX(-1.4deg)}
  81%{transform:perspective(1200px) translate3d(0,-6px,0) rotateX(.6deg)}
  100%{opacity:1;transform:perspective(1200px) translate3d(0,0,0) rotateX(0)}
}

/* Do not hide interactions in mobile layouts; depth simply becomes gentler. */
@media(max-width:850px){
  .motion-card{transform:perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(var(--hover-lift))}
  .card-flight.landed{animation-duration:1.3s}
  .card-flight:nth-child(2).landed{animation-delay:.12s}
}
@media(max-width:560px){
  .bridge{height:125px}
  .marquee-group span{font-size:clamp(49px,13vw,68px)}
  .signup{min-height:0}
  .signup-line-inner{padding-right:.05em}
}
@media(prefers-reduced-motion:reduce){
  .hero-title .title-row>span,.hero-title.is-entering .title-row>span,
  .card-flight,.card-flight.landed,.motion-card,.motion-card .card-art svg,
  .signup .signup-line-inner,.signup.active .signup-line-inner,
  .signup .signup-card,.signup.active .signup-card,
  .signup .signup-eyebrow,.signup .signup-lead-motion,.signup .signup-footnote{
    animation:none!important;transform:none!important;opacity:1!important;filter:none!important;
  }
  .marquee-scroll,.marquee-track{animation:none!important;transform:none!important}
}
/* The card on the mobile finale animates when *it* becomes visible. */
html.motion-ready .signup .signup-card:not(.card-active){opacity:0;transform:perspective(1200px) translate3d(0,-170px,0) rotateX(13deg);animation:none}
.signup .signup-card.card-active{animation:final-card-drop 1.45s cubic-bezier(.2,.72,.18,1) .18s both}
@media(prefers-reduced-motion:reduce){html.motion-ready .signup .signup-card:not(.card-active),.signup .signup-card.card-active{animation:none!important;opacity:1!important;transform:none!important}}

@keyframes v5TitleDrop{0%{transform:translateY(118%)}70%{transform:translateY(-2.8%)}100%{transform:translateY(0)}}
