:root{--bg:#080808;--text:#f5f3ed;--muted:#f5f3edb8;--line:#ffffff40;--font-display:"Playfair Display", Georgia, "Times New Roman", serif;--font-body:"Inter", -apple-system, "Segoe UI", Roboto, Arial, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}button,a{font:inherit}button{cursor:pointer}.topbar{z-index:50;mix-blend-mode:difference;justify-content:space-between;align-items:center;padding:28px 4vw;display:flex;position:fixed;top:0;left:0;right:0}.logo{color:#fff;letter-spacing:.2em;font-size:15px;font-weight:800;text-decoration:none}.logo span{opacity:.55}.counter{color:#fff;letter-spacing:.15em;letter-spacing:.15em;font-size:12px;font-family:var(--font-body)}.counter strong{font-size:18px;font-family:var(--font-display);margin-right:5px}.scene-nav{z-index:51;gap:11px;display:grid;position:fixed;top:50%;right:4vw;transform:translateY(-50%)}.scene-nav button{background:#ffffff59;border:0;width:28px;height:3px;padding:0;transition:all .3s}.scene-nav button.active{background:#fff;width:46px}.scene-nav span{opacity:0;pointer-events:none;position:absolute}.hero{background:radial-gradient(circle at 50% 40%,#ffffff14,#0000 35%),#080808;place-items:center;min-height:100vh;display:grid;position:relative;overflow:hidden}@supports (min-height:100svh){.hero{min-height:100svh}}.hero-grid{opacity:.2;background-image:linear-gradient(#ffffff14 1px,#0000 1px),linear-gradient(90deg,#ffffff14 1px,#0000 1px);background-size:80px 80px;position:absolute;inset:0}.hero-content{text-align:center;width:min(900px,82vw);position:relative}.eyebrow{letter-spacing:.28em;color:var(--muted);font-size:12px;font-weight:700;font-family:var(--font-body);text-transform:uppercase;text-shadow:0 1px 8px #000000e6;margin:0 0 22px}.hero h1{letter-spacing:-.02em;font-size:clamp(4rem,10vw,9rem);line-height:.88;font-family:var(--font-display);-webkit-text-stroke:1px #00000059;text-shadow:0 2px 18px #000000d9;margin:0;font-weight:500}.hero h1 em{font-family:var(--font-display);font-style:italic;font-weight:400}.hero-copy{width:min(480px,90%);color:var(--muted);margin:36px auto 0;font-size:15px;line-height:1.7}.start,.ending button{color:#fff;background:0 0;border:1px solid #ffffff4d;border-radius:100px;margin-top:35px;padding:13px 18px;transition:all .25s}.start:hover,.ending button:hover{color:#000;background:#fff}.start span{margin-left:12px}.story{height:calc(100vh * var(--scene-count,5));position:relative}.story-stage{height:var(--stage-height,100vh);position:sticky;top:0;overflow:hidden}@supports (height:100svh){.story{height:calc(100svh * var(--scene-count,5))}}.story-scene{will-change:opacity;position:absolute;inset:0;overflow:hidden}.story-image{will-change:transform;position:absolute;inset:-5%}.image{object-fit:cover}.scene-shade{background:linear-gradient(90deg,#000000bd 0%,#00000057 48%,#0000001f 100%),linear-gradient(#0000002e,#0000 62%,#00000094);position:absolute;inset:0}.story-text{z-index:2;will-change:transform, opacity;width:min(680px,70vw);position:absolute;top:36%;left:9vw;transform:translateY(-50%)}.story-text h2{letter-spacing:-.01em;max-width:680px;font-size:clamp(3rem,7vw,7rem);line-height:.94;font-family:var(--font-display);-webkit-text-stroke:1px #00000073;text-shadow:0 2px 6px #0000008c,0 6px 30px #000c;margin:0;font-weight:600}.description{max-width:460px;color:var(--muted);-webkit-text-stroke:1px #0000004d;text-shadow:0 1px 8px #000000e6;margin-top:28px;font-size:17px;line-height:1.8}.story-progress{z-index:4;gap:8px;display:flex;position:absolute;bottom:35px;left:9vw}.story-progress span{background:#ffffff59;width:30px;height:2px}.story-progress .current-dot{background:#fff}.scene-anchor{pointer-events:none;width:1px;height:1px;position:absolute}.ending{text-align:center;place-content:center;min-height:70vh;padding:10vw;display:grid}@supports (min-height:70svh){.ending{min-height:70svh}}.ending h2{letter-spacing:-.01em;font-size:clamp(3rem,7vw,7rem);line-height:.9;font-family:var(--font-display);-webkit-text-stroke:1px #00000073;text-shadow:0 2px 18px #000c;margin:0;font-weight:600}@media (max-width:700px){.topbar{padding:20px 22px}.scene-nav{right:18px}.story-text{width:78vw;left:8vw}.story-text h2{font-size:clamp(2.7rem,11vw,5rem)}.description{font-size:15px;line-height:1.75}.hero h1{font-size:clamp(4rem,18vw,7rem)}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
