@font-face{font-family:Manrope;src:url('assets/fonts/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{color-scheme:dark;--brand-magenta:#f0066f;--pink:var(--brand-magenta);--ink:#06070b;--muted:#a4a9b5;--line:rgba(255,255,255,.18)}
*{box-sizing:border-box}html{background:var(--ink);scrollbar-color:#55515e #08090d}body{margin:0;color:#f7f6f9;font-family:Manrope,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #ff62b6;outline-offset:6px}button{border:0}button[hidden],[hidden]{display:none!important}.skip-link{position:fixed;top:-80px;left:20px;z-index:20;padding:14px;background:#241323}.skip-link:focus{top:15px}#journey{height:600svh}.stage{height:100svh;min-height:620px;position:sticky;top:0;overflow:hidden;background:#050609}.cinema,.cinema img,.cinema video,.shade{position:absolute;inset:0;width:100%;height:100%}.cinema img,.cinema video{object-fit:cover;object-position:center;transition:opacity .35s}.cinema video{opacity:0}.cinema video.visible{opacity:1}.shade{background:linear-gradient(90deg,rgba(4,5,9,.85),rgba(4,5,9,.38) 38%,transparent 74%),linear-gradient(0deg,rgba(4,5,9,.94),transparent 32%,transparent 77%,rgba(4,5,9,.55));transition:background 1s}.stage[data-scene="1"] .shade,.stage[data-scene="3"] .shade,.stage[data-scene="4"] .shade{background:linear-gradient(0deg,rgba(4,5,9,.92),transparent 50%,transparent 80%,rgba(4,5,9,.55))}header{position:absolute;top:0;left:0;width:100%;padding:27px 4.2vw;display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:4}.brand{display:flex;width:180px}.brand img{width:100%;height:auto}.header-caption{font-size:10px;letter-spacing:.2em;color:#c3c3cf}.text-button{background:transparent;font-size:12px;font-weight:500;letter-spacing:.03em;padding:10px 0}.text-button span{margin-left:20px;color:#f0066f}.text-button:hover{color:#ff78bd}.edge-label{position:absolute;right:2.1vw;top:42%;writing-mode:vertical-rl;font-size:9px;letter-spacing:.23em;color:#a3a7b0;opacity:.65}.copy{position:absolute;left:7vw;bottom:24%;max-width:750px;opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .65s,transform .65s,visibility .65s;pointer-events:none}.copy.active{opacity:1;visibility:visible;transform:none;pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:.2em;font-weight:600;color:#ddd5e0;display:flex;align-items:center;gap:10px;margin:0 0 23px}.eyebrow i{display:block;width:6px;height:6px;background:var(--pink);box-shadow:0 0 18px var(--pink);border-radius:50%}h1,h2,p{margin-top:0}h1,h2{font-family:Manrope,Arial,sans-serif;font-weight:400;letter-spacing:-.055em;line-height:1.04}h1{font-size:clamp(40px,5.25vw,84px);margin-bottom:23px}.headline-brand{display:block;color:#f0066f;margin-top:6px}.intro-description{font-size:15px;color:#bfc3ce;line-height:1.7;margin-bottom:27px}.pill{border:1px solid rgba(255,255,255,.35);background:rgba(12,13,19,.3);border-radius:100px;padding:15px 23px;font-size:12px;display:inline-flex;align-items:center;gap:35px;transition:background .2s,border .2s}.pill:hover{background:#6b1147;border-color:#ff50ac}.pill.primary{background:#f0edf2;color:#101018;border:1px solid #f0edf2}.pill.primary:hover{background:#ffc5e6}.pill span{font-size:18px}.story{bottom:21%;max-width:85%}.story h2{font-size:clamp(30px,3.8vw,60px);text-shadow:0 3px 30px #000}.chaos h2{font-size:clamp(80px,13vw,190px);margin:0 0 18px;letter-spacing:-.065em}.chaos h2 span{color:var(--pink)}.chaos>p:not(.eyebrow){color:#dddce3;line-height:1.65;font-size:17px;margin-bottom:25px}.controls{position:absolute;bottom:30px;left:4.2vw;right:4.2vw;display:flex;align-items:center;justify-content:space-between;gap:25px;z-index:4}.chapter-heading{display:flex;flex-direction:column;gap:9px;min-width:170px}.chapter-heading span:first-child{font-size:10px;letter-spacing:.16em;color:#f0066f}.chapter-heading span:last-child{font-size:9px;letter-spacing:.17em;color:#b9b8c2}.controls nav{display:flex;width:42%;gap:8px}.controls nav button{background:transparent;flex:1;padding:12px 0;text-align:left;min-width:0}.controls nav button>span{display:block;height:2px;background:#5e5d6b;margin-bottom:10px;position:relative}.controls nav button>span::after{content:'';position:absolute;inset:0;background:var(--pink);transform:scaleX(0);transform-origin:left;transition:transform .4s}.controls nav button[aria-current] span::after,.controls nav button.done span::after{transform:scaleX(1)}.controls small{font-size:9px;color:#8e8e9d}.controls button[aria-current] small{color:#fff}.play-controls{display:flex;align-items:center;justify-content:flex-end;gap:22px;min-width:180px}.timeline{position:absolute;bottom:0;left:0;height:2px;width:100%;background:#17121c}.timeline div{height:100%;background:var(--pink);width:0;transition:width .3s}.engine-panel{position:absolute;top:19%;left:55%;width:38%;max-width:570px;z-index:3}.engine-panel .eyebrow{margin-bottom:16px}.engine-panel h2{font-size:clamp(28px,3vw,46px);margin-bottom:24px}.engine-panel h2 span{color:#c0b8c8}.layer-list{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);gap:0 16px}.layer-tab{text-align:left;padding:13px 0;background:transparent;color:#9998a6;border-bottom:1px solid var(--line);font-size:12px;display:flex;gap:12px;align-items:center}.layer-tab .number{font-size:9px;color:#7e7987}.layer-tab[aria-selected=true]{color:#fff;border-bottom-color:var(--pink)}.layer-tab[aria-selected=true] .number{color:#f0066f}.layer-tab:hover{color:#ff78bd}.layer-detail{min-height:156px;padding:22px 0 8px}.layer-detail h3{font-size:16px;font-weight:500;margin:0 0 8px}.layer-detail p{font-size:13px;line-height:1.65;color:#aaa7b4;max-width:440px;margin-bottom:13px}.tags{display:flex;flex-wrap:wrap;gap:6px}.tags span{border:1px solid #3c293a;color:#d7b4cd;font-size:9px;padding:5px 8px;border-radius:3px}.replay{color:#9d96a5;font-size:11px}.stage[data-scene="5"] .shade{background:linear-gradient(0deg,#050609,transparent 25%)}.stage[data-scene="5"] .cinema img{object-fit:contain}.layer-marker{display:none;position:absolute;width:11%;left:38%;top:30%;align-items:center;pointer-events:none;transition:top .35s}.stage[data-scene="5"] .layer-marker{display:flex}.layer-marker span{height:6px;width:6px;flex-shrink:0;border-radius:50%;background:#f0066f;box-shadow:0 0 15px var(--pink)}.layer-marker i{width:100%;height:1px;background:linear-gradient(90deg,#f0066f,transparent)}.loading,.media-error{position:absolute;left:50%;bottom:125px;transform:translateX(-50%);font-size:12px;padding:12px 18px;background:rgba(13,9,19,.9);border:1px solid #443143;border-radius:30px;z-index:5}.loading span{display:inline-block;width:7px;height:7px;background:var(--pink);border-radius:50%;margin-right:8px;animation:pulse 1s infinite}.media-error{width:max-content;max-width:90%;text-align:center}.noscript{position:fixed;bottom:5px;z-index:10;background:#111;padding:8px;font-size:12px}@keyframes pulse{50%{opacity:.3}}@media(min-width:1700px){.engine-panel{top:23%}}@media(max-height:750px) and (min-width:801px){.stage{min-height:540px}.copy{bottom:22%}h1{font-size:clamp(40px,4.6vw,65px)}.engine-panel{top:15%}.engine-panel h2{font-size:30px;margin-bottom:17px}.layer-tab{padding:10px 0}.layer-detail{padding-top:15px;min-height:135px}.controls{bottom:22px}.intro-description{margin-bottom:18px}}
@media(max-width:800px),(max-aspect-ratio:3/4){#journey{height:600svh}.stage{min-height:650px}header{padding:22px 6vw}.brand{width:142px}.header-caption,.edge-label{display:none}header .text-button{font-size:10px}.copy{left:7vw;right:7vw;bottom:25%}.intro{bottom:24%}h1{font-size:clamp(38px,8vw,63px)}.eyebrow{font-size:8px;letter-spacing:.16em;margin-bottom:18px}.intro-description{font-size:13px}.cinema img,.cinema video{object-position:61% center}.shade{background:linear-gradient(90deg,rgba(4,5,9,.75),rgba(4,5,9,.15)),linear-gradient(0deg,#050609,transparent 95%)}.story h2{font-size:37px}.controls{left:6vw;right:6vw;bottom:22px;flex-wrap:wrap;gap:10px}.chapter-heading{min-width:0;flex:1}.chapter-heading span:last-child{font-size:8px}.controls nav{order:3;width:100%;gap:7px}.controls small{font-size:8px}.play-controls{min-width:0;gap:15px}.play-controls button{font-size:11px}.pill{padding:13px 20px}.chaos h2{font-size:100px}.chaos>p:not(.eyebrow){font-size:14px}.engine-panel{left:7vw;top:43%;width:86%;max-width:none}.engine-panel h2{font-size:25px;margin-bottom:16px}.engine-panel h2 br{display:none}.engine-panel h2 span{display:block}.engine-panel .eyebrow{font-size:8px;margin-bottom:8px}.layer-tab{font-size:11px;padding:9px 0}.layer-detail{padding-top:13px;min-height:140px}.layer-detail h3{font-size:14px}.layer-detail p{font-size:11px;margin-bottom:8px}.tags span{font-size:8px;padding:4px 6px}.replay{display:none}.stage[data-scene="5"] .cinema img{width:200%;height:43%;left:-3%;top:7%;object-fit:contain;object-position:left center}.stage[data-scene="5"] .shade{background:linear-gradient(0deg,#050609 54%,transparent 70%)}.stage[data-scene="5"] .layer-marker{display:none}.stage[data-scene="5"] .controls .chapter-heading{display:none}.stage[data-scene="5"] .controls{justify-content:flex-end}.loading{bottom:145px;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}#journey{height:100svh}}

@media(max-width:800px) and (max-height:740px){.engine-panel{top:36%}.engine-panel h2{font-size:22px;margin-bottom:12px}.layer-tab{padding:7px 0}.layer-detail{min-height:118px;padding-top:10px}.stage[data-scene="5"] .cinema img{height:34%}.stage[data-scene="5"] .shade{background:linear-gradient(0deg,#050609 61%,transparent 74%)}.engine-panel .eyebrow{font-size:7px}.tags span{padding:3px 5px}.controls{bottom:15px}}

/* The cinematic titles use the same display scale and Manrope treatment as the page. */
.stage .copy{max-width:none;right:7vw}
.stage .copy h1,.stage .story h2{
  font-size:clamp(44px,min(8.7vw,14svh),160px);
  font-weight:500;letter-spacing:-.068em;line-height:1.02;
  text-wrap:balance;
}
.stage .story h2{font-size:clamp(44px,min(7vw,13svh),128px)}
.stage .intro{bottom:20%}
.stage .intro h1{margin-bottom:24px}
.stage .story{bottom:22%}
.stage .chaos h2{font-weight:500;line-height:1.02}
@media(max-width:800px),(max-aspect-ratio:3/4){
  .stage .copy h1,.stage .story h2{font-size:clamp(40px,min(11.3vw,9svh),76px)}
  .stage .intro{bottom:23%}
  .stage .story{bottom:24%}
}
@media(max-height:800px) and (min-width:801px){
  .stage .intro h1{font-size:clamp(38px,min(8.7vw,11.5svh),100px)}
}
@media(max-height:600px) and (min-width:801px){
  .stage .intro h1,.stage .story h2{font-size:clamp(38px,11svh,66px)}
  .stage .intro{bottom:20%}
  .stage .intro .eyebrow{margin-bottom:14px}
  .stage .intro-description{margin-bottom:16px}
}

/* The second editorial line carries the OpsAtlas brand accent. */
.stage .heading-accent,.stage .headline-brand,.engine-layout .engine-panel h2 .heading-accent{color:var(--brand-magenta)}
.stage .chaos h2{margin-bottom:24px}
.stage .chaos>p:not(.eyebrow){max-width:780px}
@media(max-width:800px),(max-aspect-ratio:3/4){.stage .chaos{bottom:22%}.stage .chaos>p:not(.eyebrow) br{display:none}}
