:root{--green:#78b900;--blue:#2f7df7;--ink:#030609;--muted:#abb7bd;--line:rgba(255,255,255,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:#030609}body{margin:0;background:#030609;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;overflow-x:hidden}button,a{font:inherit}.topbar{position:fixed;inset:0 0 auto;height:72px;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,64px);background:linear-gradient(#030609d9,transparent);transition:.35s}.topbar.scrolled{height:60px;background:#05090ced;border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.ctrl-brand{display:flex;align-items:center;gap:17px;color:white;text-decoration:none}.ctrl-brand img{width:118px;max-height:38px;object-fit:contain}.ctrl-brand span{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:#c7d0d5}.topbar-meta{display:flex;gap:26px;align-items:center;font-size:.76rem;letter-spacing:.08em;color:#aeb9be}.topbar-meta a{color:white;text-decoration:none;border-bottom:1px solid var(--green);padding-bottom:3px}
.opening{height:100svh;min-height:680px;position:relative;display:flex;align-items:center;overflow:hidden}.opening-media{position:absolute;inset:0}.opening-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.66) contrast(1.08);transform:scale(1.05);animation:heroDrift 18s ease-in-out infinite alternate}.opening-vignette{position:absolute;inset:0;background:linear-gradient(90deg,#020507f5 0%,#020507bc 41%,#02050728 75%,#02050780),linear-gradient(0deg,#020507c9,transparent 55%)}@keyframes heroDrift{to{transform:scale(1.11) translateX(-1.4%)}}.opening-copy{position:relative;z-index:2;margin-left:clamp(24px,8vw,150px);max-width:780px;padding-top:50px}.product-overline,.chapter,.shot-kicker{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.18em;color:var(--green);margin:0 0 18px}.opening h1{font-size:clamp(5rem,11vw,11rem);line-height:.77;letter-spacing:-.075em;margin:0;font-weight:760}.opening h1 span,.lockup strong span{color:var(--blue)}.opening-tagline{font-size:clamp(1.8rem,3vw,3.3rem);font-weight:560;letter-spacing:-.04em;margin:30px 0 10px}.opening-promise{font-size:clamp(1rem,1.4vw,1.35rem);color:#cbd4d9;line-height:1.5}.opening-promise strong{color:var(--green)}.enter{position:absolute;z-index:4;left:50%;bottom:28px;transform:translateX(-50%);border:0;background:transparent;color:white;display:grid;gap:9px;text-align:center;cursor:pointer;font-size:.7rem;text-transform:uppercase;letter-spacing:.17em}.enter i{font-style:normal;color:var(--green);font-size:1.5rem;animation:bob 1.6s infinite}@keyframes bob{50%{transform:translateY(7px)}}
.welcome{min-height:92vh;display:grid;place-items:center;padding:100px 8vw;background:#f5f7f8;color:#0b1115}.welcome-frame{max-width:1100px}.welcome h2{font-size:clamp(3rem,6vw,7rem);line-height:.95;letter-spacing:-.06em;margin:0 0 34px;font-weight:690}.welcome p:last-child{font-size:clamp(1.4rem,2.2vw,2.2rem);color:#65727a;margin:0}
.walk{position:relative;background:#030609}.walk-progress{position:relative;width:2px;height:120px;background:#ffffff18;border-radius:2px;overflow:hidden}.walk-progress span{display:block;width:100%;height:0;background:linear-gradient(var(--green),var(--blue));box-shadow:0 0 16px #78b900aa}.shot{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid #ffffff0d}.shot-media,.shot-overlay{position:absolute;inset:0}.shot-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.55) brightness(.78) contrast(1.08);transform:scale(1.10);transition:transform 1.6s cubic-bezier(.2,.8,.2,1),filter 1.2s}.shot.active .shot-media img{transform:scale(1.01);filter:saturate(.76) brightness(.9) contrast(1.08)}.shot-overlay{background:linear-gradient(90deg,#020507e8 0%,#020507a8 44%,#02050738 75%),linear-gradient(0deg,#020507c9,transparent 60%)}.shot-overlay.heavy{background:#020507c7}.shot-copy{position:relative;z-index:3;width:min(780px,80vw);margin-left:clamp(112px,8vw,150px);opacity:.25;transform:translateY(35px);transition:.8s}.shot.active .shot-copy{opacity:1;transform:none}.shot-copy h2{font-size:clamp(3.2rem,7vw,7.4rem);line-height:.9;letter-spacing:-.065em;margin:0 0 24px}.shot-copy p:not(.shot-kicker):not(.quote){font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.65;color:#c9d3d8;max-width:640px}.timecode{display:inline-block;border:1px solid #76a8ff;color:#84afff;border-radius:999px;padding:8px 14px;margin-bottom:20px;font-size:.85rem;letter-spacing:.1em}.quote{font-size:clamp(1.2rem,2vw,1.8rem);border-left:2px solid var(--green);padding:12px 18px;color:white;background:#78b90012;width:max-content;max-width:100%}.sound-cue{position:absolute;z-index:4;right:clamp(24px,6vw,96px);bottom:50px;display:flex;align-items:end;gap:5px;color:#aebbc0;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase}.sound-cue b{display:block;width:3px;background:var(--green);animation:eq .8s infinite alternate}.sound-cue b:nth-child(1){height:11px}.sound-cue b:nth-child(2){height:23px;animation-delay:.2s}.sound-cue b:nth-child(3){height:15px;animation-delay:.35s}@keyframes eq{to{height:28px}}.sound-cue span{margin-left:8px}.compact h2{max-width:900px}.bottom{align-self:flex-end;margin-bottom:clamp(60px,8vw,120px)}.bottom-left{position:absolute;left:clamp(112px,8vw,150px);bottom:65px;margin:0}.center-copy{margin:auto;text-align:center;width:min(920px,84vw)}.center-copy p{margin-inline:auto}.first-person .shot-media img{object-position:center}.pov-hands{position:absolute;z-index:2;left:51%;bottom:-6%;width:26vw;height:18vw;min-width:270px;background:radial-gradient(ellipse at 70% 0,#ffffff14,transparent 55%);filter:blur(6px);opacity:.8;transform:rotate(-8deg)}.access-chip,.status{position:absolute;z-index:5;right:6vw;top:24%;padding:12px 16px;border:1px solid #ffffff2e;background:#03070abe;backdrop-filter:blur(10px);font-size:.78rem;letter-spacing:.06em}.access-led,.status span{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 16px var(--green);margin-right:9px}.blue{color:#68a0ff}.rack-target{position:absolute;z-index:5;right:19%;top:40%;width:70px;height:70px;border:1px solid #6aa2ff;border-radius:50%;box-shadow:0 0 0 12px #2f7df712,0 0 40px #2f7df744}.rack-target span{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:#6aa2ff;transform:translate(-50%,-50%)}.rack-target em{position:absolute;left:82px;top:25px;font-style:normal;font-size:.7rem;white-space:nowrap;text-transform:uppercase;letter-spacing:.13em;color:#bcd0eb}.console-ui{position:relative;z-index:5;margin:auto;width:min(800px,72vw);border:1px solid #ffffff24;background:#061016de;box-shadow:0 30px 100px #000a;backdrop-filter:blur(12px);border-radius:12px;overflow:hidden;opacity:.3;transform:scale(.95);transition:.9s}.shot.active .console-ui{opacity:1;transform:none}.console-head{height:52px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #ffffff1e;padding:0 18px}.console-head span{width:8px;height:8px;border-radius:50%;background:#ffffff45}.console-head b{margin-left:10px;font-size:.72rem;letter-spacing:.08em;color:#afbbc1}.console-line{display:grid;grid-template-columns:50px 1fr auto;gap:16px;padding:18px 22px;border-bottom:1px solid #ffffff12;color:#aab8be;font-size:.88rem}.console-line i{font-style:normal;color:#66747a}.console-line strong{font-size:.68rem;color:var(--green);letter-spacing:.08em}.console-line.active{background:#78b90010;color:#fff}.console-line.active strong{color:#8bbcff}.status{top:auto;bottom:56px;color:white}
.difference{min-height:90vh;display:grid;place-items:center;padding:80px 8vw;background:radial-gradient(circle at 75% 45%,#2f7df71e,transparent 30%),#020507}.difference-inner{text-align:center;max-width:1220px}.difference p{font-size:clamp(1.5rem,3vw,3rem);color:#9caab0;margin:0 0 20px}.difference h2{font-size:clamp(3.5rem,8vw,9rem);line-height:.9;letter-spacing:-.07em;margin:0;color:var(--green)}.lockup{margin-top:70px;display:grid;gap:8px;justify-items:center}.lockup strong{font-size:2.1rem}.lockup small{color:#9ba7ac;text-transform:uppercase;letter-spacing:.13em}
.handoff{min-height:90vh;position:relative;display:grid;grid-template-columns:1.25fr .75fr;background:#f5f7f8;color:#0a1115}.handoff-image{min-height:650px;overflow:hidden}.handoff-image img{width:100%;height:100%;object-fit:cover}.handoff-copy{display:flex;flex-direction:column;justify-content:center;padding:8vw 6vw}.handoff-copy h2{font-size:clamp(2.8rem,5vw,5.5rem);line-height:.95;letter-spacing:-.06em;margin:0 0 28px}.handoff-copy p{font-size:1.1rem;line-height:1.7;color:#627079}.cta{margin-top:28px;color:#0b1115;text-decoration:none;font-weight:780;width:max-content;border-bottom:2px solid var(--green);padding-bottom:8px}.cta span{color:var(--green)}
.reveal{opacity:0;transform:translateY(28px);transition:.9s}.reveal.visible{opacity:1;transform:none}footer{min-height:150px;background:#020507;border-top:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;padding:40px 6vw;color:#9ca8ae;font-size:.8rem}footer img{width:108px;display:block;margin-bottom:8px}footer p{margin:0}
@media(max-width:800px){.ctrl-brand span,.topbar-meta span{display:none}.opening-copy{margin-left:24px;margin-right:24px}.opening h1{font-size:clamp(4.2rem,19vw,7rem)}.shot-copy,.bottom-left{margin-left:24px;left:auto}.shot-copy{width:calc(100vw - 48px)}.shot-copy h2{font-size:clamp(2.8rem,12vw,5rem)}.rack-target,.pov-hands{display:none}.console-ui{width:calc(100vw - 48px)}.handoff{grid-template-columns:1fr}.handoff-image{min-height:52vh}.handoff-copy{padding:70px 24px}footer{flex-direction:column;align-items:flex-start;gap:24px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.shot-copy,.console-ui{opacity:1;transform:none}.shot-media img{transform:none}}
/* Sprint 2 · Technical platform */
.platform{padding:clamp(90px,10vw,170px) 6vw;background:#f5f7f8;color:#081015}.platform-intro{max-width:1050px;margin:0 auto 80px}.platform-intro h2,.capabilities-head h2,.control-panel h2,.visit-inner h2{font-size:clamp(3rem,6vw,6.8rem);line-height:.94;letter-spacing:-.06em;margin:0 0 28px}.platform-intro>p:last-child{max-width:830px;font-size:1.12rem;line-height:1.75;color:#5e6d75}.architecture-map{position:relative;min-height:760px;max-width:1200px;margin:0 auto;border:1px solid #d7dde0;border-radius:34px;background:linear-gradient(135deg,#fff,#edf2f4);overflow:hidden;box-shadow:0 30px 90px #09202d10}.architecture-map:before,.architecture-map:after{content:"";position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);border-radius:50%;border:1px solid #2f7df72b}.architecture-map:before{width:420px;height:420px}.architecture-map:after{width:610px;height:610px}.arch-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:250px;height:250px;border-radius:50%;display:grid;place-content:center;text-align:center;background:#071018;color:#fff;box-shadow:0 0 0 18px #2f7df70c,0 30px 70px #07101845}.arch-label{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:#68a0ff}.arch-core strong{font-size:2.1rem;letter-spacing:-.05em}.arch-core small{color:#a9b5bb}.arch-node{position:absolute;z-index:4;width:250px;padding:22px 24px;border-radius:18px;background:#fff;border:1px solid #dce3e6;box-shadow:0 12px 35px #0a263615}.arch-node b{font-size:.72rem;color:var(--blue);letter-spacing:.12em}.arch-node h3{margin:7px 0 8px;font-size:1.35rem}.arch-node p{margin:0;color:#64717a;line-height:1.5;font-size:.92rem}.n1{left:7%;top:9%}.n2{right:7%;top:9%}.n3{left:3%;top:42%}.n4{right:3%;top:42%}.n5{left:11%;bottom:8%}.n6{right:11%;bottom:8%}.capabilities{padding:clamp(90px,10vw,170px) 6vw;background:#071018}.capabilities-head{max-width:1000px;margin:0 auto 65px}.capabilities-head h2{color:#fff}.capability-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cap-card{min-height:300px;padding:30px;border:1px solid #ffffff15;border-radius:22px;background:linear-gradient(180deg,#ffffff07,#ffffff02);position:relative;overflow:hidden}.cap-card:before{content:"";position:absolute;right:-60px;top:-60px;width:150px;height:150px;border-radius:50%;background:#78b9000c}.cap-card span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid #78b90066;color:var(--green);font-size:.75rem}.cap-card h3{font-size:1.5rem;margin:45px 0 12px}.cap-card p{color:#aebac0;line-height:1.65;margin:0 0 22px}.cap-card em{font-size:.72rem;color:#6f8089;font-style:normal;text-transform:uppercase;letter-spacing:.12em}.control-room{min-height:95vh;display:grid;grid-template-columns:1.15fr .85fr;background:#eef2f4;color:#081015}.control-media{min-height:720px;overflow:hidden}.control-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(1.05)}.control-panel{padding:8vw 6vw;display:flex;flex-direction:column;justify-content:center}.control-panel>p:not(.chapter){font-size:1.08rem;line-height:1.75;color:#607079;max-width:620px}.control-points{margin-top:38px;display:grid;gap:18px}.control-points>div{display:grid;grid-template-columns:18px 140px 1fr;gap:12px;align-items:start;padding:18px 0;border-top:1px solid #cad4d8}.control-points span{margin-top:6px;width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 12px #78b90077}.control-points b{font-size:.95rem}.control-points small{font-size:.9rem;line-height:1.5;color:#68767d}.visit{position:relative;min-height:90vh;display:grid;place-items:center;padding:80px 8vw;overflow:hidden}.visit-bg,.visit-overlay{position:absolute;inset:0}.visit-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.58) brightness(.72) contrast(1.08);transform:scale(1.04)}.visit-overlay{background:linear-gradient(90deg,#030609ef,#0306098d 55%,#03060942),linear-gradient(0deg,#030609d6,transparent 65%)}.visit-inner{position:relative;z-index:2;max-width:1000px;margin-right:auto}.visit-inner h2{color:#fff;max-width:900px}.visit-inner>p:not(.chapter){max-width:700px;color:#c7d2d7;font-size:1.1rem;line-height:1.75}.visit-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:35px}.visit-actions a{text-decoration:none;border-radius:999px;padding:14px 20px;font-weight:750}.visit-primary{background:var(--green);color:#071018}.visit-secondary{border:1px solid #ffffff38;color:#fff;background:#05090c8e;backdrop-filter:blur(12px)}
@media(max-width:900px){.architecture-map{min-height:auto;padding:24px;display:grid;gap:12px}.architecture-map:before,.architecture-map:after{display:none}.arch-core,.arch-node{position:relative;inset:auto!important;transform:none!important;width:auto}.arch-core{height:auto;border-radius:22px;padding:35px 20px}.capability-grid{grid-template-columns:1fr 1fr}.control-room{grid-template-columns:1fr}.control-media{min-height:52vh}}
@media(max-width:620px){.capability-grid{grid-template-columns:1fr}.platform,.capabilities{padding-left:24px;padding-right:24px}.control-panel{padding:70px 24px}.visit{padding:80px 24px}.visit-actions{flex-direction:column;align-items:flex-start}}

/* Sprint 3 · Premium cinematic layer */
:root{--ease-cine:cubic-bezier(.2,.8,.2,1);--glass:rgba(5,9,12,.58)}
html{scroll-padding-top:84px}
body.premium-film{background:#020507}
.film-grain{position:fixed;inset:-50%;z-index:998;pointer-events:none;opacity:.032;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");animation:grain .28s steps(2) infinite}
.film-vignette{position:fixed;inset:0;z-index:997;pointer-events:none;box-shadow:inset 0 0 180px rgba(0,0,0,.3);opacity:.55}
@keyframes grain{0%{transform:translate(0)}25%{transform:translate(2%,-1%)}50%{transform:translate(-1%,2%)}75%{transform:translate(1%,1%)}100%{transform:translate(-2%,-1%)}}
.film-chrome{position:fixed;left:0;right:0;bottom:0;z-index:1001;display:flex;justify-content:space-between;align-items:center;padding:10px 18px;font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:#91a0a7;pointer-events:none;opacity:0;transform:translateY(12px);transition:.45s var(--ease-cine);background:linear-gradient(0deg,rgba(2,5,7,.78),transparent)}
.walk.is-visible~*{} body:has(.walk.is-visible) .film-chrome{opacity:1;transform:none}.film-chrome-left,.film-chrome-right{display:flex;align-items:center;gap:9px}.film-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}.film-divider{height:12px;width:1px;background:#ffffff22}
.live-chip{display:inline-flex;align-items:center;gap:7px;margin-left:10px;padding:6px 9px;border:1px solid #ffffff22;border-radius:999px;font-size:.62rem;letter-spacing:.13em;color:#d8e1e5;background:#06101799;backdrop-filter:blur(10px)}.live-chip i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green)}
.opening-media img{transform:scale(1.075);animation:heroDrift 16s ease-out both}.opening-media:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 42%,transparent 0 20%,rgba(1,4,6,.22) 58%,rgba(1,4,6,.72) 100%)}
@keyframes heroDrift{from{transform:scale(1.13) translate3d(1.5%,0,0)}to{transform:scale(1.075) translate3d(0,0,0)}}
.media-stage{overflow:hidden}.media-stage img{will-change:transform,filter;transition:filter .9s var(--ease-cine)}.shot.active .media-stage img{filter:saturate(.8) contrast(1.08) brightness(.88)}
.media-badge{position:absolute;right:22px;bottom:22px;z-index:4;padding:7px 10px;border-radius:999px;border:1px solid #ffffff20;background:#03080bad;color:#d0d8dc;font-size:.56rem;letter-spacing:.13em;opacity:.52;backdrop-filter:blur(10px)}
.shot:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(1,4,6,.86) 0%,rgba(1,4,6,.43) 42%,rgba(1,4,6,.04) 72%),linear-gradient(0deg,rgba(0,0,0,.48),transparent 45%)}
.shot .shot-overlay{z-index:2}.shot-copy,.console-ui,.sound-cue,.access-chip,.rack-target,.status{z-index:5!important}
.shot-copy{transition:opacity .8s var(--ease-cine),transform 1s var(--ease-cine),filter 1s var(--ease-cine);filter:blur(6px)}.shot.active .shot-copy{filter:blur(0)}
.shot-kicker{display:flex;align-items:center;gap:9px}.shot-kicker:before{content:"";width:22px;height:1px;background:currentColor;opacity:.7}
.timecode{font-variant-numeric:tabular-nums;letter-spacing:-.05em}
.scene-nav{position:relative;display:grid;gap:9px}.walk-rail{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:1002;display:flex;flex-direction:column;align-items:center;gap:14px;padding:16px 11px;border-radius:999px;background:rgba(3,8,11,.58);border:1px solid #ffffff16;backdrop-filter:blur(14px);box-shadow:0 18px 50px rgba(0,0,0,.35);opacity:0;transition:.35s;pointer-events:none}.walk.is-visible .walk-rail{opacity:1;pointer-events:auto}.scene-time-rail{position:fixed;left:18px;top:50%;transform:translateY(-50%);z-index:1002;display:flex;flex-direction:column;gap:9px;padding:14px 15px;border-radius:14px;background:#03080b;border:1px solid #78b90066;backdrop-filter:blur(14px);box-shadow:0 18px 50px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:.45s var(--ease-cine)}body.cinema-live .scene-time-rail{opacity:1}.scene-time-rail span{display:flex;align-items:center;gap:7px;color:#9aa8ae;font-size:.58rem;letter-spacing:.06em;font-variant-numeric:tabular-nums;white-space:nowrap}.scene-time-rail i{width:14px;height:1px;background:#ffffff26;transition:.35s}.scene-time-rail span.active{color:#fff}.scene-time-rail span.active i{width:24px;background:var(--green);box-shadow:0 0 12px #78b90066}@media(max-width:900px){.scene-time-rail{display:none}}@media(prefers-reduced-motion:reduce){.scene-time-rail{display:none}}.scene-nav button{display:flex;align-items:center;gap:8px;border:0;background:transparent;color:#829098;padding:2px;cursor:pointer}.scene-nav i{display:block;width:5px;height:5px;border-radius:50%;background:#77848b;transition:.35s}.scene-nav span{font-size:.55rem;letter-spacing:.06em;opacity:0;transform:translateX(5px);transition:.3s}.scene-nav button:hover span,.scene-nav button.active span{opacity:1;transform:none}.scene-nav button.active{color:#fff}.scene-nav button.active i{background:var(--green);box-shadow:0 0 12px var(--green);transform:scale(1.45)}
.chapter-break{min-height:42vh;display:grid;place-items:center;background:#020507;border-top:1px solid #ffffff10;border-bottom:1px solid #ffffff10}.chapter-break-inner{text-align:center}.chapter-break-inner span{font-size:.65rem;letter-spacing:.22em;color:#728087}.chapter-break-inner p{font-size:clamp(1.4rem,3vw,3rem);letter-spacing:-.03em;margin:14px 0 0;color:#dbe3e6}
.console-ui{box-shadow:0 28px 80px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.04);backdrop-filter:blur(18px)}.console-line.active{position:relative}.console-line.active:after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:linear-gradient(90deg,var(--green),#6ca8ff);animation:diagnostic 3.8s ease-in-out infinite}.shot.active .console-line.active:after{width:100%}@keyframes diagnostic{0%{width:0;opacity:.3}70%{width:100%;opacity:1}100%{opacity:.25}}
.rack-target{animation:pulseRack 2.4s ease-in-out infinite}@keyframes pulseRack{0%,100%{box-shadow:0 0 0 0 rgba(120,185,0,.18)}50%{box-shadow:0 0 0 18px rgba(120,185,0,0)}}
.status span,.access-led{animation:ledPulse 1.8s ease-in-out infinite}@keyframes ledPulse{50%{box-shadow:0 0 18px var(--green);transform:scale(1.15)}}
.handoff-image img,.control-media img,.visit-bg img{transition:transform 1.4s var(--ease-cine)}.handoff:hover .handoff-image img,.control-room:hover .control-media img,.visit:hover .visit-bg img{transform:scale(1.035)}
.cap-card{transition:transform .4s var(--ease-cine),border-color .4s,background .4s}.cap-card:hover{transform:translateY(-5px);border-color:#78b90048;background:linear-gradient(180deg,#78b9000a,#ffffff02)}
.arch-node{transition:transform .4s var(--ease-cine),box-shadow .4s,border-color .4s}.arch-node:hover{transform:translateY(-5px);box-shadow:0 18px 45px #0a263625;border-color:#2f7df74a}
@media(max-width:800px){.film-grain{display:none}.film-chrome{font-size:.54rem;padding:8px 12px}.film-chrome-left span:last-child{display:none}.walk-rail{display:none}.media-badge{right:14px;bottom:14px}.shot:after{background:linear-gradient(0deg,rgba(1,4,6,.9) 0%,rgba(1,4,6,.32) 55%,rgba(1,4,6,.15) 100%)}}
@media(prefers-reduced-motion:reduce){.film-grain{display:none}.opening-media img{animation:none}.rack-target,.status span,.access-led,.console-line.active:after{animation:none}.media-stage img{transform:none!important}}

/* Sprint 4 · Real Assets / cinematic production layer */
.scene-video,.scene-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:opacity .65s var(--ease-cine),transform 1.4s var(--ease-cine),filter 1s var(--ease-cine)}
.scene-video{z-index:1;opacity:0;background:#020507}.scene-fallback{z-index:0;opacity:1}.media-stage.has-video .scene-video{opacity:1}.media-stage.has-video .scene-fallback{opacity:0}.media-stage.video-error .scene-video{display:none}.media-stage.video-error .scene-fallback{opacity:1}
.shot.active .scene-video{filter:saturate(.82) contrast(1.08) brightness(.9)}
.experience-controls{position:fixed;left:50%;top:72px;z-index:1003;display:flex;align-items:center;gap:8px;padding:4px;border-radius:999px;background:rgba(3,8,11,.68);border:1px solid #ffffff18;backdrop-filter:blur(14px);box-shadow:0 14px 34px rgba(0,0,0,.3);opacity:0;transform:translate(-50%,-8px);pointer-events:none;transition:.45s var(--ease-cine)}
body.cinema-live .experience-controls{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.experience-controls button{display:flex;align-items:center;gap:8px;border:1px solid transparent;background:transparent;color:#d9e2e6;border-radius:999px;padding:7px 11px;font:inherit;font-size:.63rem;letter-spacing:.05em;cursor:pointer;transition:.25s}
.experience-controls button:hover{border-color:#ffffff28;background:rgba(255,255,255,.06)}.experience-controls button[aria-pressed="true"]{border-color:#78b9005c;background:rgba(120,185,0,.12);color:#fff}.control-dot{width:7px;height:7px;border-radius:50%;background:#78858b}.experience-controls button[aria-pressed="true"] .control-dot{background:var(--green);box-shadow:0 0 10px var(--green)}
body.cinema-mode .topbar{transform:translateY(-110%);opacity:0;pointer-events:none}/* FIX (24 oct 2026): hay un html{scroll-padding-top:84px} pensado para
   que el contenido no quede tapado por el nav (72px) al saltar a una
   ancla. Ese hueco de 84px normalmente lo tapa el propio nav (oscuro),
   pero en modo cine el nav se oculta del todo y se veia un hueco claro
   de la seccion anterior en la parte de arriba. En vez de tocar el
   scroll (podria saltar el contenido de forma brusca), se tapa esa
   franja con una barra oscura -- efecto letterbox, va bien con el modo
   cine en vez de desentonar. */
body.cinema-mode::before{content:"";position:fixed;inset:0 0 auto 0;height:84px;background:#030609;z-index:39;pointer-events:none}
body.cinema-mode .film-chrome{opacity:1!important}body.cinema-mode .walk-rail{opacity:1!important}
body.cinema-mode .shot-copy{max-width:min(720px,80vw)}body.cinema-mode .shot-copy h2{font-size:clamp(2.8rem,6vw,6.5rem)}
.asset-transition{min-height:30vh;display:grid;place-items:center;background:#020507;border-top:1px solid #ffffff0d}.asset-transition-inner{text-align:center;padding:70px 24px}.asset-rule{display:block;width:42px;height:2px;margin:0 auto 18px;background:linear-gradient(90deg,var(--green),#2f7df7)}.asset-transition p{margin:0;color:#bdc9ce;font-size:clamp(1.05rem,2vw,1.5rem);letter-spacing:-.02em}
@media(max-width:800px){.experience-controls{left:50%;top:60px}.experience-controls button{padding:7px 9px}.experience-controls button span:last-child{display:none}.exp-status{padding:0 8px 0 2px;font-size:.58rem}.scene-video{object-position:center}.asset-transition-inner{padding:54px 20px}}

/* Sprint 5 · ScrollFilm engine */
body.scrollfilm-ready{--film-black:#010305}
.scrollfilm-intro{position:fixed;inset:0;z-index:2500;background:#010305;display:grid;place-items:center;transition:opacity .8s var(--ease-cine),visibility .8s}.scrollfilm-intro.is-gone{opacity:0;visibility:hidden;pointer-events:none}.scrollfilm-intro-inner{text-align:center;color:#fff}.scrollfilm-intro-mark{display:inline-flex;align-items:center;gap:10px;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#9faeb5}.scrollfilm-intro-mark i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 18px var(--green)}.scrollfilm-intro h2{margin:15px 0 6px;font-size:clamp(1.8rem,4vw,4.8rem);letter-spacing:-.05em}.scrollfilm-intro h2 span{color:#2f7df7}.scrollfilm-intro p{margin:0;color:#91a0a7;font-size:.86rem}

.shot{--scene-progress:0}.shot .shot-copy{transform:translate3d(0,calc((1 - var(--scene-progress))*28px),0);opacity:calc(.4 + var(--scene-progress)*.6);transition:filter .15s linear}.shot.active .shot-copy{filter:none}.shot:not(.active) .shot-copy{filter:blur(.2px)}
.shot .scene-video,.shot .scene-fallback{will-change:transform,filter,opacity}.shot.active .scene-fallback{filter:saturate(.78) contrast(1.1) brightness(.84)}
.scrollfilm-caption{position:absolute;left:clamp(78px,10vw,130px);bottom:22px;z-index:6;font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;color:#b8c4c9;display:flex;gap:10px;align-items:center}.scrollfilm-caption i{width:24px;height:1px;background:var(--green)}
.shot::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(2,6,9,.62) 0%,rgba(2,6,9,.15) 42%,rgba(2,6,9,0) 70%),linear-gradient(0deg,rgba(2,6,9,.7) 0%,transparent 42%)}
.shot.active::before{background:linear-gradient(90deg,rgba(2,6,9,.54) 0%,rgba(2,6,9,.11) 42%,rgba(2,6,9,0) 72%),linear-gradient(0deg,rgba(2,6,9,.62) 0%,transparent 43%)}
@media(max-width:900px){.scrollfilm-intro h2{font-size:clamp(2rem,9vw,4rem)}.scrollfilm-caption{display:none}}
@media(prefers-reduced-motion:reduce){.scrollfilm-intro{display:none}.shot .shot-copy{transform:none!important;opacity:1!important}}

/* Sprint 6 · Mastering: scene grading, soundstage, premium finishing */
:root{--grade-office:saturate(.72) contrast(1.08) brightness(.82);--grade-support:saturate(.68) contrast(1.1) brightness(.8);--grade-walk:saturate(.62) contrast(1.14) brightness(.74);--grade-rack:saturate(.82) contrast(1.13) brightness(.76);--grade-diagnostic:saturate(.56) contrast(1.18) brightness(.68);--grade-resolution:saturate(.76) contrast(1.08) brightness(.84)}
.shot[data-grade="office"] .scene-video,.shot[data-grade="office"] .scene-fallback{filter:var(--grade-office)}
.shot[data-grade="support"] .scene-video,.shot[data-grade="support"] .scene-fallback{filter:var(--grade-support)}
.shot[data-grade="walk"] .scene-video,.shot[data-grade="walk"] .scene-fallback{filter:var(--grade-walk)}
.shot[data-grade="rack"] .scene-video,.shot[data-grade="rack"] .scene-fallback{filter:var(--grade-rack)}
.shot[data-grade="diagnostic"] .scene-video,.shot[data-grade="diagnostic"] .scene-fallback{filter:var(--grade-diagnostic)}
.shot[data-grade="resolution"] .scene-video,.shot[data-grade="resolution"] .scene-fallback{filter:var(--grade-resolution)}
.shot.active .scene-video,.shot.active .scene-fallback{transform:scale(1.035);transition:transform 7s cubic-bezier(.22,.61,.36,1),filter 1.4s var(--ease-cine),opacity .65s var(--ease-cine)}
.shot:not(.active) .scene-video,.shot:not(.active) .scene-fallback{transform:scale(1.075)}
.shot[data-grade="walk"]::after{background:linear-gradient(90deg,rgba(1,5,8,.82) 0%,rgba(1,5,8,.34) 42%,rgba(4,20,31,.08) 72%),linear-gradient(0deg,rgba(0,0,0,.56),transparent 48%)}
.shot[data-grade="rack"]::after{background:radial-gradient(circle at 72% 48%,rgba(47,125,247,.08),transparent 34%),linear-gradient(90deg,rgba(1,5,8,.84),rgba(1,5,8,.28) 48%,transparent 78%)}
.shot[data-grade="diagnostic"]::after{background:radial-gradient(circle at 65% 45%,rgba(120,185,0,.08),transparent 28%),linear-gradient(90deg,rgba(1,5,8,.9),rgba(1,5,8,.42) 48%,rgba(1,5,8,.12) 78%)}
.shot[data-grade="resolution"]::after{background:linear-gradient(90deg,rgba(1,5,8,.74),rgba(1,5,8,.18) 52%,transparent 79%),linear-gradient(0deg,rgba(1,5,8,.58),transparent 45%)}
/* restrained anamorphic light streaks */
.shot[data-grade="rack"] .shot-media::after,.shot[data-grade="diagnostic"] .shot-media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,transparent 0 56%,rgba(54,130,255,.10) 66%,transparent 82%);mix-blend-mode:screen;opacity:.65}
/* cinema-mode simplifies interface and increases immersion */
body.cinema-mode{cursor:none}body.cinema-mode .experience-controls{cursor:auto}body.cinema-mode .scrollfilm-caption{opacity:.28}
/* mastering diagnostic overlay only when ?debug=1 */
.mastering-debug{display:none;position:fixed;left:18px;bottom:18px;z-index:3000;width:210px;padding:12px 13px;border:1px solid #ffffff1e;border-radius:12px;background:#02070adf;backdrop-filter:blur(16px);box-shadow:0 20px 60px #0009;color:#aebcc2;font-size:.62rem;letter-spacing:.05em;line-height:1.55}.mastering-debug.is-visible{display:grid;gap:3px}.mastering-debug strong{color:#fff;font-size:.66rem}.mastering-debug span:first-of-type{color:#7fbeff}
/* premium film gate */
.film-vignette{background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.14) 68%,rgba(0,0,0,.50) 112%)}
.film-grain{opacity:.055}
@media(max-width:800px){.shot.active .scene-video,.shot.active .scene-fallback{transform:scale(1.02)}.shot:not(.active) .scene-video,.shot:not(.active) .scene-fallback{transform:scale(1.04)}body.cinema-mode{cursor:auto}}
@media(prefers-reduced-motion:reduce){.shot .scene-video,.shot .scene-fallback{transform:none!important;transition:none!important}}


/* Sprint 7 · Production Ready */
.production-badge{position:fixed;z-index:80;left:24px;bottom:22px;display:flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(4,8,12,.62);backdrop-filter:blur(14px);color:rgba(255,255,255,.58);font:600 10px/1.2 system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;transition:opacity .35s ease,transform .35s ease}.production-badge span{width:6px;height:6px;border-radius:50%;background:#8fe21d;box-shadow:0 0 12px rgba(143,226,29,.65)}body.cinema-live .production-badge{opacity:.22;transform:translateY(4px)}@media(max-width:760px){.production-badge{left:14px;bottom:14px;font-size:8px;max-width:74vw}}@media print{.production-badge{display:none!important}}
/* Sprint 8 · Integrated Candidate */
body.sprint8-integrated .production-badge{display:none}
body.sprint8-integrated.debug-production .production-badge{display:flex}
.ctrl-brand .brand-num,footer .brand-num{color:var(--blue)!important}
.topbar-cta{display:inline-flex;align-items:center;gap:6px;border:1px solid #ffffff28!important;background:rgba(255,255,255,.06);border-radius:999px;padding:7px 14px!important;color:#fff!important;font-size:.7rem;letter-spacing:.06em;transition:.25s}
.topbar-cta:hover{border-color:#ffffff4a!important;background:rgba(255,255,255,.12)}



/* Sprint 9 · Motion + Sound verified preview */
body.sprint9-motion-sound .opening-media img{animation:s9HeroDrift 16s ease-in-out infinite alternate;will-change:transform}
@keyframes s9HeroDrift{from{transform:scale(1.035) translate3d(-.4%,0,0)}to{transform:scale(1.095) translate3d(.8%,-.5%,0)}}
body.sprint9-motion-sound .shot.active .scene-video{opacity:1;filter:saturate(.84) contrast(1.08) brightness(.88)}
body.sprint9-motion-sound .media-stage.has-video .scene-video{display:block;opacity:1}
body.sprint9-motion-sound .media-stage.has-video .scene-fallback{opacity:0}
body.sprint9-motion-sound .rack-target span,
body.sprint9-motion-sound .access-led,
body.sprint9-motion-sound .status span{animation:s9Pulse 1.55s ease-in-out infinite}
@keyframes s9Pulse{0%,100%{box-shadow:0 0 0 0 rgba(120,185,0,.15);opacity:.7}50%{box-shadow:0 0 0 9px rgba(120,185,0,0);opacity:1}}
body.sprint9-motion-sound .console-line.active strong{animation:s9Status 1.25s ease-in-out infinite alternate}
@keyframes s9Status{from{opacity:.55}to{opacity:1;text-shadow:0 0 14px rgba(120,185,0,.45)}}
body.sprint9-motion-sound .walk-progress span{transition:height .12s linear}
body.sprint9-motion-sound .shot.active .shot-copy{animation:s9CopyIn .8s cubic-bezier(.16,1,.3,1) both}
@keyframes s9CopyIn{from{opacity:.35;transform:translate3d(0,22px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
body.sprint9-motion-sound.sound-on [data-sound-toggle]{border-color:rgba(120,185,0,.65);box-shadow:0 0 0 1px rgba(120,185,0,.12),0 0 28px rgba(120,185,0,.1)}
body.sprint9-motion-sound.sound-on [data-sound-toggle] span:first-child{color:var(--green)}
.sound-hint{position:fixed;z-index:1004;right:18px;top:120px;max-width:260px;padding:10px 12px;border-radius:12px;background:rgba(2,7,10,.76);border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(16px);color:#c8d2d6;font-size:.68rem;line-height:1.4;opacity:0;transform:translateY(-8px);pointer-events:none;transition:.35s ease}.sound-hint.show{opacity:1;transform:none}.sound-hint b{color:#fff}
@media(max-width:800px){.sound-hint{right:10px;top:108px;max-width:220px}}
@media(prefers-reduced-motion:reduce){body.sprint9-motion-sound .opening-media img,body.sprint9-motion-sound .rack-target span,body.sprint9-motion-sound .access-led,body.sprint9-motion-sound .status span,body.sprint9-motion-sound .console-line.active strong{animation:none!important}}

/* Sprint 10 · Motion/Sound reliability hotfix */
body.sprint10-reliable .media-stage .scene-fallback{
  animation:s10FallbackMotion 9s ease-in-out infinite alternate;
  will-change:transform;
}
body.sprint10-reliable .media-stage.has-video .scene-fallback{animation:none}
@keyframes s10FallbackMotion{
  0%{transform:scale(1.06) translate3d(-1.2%,0,0)}
  100%{transform:scale(1.14) translate3d(1.2%,-1%,0)}
}
body.sprint10-reliable .shot.active .scene-video{
  animation:s10VideoFloat 7s ease-in-out infinite alternate;
}
@keyframes s10VideoFloat{
  from{transform:scale(1.02) translate3d(-.5%,0,0)}
  to{transform:scale(1.07) translate3d(.5%,-.5%,0)}
}
.s10-start{
  position:fixed;inset:0;z-index:99999;display:grid;place-items:center;
  background:radial-gradient(circle at 60% 45%,rgba(45,118,255,.13),transparent 30%),rgba(2,6,8,.96);
  color:#fff;transition:opacity .55s ease,visibility .55s ease;
}
.s10-start.hidden{opacity:0;visibility:hidden;pointer-events:none}
.s10-start-inner{text-align:center;padding:32px;max-width:680px}
.s10-start-kicker{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:#7d8b90;margin-bottom:14px}
.s10-start h2{font-size:clamp(2rem,5vw,4.8rem);line-height:.95;margin:0 0 20px;font-weight:700}
.s10-start h2 span{color:var(--green)}
.s10-start p{color:#b8c3c8;max-width:560px;margin:0 auto 26px;line-height:1.6}
.s10-start button{border:0;border-radius:999px;padding:14px 22px;background:var(--green);color:#081005;font-weight:800;cursor:pointer;box-shadow:0 12px 40px rgba(120,185,0,.18)}/* FIX (24 oct 2026, a peticion de Pedro): la pantalla de inicio
   (.s10-start, z-index 99999) tapaba el nav (.topbar, z-index 40) y el
   logo "Volver a CTRL360" quedaba inaccesible antes de pulsar Iniciar
   experiencia. Se probo subir el nav por encima del overlay, pero
   Pedro decidio no usar ese nav (no es el que pretendia el disenio
   original) y mantener la pantalla de inicio limpia/cinematica.
   Solucion definitiva: enlace de texto propio debajo del boton. */
.s10-start-skip{display:block;width:fit-content;margin:18px auto 0;color:#8b9aa1;font-size:.78rem;letter-spacing:.02em;text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;transition:.25s}
.s10-start-skip:hover{color:#d7dee1;border-bottom-color:#8b9aa1}


.exp-status{display:flex;align-items:center;gap:6px;padding:0 10px 0 4px;font-size:.62rem;letter-spacing:.07em;text-transform:uppercase;color:#b9c5c9;border-right:1px solid #ffffff18}.exp-status i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green);animation:s10Pulse 1.25s ease-in-out infinite}
@keyframes s10Pulse{50%{opacity:.35;transform:scale(.75)}}
@media(prefers-reduced-motion:reduce){body.sprint10-reliable .media-stage .scene-fallback,body.sprint10-reliable .shot.active .scene-video,.exp-status i{animation:none!important}}

/* Sprint 11 · Final visual polish & production handoff */
body.sprint11-final-polish{
  --c360-max:1240px;
  --c360-radius:24px;
}
body.sprint11-final-polish .topbar{padding-inline:clamp(18px,3vw,42px)}
body.sprint11-final-polish .opening-copy,
body.sprint11-final-polish .walk-intro,
body.sprint11-final-polish .platform-head,
body.sprint11-final-polish .capability-head,
body.sprint11-final-polish .control-copy,
body.sprint11-final-polish .visit-copy{max-width:min(var(--c360-max),calc(100vw - 40px));margin-inline:auto}
body.sprint11-final-polish .shot-copy{max-width:620px}
body.sprint11-final-polish .shot-copy h2{max-width:12ch;text-wrap:balance}
body.sprint11-final-polish .shot-copy p{max-width:54ch}
body.sprint11-final-polish .architecture-map,
body.sprint11-final-polish .capability-grid{max-width:var(--c360-max);margin-inline:auto}
body.sprint11-final-polish .architecture-map,
body.sprint11-final-polish .capability-card,
body.sprint11-final-polish .control-panel{border-radius:var(--c360-radius)}
body.sprint11-final-polish .visit{min-height:min(82vh,820px)}
body.sprint11-final-polish footer{padding-inline:clamp(20px,4vw,64px)}
body.sprint11-final-polish .scene-video,
body.sprint11-final-polish .scene-fallback,
body.sprint11-final-polish .opening-media img{image-rendering:auto;-webkit-font-smoothing:antialiased}
body.sprint11-final-polish .scene-video{object-fit:cover;width:100%;height:100%}
body.sprint11-final-polish .scene-fallback{object-fit:cover;width:100%;height:100%}
body.sprint11-final-polish .shot-media{overflow:hidden}
body.sprint11-final-polish .enter,
body.sprint11-final-polish .visit-primary,
body.sprint11-final-polish .visit-secondary{min-height:48px}
@media(min-width:1600px){
  body.sprint11-final-polish .shot-copy{max-width:700px}
  body.sprint11-final-polish .shot-copy h2{font-size:clamp(3.4rem,4.7vw,6.4rem)}
}
@media(max-width:780px){
  body.sprint11-final-polish .opening-copy,
  body.sprint11-final-polish .walk-intro,
  body.sprint11-final-polish .platform-head,
  body.sprint11-final-polish .capability-head,
  body.sprint11-final-polish .control-copy,
  body.sprint11-final-polish .visit-copy{max-width:calc(100vw - 28px)}
  body.sprint11-final-polish .shot-copy{max-width:calc(100vw - 34px)}
  body.sprint11-final-polish .architecture-map,
  body.sprint11-final-polish .capability-grid{max-width:calc(100vw - 28px)}
}