/* A continuous film controlled by the visitor's scroll. */
html { scroll-behavior: auto; }
body { --journey-ink: #090c10; --journey-white: #f3f2ed; }
.journey { height: 1250svh; background: var(--journey-ink); color: var(--journey-white); position: relative; }
.journey-stage { position: sticky; top: 0; height: 100svh; min-height: 600px; overflow: hidden; isolation: isolate; }
#world,.journey-fallback,.journey-vignette { position: absolute; inset: 0; width: 100%; height: 100%; }
#world { z-index: 1; display: block; opacity: 0; transition: opacity .6s ease; }
.webgl-ready #world { opacity: 1; }
.webgl-ready .journey-fallback { opacity: 0; }
.journey-fallback { object-fit: cover; }
.journey-vignette { z-index: 2; pointer-events: none; background: linear-gradient(90deg,rgba(9,12,16,.94),rgba(9,12,16,.78) 33%,rgba(9,12,16,.04) 62%),linear-gradient(0deg,rgba(9,12,16,.96),transparent 19%,transparent 80%,rgba(9,12,16,.35)); }
.journey-copy { z-index: 3; position: absolute; left: clamp(24px,6vw,110px); top: 50%; width: 46%; max-width: 690px; transform: translateY(-50%); pointer-events: none; }
.journey-eyebrow { color: #b9bab9; font: 10px/1.6 'JetBrains Mono',monospace; text-transform: uppercase; letter-spacing: .15em; margin: 0 0 25px; }
.journey-copy h1 { color: var(--journey-white); font-size: clamp(46px,5.8vw,91px); font-weight: 500; letter-spacing: -.065em; line-height: 1.03; margin: 0 0 30px; }
.journey-copy h1 span { color: #ff6849; }
.journey-description { font-size: clamp(15px,1.22vw,19px); line-height: 1.65; max-width: 380px; color: #bcbec1; margin: 0; }
.journey-actions { display: flex; align-items: center; gap: 24px; margin-top: 35px; font-size: 12px; pointer-events: auto; }
.journey-actions a { color: #e7e6e1; text-decoration: none; }
.journey-primary { background: #ff5a3c; color: #0b0d11 !important; padding: 14px 20px; font-weight: 700; }
.journey-actions a:hover { color: #ff795f; }
.scene-label { position: absolute; z-index: 3; top: 114px; left: 6vw; display: flex; gap: 10px; align-items: center; font: 10px 'JetBrains Mono',monospace; letter-spacing: .11em; color: #9ca1a6; }
.signal-dot { width: 5px; height: 5px; background: #ff5a3c; border-radius: 50%; }
.scene-coordinate { position: absolute; z-index: 3; right: 6vw; top: 114px; display: flex; flex-direction: column; text-align: right; gap: 8px; font: 9px 'JetBrains Mono',monospace; letter-spacing: .1em; color: #8b9196; }
.journey-motion,.journey-skip { position: absolute; z-index: 4; top: 158px; right: 6vw; border: 1px solid #31363d; background: #101419; color: #aeb3b9; font: 10px 'JetBrains Mono',monospace; padding: 9px 12px; cursor: pointer; text-decoration: none; }
.journey-skip { top: 198px; border-color: transparent; background: transparent; padding: 5px 0; }
.journey-bottom { position: absolute; z-index: 4; left: 6vw; right: 6vw; bottom: 36px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.scroll-cue { display: flex; gap: 12px; align-items: center; font: 10px 'JetBrains Mono',monospace; color: #9fa4aa; }
.scroll-cue > span:first-child { font-size: 24px; color: #ff6748; }
.chapter-nav { display: flex; align-items: center; gap: 5px; }
.chapter-nav button { border: 0; background: transparent; color: #757b82; font: 10px 'JetBrains Mono',monospace; padding: 13px 8px; cursor: pointer; transition: color .2s; }
.chapter-nav button::after { content: ''; display: block; height: 2px; width: 16px; margin-top: 9px; background: #343b43; }
.chapter-nav button[aria-current="step"] { color: #ff795e; }
.chapter-nav button[aria-current="step"]::after { background: #ff5a3c; }
.chapter-nav button:hover { color: #f3f2ed; }
.journey-counter { display: flex; align-items: baseline; gap: 9px; font: 10px 'JetBrains Mono',monospace; color: #606871; }
#chapter-count { font-size: 25px; color: #ecece7; }
.journey-rail { position: absolute; z-index: 5; bottom: 0; width: 100%; height: 2px; background: #1a2028; }
.journey-rail span { display: block; height: 100%; background: #ff5a3c; transform-origin: left; transform: scaleX(0); }
.journey button:focus-visible,.journey a:focus-visible { outline: 2px solid #ff795f; outline-offset: 5px; }
.cal-fab { z-index: 30; }
.in-journey .cal-fab { visibility: hidden; pointer-events: none; }
.static-chapters { padding-top: 70px; padding-bottom: 70px; }
.static-chapters article { padding: 35px 0; border-bottom: 1px solid #dcdedb; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.static-chapters h2 { font-size: 32px; letter-spacing: -.04em; }
.static-chapters p { max-width: 55ch; }
.journey-static .journey { height: 100svh; min-height: 650px; }
.journey-static .chapter-nav,.journey-static .journey-counter,.journey-static .journey-rail { display: none; }
.journey-static #world { display: none; }
.journey-static .journey-fallback { opacity: 1; }
@media(min-width:1600px) { .journey-copy { left: 8vw; } }
@media(max-width:900px) {
 .journey-stage { min-height: 600px; }
 .journey-copy { left: 24px; right: 24px; width: auto; top: 155px; transform: none; max-width: 500px; }
 .journey-copy h1 { font-size: clamp(36px,8vw,66px); margin-bottom: 17px; max-width: 440px; }
 .journey-eyebrow { font-size: 8px; letter-spacing: .08em; margin-bottom: 17px; }
 .journey-description { max-width: 320px; font-size: 13px; line-height: 1.6; }
 .journey-actions { margin-top: 20px; gap: 20px; font-size: 10px; }
 .journey-primary { padding: 10px 14px; }
 .scene-label { left: 24px; top: 96px; font-size: 8px; }
 .scene-coordinate { right: 24px; top: 96px; font-size: 7px; }
 .scene-coordinate span:last-child { display: none; }
 .journey-motion { right: 24px; top: 120px; padding: 7px 9px; font-size: 8px; }
 .journey-skip { top: auto; bottom: 111px; right: 24px; font-size: 8px; }
 .journey-vignette { background: linear-gradient(180deg,rgba(9,12,16,.5),rgba(9,12,16,.8) 25%,transparent 53%,transparent 77%,rgba(9,12,16,.95)); }
 .journey-bottom { left: 24px; right: 24px; bottom: 26px; flex-wrap: wrap; gap: 15px; }
 .scroll-cue { font-size: 9px; flex: 1; }
 .journey-counter { order: 1; }
 .chapter-nav { order: 2; width: 100%; justify-content: space-between; gap: 0; }
 .chapter-nav button { padding: 12px 5px; min-height: 44px; font-size: 8px; }
 .chapter-nav button::after { width: 14px; margin-top: 6px; }
 .static-chapters article { grid-template-columns: 1fr; gap: 5px; }
 .journey-static .journey-fallback { object-position: 68% 50%; }
 .journey-static .journey { min-height: 740px; }
}
@media(prefers-reduced-motion:reduce) { .journey * { transition: none !important; } }