/* The cinematic edition: a real frame sequence plus a spatial website breakdown. */
.nav{position:fixed;transition:height .3s,background .3s,backdrop-filter .3s}.has-scrolled .nav{height:74px;background:#05090cce;backdrop-filter:blur(16px)}
.hero-journey{height:540svh;min-height:0}.hero-stage{height:100svh;min-height:600px}.hero-art{transform:none!important}.hero-art img{object-position:center}.hero-vignette{z-index:2}.hero-art::after{content:'';position:absolute;inset:0;background:#05090c00}.hero-stage::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(90deg,#02050866,transparent 58%),linear-gradient(0deg,#05090cf5,transparent 25%,transparent 80%,#02060955)}
#cinema{position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:0;transition:opacity .5s;pointer-events:none}#cinema.ready{opacity:1}#dust{z-index:3;opacity:.32}.hero-grid{z-index:3}.cinema-chapter{position:absolute;z-index:4;left:6.3%;top:24%;width:65%;opacity:var(--chapter-opacity,0);transform:translateY(var(--chapter-shift,25px));visibility:hidden;will-change:opacity,transform;pointer-events:none}.cinema-chapter a{pointer-events:auto}.hero-journey .hero-copy{opacity:var(--chapter-opacity,1)!important;transform:translateY(var(--chapter-shift,0px))!important;visibility:visible}.cinema-chapter .eyebrow{color:var(--cyan);margin-bottom:29px;font-size:9px}.cinema-chapter h2{font-size:clamp(80px,9vw,146px);font-weight:600;line-height:.95}.cinema-chapter h2 span{color:var(--cyan)}.chapter-description{font-size:14px;color:#c3ced4;margin-top:28px}.chapter-reveal .button{margin-top:28px}.chapter-reveal h2{font-size:clamp(70px,8.4vw,132px)}.hero-bottom{z-index:5}.cinema-index{position:absolute;right:4.5%;bottom:18%;z-index:5;text-align:right;display:grid;gap:16px}.cinema-index-label{font-size:8px;letter-spacing:.18em;color:#bed4df}.cinema-index-number{font-family:var(--display);font-weight:500;font-size:37px}.cinema-index-number i{font-size:17px;font-style:normal;color:#647987}.cinema-track{width:150px;height:1px;background:#bceeff40}.cinema-track>span{display:block;height:1px;background:var(--cyan);transform:scaleX(var(--cinema-progress,0));transform-origin:left;box-shadow:0 0 10px var(--cyan)}
.signature-image{background-image:url('frames/hero/frame_0180.webp')}.signature{height:700px;min-height:620px}.signature-content{padding-top:105px}.signature h2{font-size:clamp(75px,8vw,125px)}
.build-journey{height:310svh;background:#0a0f13;border-bottom:1px solid var(--line)}.build-stage{height:100svh;min-height:700px;position:sticky;top:0;overflow:hidden;display:flex;align-items:center;padding:100px 6.3%;background:radial-gradient(ellipse at 76% 57%,#16344275,transparent 50%)}.build-copy{position:relative;z-index:4;width:46%}.build-copy>.eyebrow{color:var(--cyan);margin-bottom:27px}.build-copy h2{font-size:clamp(58px,5.8vw,88px)}.build-copy>p:not(.eyebrow){font-size:12px;color:#8fa0ab;margin:25px 0}.build-steps{list-style:none;padding:0;margin:25px 0 0;max-width:345px}.build-steps li{padding:13px 0;border-top:1px solid #ffffff18;display:flex;gap:19px;color:#62737e;transition:color .2s}.build-steps li b{font-size:9px;font-weight:500;padding-top:4px}.build-steps li>span{font-size:15px}.build-steps small{display:block;font-size:10px;line-height:1.6;margin-top:5px;opacity:.6}.build-steps li.active{color:var(--cyan)}.build-steps li.active small{color:#c4d1d9;opacity:1}.depth-object{position:absolute;inset:0 0 0 44%;perspective:1300px;transform-style:preserve-3d}.depth-rig{position:absolute;width:440px;height:320px;left:50%;top:50%;transform-style:preserve-3d;transform:translate(-50%,-50%) rotateX(calc(48deg - var(--build-progress,0)*12deg)) rotateY(-23deg) rotateZ(calc(-20deg + var(--build-progress,0)*9deg))}.depth-plane{position:absolute;inset:0;border:1px solid #a5dcf94d;border-radius:9px;padding:25px;backface-visibility:visible;box-shadow:8px 8px 40px #0005;transform:translateZ(calc(var(--level)*var(--spread,8px)));will-change:transform;background:#0c1b24d9;overflow:hidden}.depth-plane>span{font-size:8px;letter-spacing:.13em;color:#8baebf}.plane-base{--level:-1.5;background:#050e15;border-color:#536f7d}.wire-grid{position:absolute;inset:65px 23px 23px;background:linear-gradient(90deg,transparent 97%,#3672866b 98%),linear-gradient(0deg,transparent 97%,#3672866b 98%);background-size:40px 40px;border:1px solid #46788c80}.plane-design{--level:-.5;background:#112e39d9}.plane-design>strong{font-family:var(--display);font-size:145px;font-weight:600;line-height:1;position:absolute;right:28px;bottom:28px;color:#a9e9f3}.swatches{display:flex;gap:7px;margin-top:26px}.swatches i{display:block;width:36px;height:36px;background:#9decff}.swatches i:nth-child(2){background:#eff4f3}.swatches i:nth-child(3){background:#07121a;border:1px solid #386278}.plane-copy{--level:.5;background:#0f222bc7}.plane-copy>strong{font-family:var(--display);font-size:65px;line-height:.92;display:block;margin:26px 0 20px;font-weight:600}.copy-rule{width:63%;height:3px;background:#728e9c;margin:9px 0}.copy-rule.short{width:43%}.plane-motion{--level:1.5;background:linear-gradient(120deg,#91ddff12,#10212c77);box-shadow:0 0 35px #9decff0c,inset 0 0 25px #9decff07;border-color:#92e1ff8c}.plane-circle{width:125px;height:125px;border:1px solid #a1eaff;position:absolute;right:28px;top:80px;border-radius:50%;box-shadow:inset 0 0 40px #92eaff15,0 0 35px #82eaff10}.plane-circle::before{content:'';position:absolute;inset:20px;border:1px solid #a1eaff77;border-radius:50%}.plane-circle::after{content:'';width:25px;height:25px;background:#99ecff;border-radius:50%;position:absolute;inset:50px;box-shadow:0 0 28px #68dcff}.plane-button{position:absolute;bottom:27px;left:25px;background:var(--cyan);color:#09131a;font-size:8px;letter-spacing:.04em;padding:13px 18px}.depth-floor{position:absolute;width:65%;height:130px;left:20%;top:72%;background:radial-gradient(ellipse,#63caff24,transparent 66%);filter:blur(18px)}.depth-caption{position:absolute;bottom:16%;width:100%;text-align:center;font-size:7px;letter-spacing:.15em;color:#69909f}.build-counter{position:absolute;bottom:32px;left:6.3%;font-size:8px;letter-spacing:.15em;color:#6d8898}.build-counter span{margin-left:20px;color:var(--cyan);font-size:18px}
.motion-paused .hero-journey,.motion-paused .build-journey{height:auto;min-height:100svh}.motion-paused .hero-stage,.motion-paused .build-stage{position:relative}.motion-paused .cinema-chapter:not(.hero-copy){display:none}.motion-paused .hero-journey .hero-copy{opacity:1!important;transform:none!important;visibility:visible!important}.motion-paused .cinema-index{display:none}.motion-paused .depth-rig{transform:translate(-50%,-50%) rotateX(42deg) rotateY(-23deg) rotateZ(-15deg)}.motion-paused .depth-plane{transform:translateZ(calc(var(--level)*65px))}
@media(min-width:1800px){.depth-rig{width:550px;height:370px}}
@media(max-width:1000px){.build-stage{padding:100px 5%}.build-copy h2{font-size:60px}.depth-rig{width:350px;height:270px}.depth-plane{padding:20px}.plane-copy>strong{font-size:55px}.plane-design>strong{font-size:120px}.plane-circle{width:100px;height:100px;right:20px}.plane-circle::after{inset:38px;width:22px;height:22px}.depth-caption{bottom:18%}.cinema-chapter h2{font-size:11vw}.chapter-reveal h2{font-size:10vw}.cinema-chapter{width:80%}}
@media(max-width:700px){.nav{height:76px}.has-scrolled .nav{height:66px}.hero-journey{height:410svh}.hero-stage{min-height:650px}.hero-stage::after{background:linear-gradient(0deg,#05090cf5,transparent 33%,#05090c30 80%),linear-gradient(90deg,#05090c65,transparent 85%)}.hero-journey .hero-copy,.cinema-chapter{left:6%;top:24%;width:87%}.cinema-chapter h2{font-size:clamp(58px,15vw,100px);line-height:1}.chapter-reveal h2{font-size:clamp(48px,13vw,86px)}.cinema-chapter .eyebrow{font-size:7px;letter-spacing:.1em;margin-bottom:22px}.chapter-description{font-size:12px;margin-top:25px}.cinema-index{right:6%;bottom:17%;gap:9px}.cinema-index-label{font-size:6px}.cinema-index-number{font-size:26px}.cinema-index-number i{font-size:12px}.cinema-track{width:90px}.hero-bottom{font-size:6px;left:6%;right:6%;gap:12px}.hero-bottom .scroll-link{gap:8px}.motion-toggle{font-size:7px}.build-journey{height:290svh}.build-stage{display:block;padding:90px 6% 0;min-height:740px}.build-copy{width:100%}.build-copy>.eyebrow{font-size:8px;margin-bottom:17px}.build-copy h2{font-size:clamp(42px,10.5vw,63px);max-width:90%}.build-copy>p:not(.eyebrow){font-size:11px;margin:17px 0}.build-steps{margin:16px 0;max-width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.build-steps li{display:block;padding:9px 0}.build-steps li b{font-size:7px;display:block;margin-bottom:5px}.build-steps li>span{font-size:9px}.build-steps small{display:none}.depth-object{inset:320px 0 0}.depth-rig{width:260px;height:190px;top:45%;transform:translate(-50%,-50%) rotateX(43deg) rotateY(-16deg) rotateZ(-18deg)}.depth-plane{border-radius:5px;padding:15px;transform:translateZ(calc(var(--level)*var(--spread,8px)*.6))}.depth-plane>span{font-size:5px}.plane-copy>strong{font-size:40px;margin:20px 0 13px}.copy-rule{height:2px;margin:6px 0}.plane-design>strong{font-size:86px;bottom:20px;right:20px}.swatches{margin-top:18px;gap:5px}.swatches i{width:23px;height:23px}.wire-grid{inset:40px 15px 15px;background-size:25px 25px}.plane-button{font-size:5px;bottom:17px;left:15px;padding:9px 12px}.plane-circle{width:73px;height:73px;top:48px;right:18px}.plane-circle::before{inset:12px}.plane-circle::after{inset:28px;width:15px;height:15px}.depth-caption{bottom:19%;font-size:5px}.build-counter{bottom:24px;font-size:6px}.signature{height:720px;min-height:650px}.signature h2{font-size:16vw}.signature-content{padding-top:110px}.motion-paused .depth-plane{transform:translateZ(calc(var(--level)*43px))}}
@media(prefers-reduced-motion:reduce){.hero-journey,.build-journey{height:auto;min-height:100svh}.hero-stage,.build-stage{position:relative}.cinema-chapter:not(.hero-copy){display:none}.hero-journey .hero-copy{opacity:1!important;transform:none!important;visibility:visible!important}.cinema-index{display:none}}

/* Match the first-frame fallback to the canvas framing. */
.hero-journey .hero-art{background:#05090c}.hero-journey .hero-art img{position:absolute;object-position:right center;max-width:none}@media(max-width:700px){.hero-journey .hero-art img{mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}}