:root {
  --ink: #12162a;
  --ink-soft: #1b2039;
  --paper: #f1e9dd;
  --paper-soft: #d8cbbb;
  --amber: #dda75d;
  --rose: #a46a71;
  --plum: #513a58;
  --blue: #7ca6bd;
  --green: #415f50;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Avenir Next', Avenir, 'Segoe UI', Helvetica, Arial, sans-serif;
  --hand: 'Segoe Print', 'Bradley Hand', 'Comic Sans MS', cursive;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; color: var(--paper); background: var(--ink); font-family: var(--sans); overflow-x: hidden; }
body.menu-open { overflow: hidden; }
a { color: inherit; }
button { font: inherit; }
::selection { background: rgba(221, 167, 93, .34); color: #fff; }

.skip-link { position: fixed; z-index: 100; left: 1rem; top: 0; padding: .8rem 1rem; background: var(--paper); color: var(--ink); transform: translateY(-250%); transition: transform .2s ease; }
.skip-link:focus { top: 1rem; transform: translateY(0); }

.site-header { position: fixed; z-index: 30; inset: 0 0 auto 0; height: 5.5rem; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 clamp(1.25rem, 4vw, 4.5rem); color: #fff; mix-blend-mode: normal; transition: background .35s ease, height .35s ease, border-color .35s ease; border-bottom: 1px solid transparent; }
.site-header.scrolled { height: 4.5rem; background: rgba(15, 19, 36, .88); border-color: rgba(255,255,255,.1); backdrop-filter: blur(14px); }
.monogram { justify-self: start; font-family: var(--serif); font-size: 1.05rem; letter-spacing: .16em; text-decoration: none; }
.monogram span { color: var(--amber); font-style: italic; margin: 0 .12rem; }
.site-header > p { margin: 0; font-family: var(--serif); font-size: .82rem; font-style: italic; letter-spacing: .08em; opacity: .76; }
.soundless-menu { justify-self: end; display: flex; align-items: center; gap: .75rem; border: 0; color: inherit; background: none; cursor: pointer; padding: .5rem 0; text-transform: uppercase; letter-spacing: .15em; font-size: .68rem; }
.menu-mark { position: relative; width: 1.4rem; height: .8rem; }
.menu-mark i { position: absolute; right: 0; width: 100%; height: 1px; background: currentColor; transition: transform .25s ease, top .25s ease; }
.menu-mark i:first-child { top: .15rem; }
.menu-mark i:last-child { top: .62rem; width: 70%; }
.soundless-menu[aria-expanded="true"] .menu-mark i:first-child { top: .38rem; transform: rotate(45deg); }
.soundless-menu[aria-expanded="true"] .menu-mark i:last-child { top: .38rem; width: 100%; transform: rotate(-45deg); }
.chapter-nav { position: fixed; z-index: -1; inset: 0; display: grid; place-content: center; gap: 1.25rem; background: rgba(13, 16, 31, .98); opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease; }
.chapter-nav.open { opacity: 1; visibility: visible; z-index: -1; }
.chapter-nav a { min-width: min(75vw, 28rem); padding: .85rem 0; font: clamp(1.6rem, 4vw, 3rem)/1 var(--serif); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.14); transition: color .2s ease, padding-left .2s ease; }
.chapter-nav a:hover, .chapter-nav a:focus-visible { color: var(--amber); padding-left: .6rem; }
.chapter-nav span { display: inline-block; width: 2.8rem; color: var(--amber); font: .68rem/1 var(--sans); letter-spacing: .12em; }

.hero { position: relative; min-height: 100svh; display: grid; place-items: center; overflow: hidden; isolation: isolate; background: #0c1222; }
.hero::before { content: ''; position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg, rgba(8,12,24,.18), rgba(8,12,24,.18) 50%, #11152a 100%), radial-gradient(circle at 50% 45%, rgba(17,21,42,.25), rgba(7,11,23,.68) 90%); }
.hero-art { position: absolute; z-index: 0; inset: -3%; background: url('/landing-assets/our-world.webp') center center/cover no-repeat; animation: drift 18s ease-in-out infinite alternate; }
.hero-content { position: relative; z-index: 3; text-align: center; width: min(92%, 67rem); padding: 8rem 1rem 9rem; text-shadow: 0 2px 30px rgba(0,0,0,.36); }
.eyebrow, .kicker { margin: 0 0 1.6rem; text-transform: uppercase; letter-spacing: .25em; font-size: .65rem; font-weight: 600; }
.eyebrow { display: flex; justify-content: center; align-items: center; gap: 1rem; color: rgba(255,255,255,.78); }
.eyebrow span { width: 2.5rem; height: 1px; background: var(--amber); }
.hero h1 { margin: 0; display: flex; justify-content: center; align-items: center; gap: clamp(.45rem, 2vw, 1.3rem); font: 400 clamp(4rem, 10.5vw, 9.4rem)/.82 var(--serif); letter-spacing: -.07em; }
.hero h1 span { display: block; }
.hero h1 em { color: var(--amber); font-size: .48em; font-weight: 400; }
.hero-line { margin: 1.65rem 0 0; font: italic 400 clamp(1.15rem, 2.2vw, 1.8rem)/1.3 var(--serif); letter-spacing: .055em; }
.hero-copy { width: min(100%, 35rem); margin: 1.7rem auto 0; color: rgba(255,255,255,.75); font-size: clamp(.9rem, 1.3vw, 1.05rem); line-height: 1.8; }
.enter-link { position: absolute; z-index: 4; left: 50%; bottom: 2rem; display: flex; flex-direction: column; align-items: center; gap: .8rem; transform: translateX(-50%); text-decoration: none; text-transform: uppercase; font-size: .62rem; letter-spacing: .18em; white-space: nowrap; color: rgba(255,255,255,.75); }
.enter-link i { position: relative; width: 1px; height: 2.5rem; background: rgba(255,255,255,.35); overflow: hidden; }
.enter-link i::after { content: ''; position: absolute; inset: -100% 0 auto; height: 55%; background: #fff; animation: scrollLine 2s ease-in-out infinite; }
.hero-note { position: absolute; z-index: 3; right: clamp(1rem, 5vw, 5rem); bottom: 3.4rem; transform: rotate(-6deg); opacity: .66; }
.handwritten { font: 400 .95rem/1.4 var(--hand); letter-spacing: .03em; }
.stars i { position: absolute; z-index: 2; width: 3px; height: 3px; border-radius: 50%; background: #fff4d5; box-shadow: 0 0 12px #fff; animation: twinkle 3s ease-in-out infinite; }
.stars i:nth-child(1) { left: 12%; top: 28%; animation-delay: -.4s; }
.stars i:nth-child(2) { left: 36%; top: 16%; animation-delay: -1.2s; }
.stars i:nth-child(3) { left: 62%; top: 27%; animation-delay: -2.1s; }
.stars i:nth-child(4) { left: 83%; top: 19%; animation-delay: -.8s; }
.stars i:nth-child(5) { left: 71%; top: 62%; animation-delay: -1.7s; }
.stars i:nth-child(6) { left: 21%; top: 67%; animation-delay: -2.4s; }

.prologue { min-height: 42rem; padding: 10rem max(1.5rem, 8vw); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: var(--ink); }
.prologue-orbit { display: flex; align-items: center; gap: .8rem; margin-bottom: 3rem; font: italic 1.15rem var(--serif); color: var(--amber); }
.prologue-orbit i { width: 4.5rem; height: 1.5rem; border: 1px solid rgba(221,167,93,.35); border-radius: 50%; transform: rotate(-9deg); }
.prologue .kicker { color: var(--amber); }
.prologue h2 { margin: 0; font: 400 clamp(2.8rem, 6vw, 5.8rem)/.98 var(--serif); letter-spacing: -.045em; }
.prologue > p:not(.kicker) { width: min(100%, 43rem); margin: 2.4rem auto 1.5rem; color: var(--paper-soft); line-height: 1.9; font-size: 1rem; }
.prologue .handwritten { color: var(--rose); transform: rotate(-2deg); }
.storyline { position: absolute; z-index: 3; left: 50%; height: 22rem; width: 1px; transform: translate(-50%, -11rem); background: linear-gradient(transparent, rgba(221,167,93,.55), transparent); }

.place { min-height: 50rem; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(20rem, .88fr); align-items: stretch; }
.place-reverse { grid-template-columns: minmax(20rem, .88fr) minmax(0, 1.12fr); }
.place-reverse .place-visual { order: 2; }
.place-reverse .place-copy { order: 1; }
.place-visual { position: relative; min-height: 50rem; overflow: hidden; isolation: isolate; }
.place-copy { padding: clamp(5rem, 10vw, 10rem) clamp(2.2rem, 7vw, 8rem); display: flex; flex-direction: column; justify-content: center; }
.place-copy .kicker { margin-bottom: 1.4rem; opacity: .72; }
.place-copy h2 { margin: 0; max-width: 8ch; font: 400 clamp(3.4rem, 6.6vw, 7rem)/.88 var(--serif); letter-spacing: -.055em; }
.place-copy h2 em { font-weight: 400; color: var(--blue); }
.place-intro { max-width: 30rem; margin: 2.4rem 0 .8rem; font: 400 clamp(1.25rem, 2vw, 1.65rem)/1.45 var(--serif); }
.place-detail { max-width: 29rem; margin: .7rem 0 2.4rem; color: currentColor; opacity: .68; line-height: 1.8; font-size: .94rem; }
.place-link { display: inline-flex; align-items: center; gap: 1.2rem; width: fit-content; padding: .9rem 0; text-decoration: none; text-transform: uppercase; letter-spacing: .16em; font-size: .68rem; border-bottom: 1px solid currentColor; transition: gap .25s ease, color .25s ease; }
.place-link i { position: relative; display: block; width: 2.7rem; height: 1px; background: currentColor; }
.place-link i::after { content: ''; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); }
.place-link:hover, .place-link:focus-visible { gap: 1.8rem; color: var(--amber); }
.chapter-number { position: absolute; z-index: 5; top: 2.5rem; left: 2.5rem; font: italic 1rem var(--serif); letter-spacing: .08em; }
.visual-note { position: absolute; z-index: 5; right: 2.5rem; bottom: 2.5rem; transform: rotate(-5deg); }

.place-memory { color: #f2e8dc; background: #4c2f3d; }
.place-memory .place-copy { background: linear-gradient(145deg, #573746, #3b2b3b); }
.place-memory .place-visual { background: #251f30; }
.memory-scene { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,17,30,.12), rgba(18,17,30,.7)), url('/landing-assets/our-world.webp') 15% center/cover; transform: scale(1.05); transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.place-memory:hover .memory-scene { transform: scale(1); }
.photo { position: absolute; width: 13rem; height: 16rem; padding: .7rem .7rem 2.5rem; background: #e9dfd0; box-shadow: 0 1.5rem 4rem rgba(0,0,0,.35); }
.photo::before { content: ''; display: block; height: 100%; background-color: rgba(72,43,59,.58); background-position: center; background-size: cover; background-repeat: no-repeat; border: 1px solid rgba(255,255,255,.2); }
.photo span { display: block; margin-top: .55rem; color: #3d3040; font: .78rem var(--hand); text-align: center; }
.photo-one { left: 12%; bottom: 12%; transform: rotate(-8deg); }
.photo-one::before { background-image: url('/landing-assets/photos/anilar-01.jpg?v=20261002-1'); }
.photo-two { right: 10%; top: 14%; transform: rotate(7deg); }
.photo-two::before { background-image: url('/landing-assets/photos/anilar-02.jpg?v=20261002-1'); }

.place-together { color: #e9edf3; background: #151d36; }
.place-together .place-copy { background: linear-gradient(145deg, #151d36, #10162a); }
.place-together .place-visual { background: radial-gradient(circle at 27% 40%, rgba(211,107,61,.22), transparent 32%), radial-gradient(circle at 74% 62%, rgba(97,177,211,.22), transparent 32%), #11172b; }
.element-orbit { position: absolute; width: 19rem; height: 19rem; border: 1px solid; border-radius: 50%; animation: orbitFloat 6s ease-in-out infinite alternate; }
.element-orbit i { position: absolute; width: 2.5rem; height: 2.5rem; border-radius: 50%; box-shadow: 0 0 40px currentColor; }
.orbit-fire { left: 12%; top: 17%; color: #dd7648; border-color: rgba(221,118,72,.25); }
.orbit-fire i { top: 2.3rem; right: .7rem; background: #ed8a51; }
.orbit-water { right: 10%; bottom: 15%; color: #71b7d4; border-color: rgba(113,183,212,.25); animation-delay: -2.5s; }
.orbit-water i { bottom: 2.3rem; left: .7rem; background: #91d1e8; }
.together-path { position: absolute; inset: 18% 12%; border: 1px solid rgba(255,255,255,.1); transform: rotate(-12deg); }
.together-path::before, .together-path::after { content: ''; position: absolute; height: 1px; background: rgba(255,255,255,.12); width: 130%; left: -15%; }
.together-path::before { top: 33%; }
.together-path::after { top: 66%; }
.together-path span { position: absolute; width: 8px; height: 8px; border: 1px solid rgba(255,255,255,.45); transform: rotate(45deg); }
.together-path span:nth-child(1) { left: 16%; top: 68%; }
.together-path span:nth-child(2) { left: 49%; top: 31%; }
.together-path span:nth-child(3) { right: 11%; top: 58%; }

.place-cafe { color: #37251f; background: #d7b58c; }
.place-cafe .place-copy { background: linear-gradient(145deg, #d9bd98, #c49a6c); }
.place-cafe .place-visual { background: linear-gradient(180deg, #563f3c, #2b242b); color: #f8e7cb; }
.cafe-window { position: absolute; inset: 12% 11%; display: grid; grid-template-columns: 1fr 1fr; border: 5px solid #2b2428; outline: 1px solid rgba(255,255,255,.2); background: radial-gradient(circle at 70% 25%, rgba(255,221,159,.9), transparent 16%), linear-gradient(165deg, #d1945d, #6d4e54 52%, #333246); box-shadow: inset 0 0 5rem rgba(255,201,125,.23), 0 2rem 5rem rgba(0,0,0,.3); }
.cafe-window::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 5px; background: #2b2428; }
.cafe-window i { border-bottom: 5px solid #2b2428; }
.cup { position: absolute; z-index: 4; left: 50%; bottom: 14%; width: 7rem; height: 4.2rem; transform: translateX(-50%); border-radius: .4rem .4rem 2rem 2rem; background: #ead8bd; box-shadow: 0 1rem 2rem rgba(0,0,0,.28); }
.cup::after { content: ''; position: absolute; right: -1.75rem; top: .55rem; width: 2.3rem; height: 2.3rem; border: .65rem solid #ead8bd; border-left: 0; border-radius: 0 50% 50% 0; }
.cup span { position: absolute; left: -3.5rem; right: -3.5rem; bottom: -.8rem; height: .65rem; border-radius: 50%; background: #b79d7c; }
.steam { position: absolute; z-index: 4; left: 50%; bottom: 22%; width: 8rem; height: 9rem; transform: translateX(-50%); }
.steam i { position: absolute; bottom: 0; width: 1px; height: 7rem; background: linear-gradient(transparent, rgba(255,255,255,.8), transparent); animation: steam 3s ease-in-out infinite; }
.steam i:nth-child(1) { left: 25%; }
.steam i:nth-child(2) { left: 50%; animation-delay: -.8s; }
.steam i:nth-child(3) { left: 75%; animation-delay: -1.6s; }

.place-valley { color: #eee9d9; background: #243b35; }
.place-valley .place-copy { background: linear-gradient(145deg, #385347, #203a34); }
.place-valley .place-visual { background: linear-gradient(180deg, #17273a 0%, #415b5a 55%, #182d29 100%); }
.valley-sky i { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #fff0bd; box-shadow: 0 0 12px #fff0bd; }
.valley-sky i:nth-child(1) { left: 23%; top: 18%; }
.valley-sky i:nth-child(2) { left: 61%; top: 11%; }
.valley-sky i:nth-child(3) { right: 18%; top: 28%; }
.hill { position: absolute; left: -20%; width: 140%; height: 58%; border-radius: 50% 50% 0 0; }
.hill-back { bottom: 8%; background: #36544d; transform: rotate(-6deg); }
.hill-front { bottom: -23%; background: #18332c; transform: rotate(5deg); box-shadow: 0 -1rem 5rem rgba(11,28,24,.3); }
.home { position: absolute; z-index: 3; left: 50%; bottom: 24%; width: 11rem; height: 8rem; transform: translateX(-50%); background: #d5b386; box-shadow: 0 0 4rem rgba(235,173,91,.18); }
.home::before { content: ''; position: absolute; left: -1.4rem; top: -4rem; width: 13.8rem; height: 7rem; background: #7f5648; clip-path: polygon(50% 0, 100% 65%, 86% 65%, 86% 100%, 14% 100%, 14% 65%, 0 65%); }
.home i { position: absolute; z-index: 1; left: 1.4rem; top: 2rem; width: 2.6rem; height: 2.8rem; background: #f4c878; box-shadow: 5rem 0 #f4c878, 0 0 2rem rgba(244,200,120,.5); }
.home span { position: absolute; z-index: 1; left: 4.35rem; bottom: 0; width: 2.3rem; height: 4rem; background: #725044; }
.garden { position: absolute; z-index: 4; left: 50%; bottom: 14%; width: 20rem; height: 3rem; transform: translateX(-50%); display: flex; justify-content: space-around; }
.garden i { width: .4rem; height: 2.5rem; border-radius: 50%; background: #c18c72; transform: rotate(12deg); box-shadow: -.7rem .5rem 0 -.08rem #d4b16b; }

.place-train { color: #ede8dc; background: #101729; }
.place-train .place-copy { background: linear-gradient(145deg, #17233b, #0d1426); }
.place-train .place-copy h2 { color: #e5d4b6; }
.place-train .place-visual { background: radial-gradient(circle at 68% 20%, rgba(226,184,107,.12), transparent 16%), linear-gradient(180deg, #0a1122 0%, #111b30 55%, #080d18 100%); }
.train-moon { position: absolute; top: 14%; right: 15%; width: 4.5rem; height: 4.5rem; border-radius: 50%; background: #d9c9aa; box-shadow: 0 0 3rem rgba(225,196,143,.2); opacity: .8; }
.train-moon::after { content: ''; position: absolute; inset: -.2rem .7rem .5rem -.4rem; border-radius: 50%; background: #0b1325; }
.train-rain { position: absolute; inset: 0; overflow: hidden; opacity: .38; }
.train-rain i { position: absolute; top: -20%; width: 1px; height: 9rem; background: linear-gradient(transparent, rgba(172,197,218,.9), transparent); transform: rotate(13deg); animation: nightRain 1.25s linear infinite; }
.train-rain i:nth-child(1) { left: 8%; animation-delay: -.2s; }
.train-rain i:nth-child(2) { left: 21%; animation-delay: -.8s; }
.train-rain i:nth-child(3) { left: 34%; animation-delay: -.4s; }
.train-rain i:nth-child(4) { left: 48%; animation-delay: -1s; }
.train-rain i:nth-child(5) { left: 61%; animation-delay: -.6s; }
.train-rain i:nth-child(6) { left: 74%; animation-delay: -.1s; }
.train-rain i:nth-child(7) { left: 86%; animation-delay: -.9s; }
.train-rain i:nth-child(8) { left: 95%; animation-delay: -.5s; }
.train-lamps { position: absolute; z-index: 2; top: 13%; left: 11%; right: 11%; display: flex; justify-content: space-between; }
.train-lamps::before { content: ''; position: absolute; left: 0; right: 0; top: -2.2rem; height: 1px; background: rgba(196,153,84,.3); }
.train-lamps i { position: relative; width: 1.05rem; height: 1.4rem; border: 1px solid #b1844c; background: #e1a852; box-shadow: 0 0 2.4rem .55rem rgba(224,156,64,.3); }
.train-lamps i::before { content: ''; position: absolute; left: 50%; bottom: 100%; width: 1px; height: 2.3rem; background: #8e704a; }
.train-body { position: absolute; z-index: 3; left: 6%; right: -4%; bottom: 22%; height: 13.5rem; border: 2px solid #8f683d; border-radius: 3.8rem .8rem .7rem .7rem; background: linear-gradient(180deg, #17233a, #0a1222 62%, #070d18); box-shadow: 0 1.5rem 3rem rgba(0,0,0,.55), inset 0 0 0 3px rgba(180,132,71,.08); }
.train-body::before { content: ''; position: absolute; left: 4%; right: 2%; top: 2.1rem; height: 1px; background: #795938; box-shadow: 0 6.6rem #795938, 0 8.6rem rgba(121,89,56,.5); }
.train-body::after { content: ''; position: absolute; left: 12%; right: 2%; top: -.7rem; height: .7rem; border-radius: 90% 30% 0 0; background: #0a1120; border-top: 1px solid #88643c; }
.train-windows { position: absolute; inset: 3.3rem 8% auto 8%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.15rem; }
.train-windows i { height: 4.8rem; border: 2px solid #9c7549; border-radius: .25rem .25rem .1rem .1rem; background: linear-gradient(135deg, rgba(255,226,165,.95), rgba(171,92,51,.66)); box-shadow: 0 0 1.6rem rgba(225,155,75,.22), inset 1.2rem 0 rgba(57,30,31,.25); }
.train-door { position: absolute; right: 3%; bottom: .6rem; width: 4.5rem; height: 10rem; border: 2px solid #8f683d; background: #111a2b; }
.train-door::before { content: ''; position: absolute; left: .65rem; right: .65rem; top: .75rem; height: 4rem; border: 1px solid #896540; background: rgba(225,163,84,.48); box-shadow: 0 0 1rem rgba(225,155,75,.18); }
.train-door::after { content: ''; position: absolute; left: .6rem; top: 6.1rem; width: .35rem; height: .35rem; border-radius: 50%; background: #d6ad69; box-shadow: 0 0 .7rem #d6ad69; }
.train-wheels { position: absolute; z-index: 2; left: 15%; right: 10%; bottom: 16%; display: flex; justify-content: space-between; }
.train-wheels i { width: 4.5rem; height: 4.5rem; border: .7rem solid #070b13; border-radius: 50%; background: #44372d; box-shadow: inset 0 0 0 2px #9a7040; }
.train-tracks { position: absolute; left: -10%; right: -10%; bottom: 12%; height: 2rem; transform: rotate(-1deg); }
.train-tracks i { position: absolute; left: 0; right: 0; height: 2px; background: #775f48; box-shadow: 0 .35rem rgba(255,255,255,.06); }
.train-tracks i:last-child { top: 1.2rem; }
.place-train .visual-note { color: #d5aa68; }

.finale { position: relative; min-height: 100svh; padding: 9rem 1.5rem 7rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow: hidden; background: radial-gradient(circle at 50% 42%, #2b2d4d 0, #171b32 32%, #0d1121 72%); }
.finale::before, .finale::after { content: ''; position: absolute; width: 38vw; height: 38vw; min-width: 20rem; min-height: 20rem; border: 1px solid rgba(221,167,93,.16); border-radius: 50%; }
.finale::before { transform: translate(-23%, -10%); }
.finale::after { transform: translate(23%, 10%); }
.finale .kicker { position: relative; z-index: 2; color: var(--amber); }
.finale h2 { position: relative; z-index: 2; margin: 0; font: 400 clamp(3.1rem, 7.7vw, 7.6rem)/.92 var(--serif); letter-spacing: -.055em; }
.finale h2 em { font-weight: 400; color: #c6979a; }
.signature { position: relative; z-index: 2; display: flex; align-items: center; gap: 1rem; margin-top: 4rem; font: 400 clamp(1.5rem, 3vw, 2.5rem) var(--serif); }
.signature i { color: var(--amber); }
.closing-line { position: relative; z-index: 2; margin: 1.2rem 0 0; color: rgba(255,255,255,.56); font: italic 1rem var(--serif); letter-spacing: .08em; }
.finale-light i { position: absolute; z-index: 1; width: 4px; height: 4px; border-radius: 50%; background: #ffe0a3; box-shadow: 0 0 22px 5px rgba(255,209,128,.4); animation: twinkle 3.5s ease-in-out infinite; }
.finale-light i:nth-child(1) { left: 17%; top: 25%; }
.finale-light i:nth-child(2) { right: 21%; top: 37%; animation-delay: -1.3s; }
.finale-light i:nth-child(3) { left: 58%; bottom: 18%; animation-delay: -2.1s; }

footer { min-height: 5.5rem; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; padding: 1.25rem clamp(1.25rem, 4vw, 4.5rem); color: rgba(255,255,255,.45); background: #0a0e1c; border-top: 1px solid rgba(255,255,255,.06); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; }
footer a { color: var(--amber); font: 1rem var(--serif); text-decoration: none; }
footer p { margin: 0; }
footer p:nth-of-type(1) { justify-self: center; }
footer p:nth-of-type(2) { justify-self: end; }

.reveal { opacity: 0; transform: translateY(1.8rem); transition: opacity .85s ease, transform .85s cubic-bezier(.22,.65,.28,1); }
.reveal.visible { opacity: 1; transform: none; }
.hero .reveal:nth-child(2) { transition-delay: .12s; }
.hero .reveal:nth-child(3) { transition-delay: .22s; }
.hero .reveal:nth-child(4) { transition-delay: .32s; }

@keyframes drift { from { transform: scale(1.03) translate3d(-.35%, -.2%, 0); } to { transform: scale(1.07) translate3d(.35%, .2%, 0); } }
@keyframes scrollLine { 0% { transform: translateY(0); } 65%, 100% { transform: translateY(360%); } }
@keyframes twinkle { 0%, 100% { opacity: .3; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.3); } }
@keyframes orbitFloat { from { transform: translateY(-.6rem) rotate(-5deg); } to { transform: translateY(.6rem) rotate(5deg); } }
@keyframes steam { 0% { opacity: 0; transform: translateY(1rem) rotate(-8deg); } 45% { opacity: .7; } 100% { opacity: 0; transform: translateY(-2.5rem) rotate(8deg); } }
@keyframes nightRain { from { transform: translate3d(0, -12rem, 0) rotate(13deg); } to { transform: translate3d(-3rem, 62rem, 0) rotate(13deg); } }

@media (max-width: 860px) {
  .site-header { height: 4.5rem; grid-template-columns: 1fr 1fr; }
  .site-header > p { display: none; }
  .hero h1 { flex-direction: column; gap: .2rem; font-size: clamp(4.7rem, 18vw, 7.5rem); }
  .hero h1 em { position: absolute; font-size: .4em; transform: translateY(.1em); }
  .hero-line { margin-top: 2rem; }
  .hero-note { display: none; }
  .prologue { min-height: auto; padding-top: 8rem; padding-bottom: 8rem; }
  .place, .place-reverse { min-height: auto; display: flex; flex-direction: column; }
  .place-visual, .place-reverse .place-visual { order: 1; min-height: min(85vw, 38rem); }
  .place-copy, .place-reverse .place-copy { order: 2; min-height: 36rem; padding-top: 5.5rem; padding-bottom: 5.5rem; }
  .place-copy h2 { font-size: clamp(3.8rem, 12vw, 6rem); }
  .photo { width: 10rem; height: 12.5rem; }
  .element-orbit { width: 15rem; height: 15rem; }
  footer { grid-template-columns: 1fr 1fr; }
  footer p:nth-of-type(1) { display: none; }
}

@media (max-width: 500px) {
  .site-header { padding-inline: 1.1rem; }
  .menu-label { display: none; }
  .hero-art { inset: 0; background-position: 38% center; animation: none; }
  .hero-content { padding: 6.5rem .75rem 8rem; }
  .eyebrow { font-size: .58rem; letter-spacing: .18em; }
  .hero h1 { font-size: clamp(4.15rem, 22vw, 6.2rem); }
  .hero-line { font-size: 1.05rem; }
  .hero-copy { max-width: 21rem; font-size: .88rem; line-height: 1.7; }
  .enter-link { bottom: 1.25rem; }
  .chapter-nav { padding: 5rem 1.4rem 2rem; }
  .chapter-nav a { min-width: 82vw; font-size: 1.8rem; }
  .prologue { padding-inline: 1.4rem; }
  .prologue h2 { font-size: 2.75rem; }
  .prologue > p:not(.kicker) { font-size: .93rem; }
  .place-visual { min-height: 27rem; }
  .place-copy { min-height: auto; padding: 4.8rem 1.55rem 5.4rem; }
  .place-copy h2 { font-size: 3.7rem; }
  .place-intro { font-size: 1.3rem; }
  .place-detail { font-size: .9rem; }
  .chapter-number { top: 1.4rem; left: 1.4rem; }
  .visual-note { right: 1.2rem; bottom: 1.5rem; }
  .photo-one { left: 5%; }
  .photo-two { right: 4%; }
  .element-orbit { width: 12rem; height: 12rem; }
  .orbit-fire { left: 6%; top: 16%; }
  .orbit-water { right: 5%; bottom: 14%; }
  .cafe-window { inset: 11% 7%; }
  .garden { width: 16rem; }
  .home { transform: translateX(-50%) scale(.82); }
  .train-body { left: 4%; right: -18%; bottom: 23%; height: 11.5rem; }
  .train-windows { inset: 2.8rem 18% auto 7%; gap: .7rem; }
  .train-windows i { height: 4rem; }
  .train-door { display: none; }
  .train-wheels { left: 13%; right: 2%; bottom: 15%; }
  .train-wheels i { width: 3.6rem; height: 3.6rem; }
  .train-lamps { left: 8%; right: 8%; }
  .finale { min-height: 46rem; }
  .finale h2 { font-size: 3.25rem; }
  .signature { margin-top: 3.2rem; }
  footer { min-height: 4.5rem; padding-inline: 1.1rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}
