:root{--ink:#34202c;--berry:#862e51;--paper:#fcf6f0}*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;color:var(--ink);background:var(--paper);font:17px/1.55 Arial,sans-serif}button,select{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--berry);outline-offset:5px}header{position:fixed;inset:0 0 auto;height:80px;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#fcf6f0ed;border-bottom:1px solid #34202c18;backdrop-filter:blur(12px)}.brand{font-weight:700;font-size:20px;letter-spacing:.16em}.brand small{display:block;font-size:10px;letter-spacing:.1em}.tools{display:flex;gap:12px;align-items:center}button,select{background:transparent;border:1px solid #34202c50;border-radius:24px;padding:10px 16px;min-height:44px}.tools button:hover{background:#862e5112}#journey{height:880vh}.stage{height:100svh;min-height:660px;position:sticky;top:0;overflow:hidden;background:radial-gradient(ellipse at 30% 40%,#e7b8c877,transparent 60%),#f9ede4}.intro-photo{position:absolute;inset:80px 0 0;overflow:hidden;z-index:15}.photo-canvas{position:absolute}.intro-photo img{width:100%;height:100%;position:absolute}.intro-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(#11253299,transparent 60%);pointer-events:none}.departure{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.copy{position:absolute;left:6vw;top:16vh;width:min(520px,38vw);z-index:16;pointer-events:none}.copy h1,.copy h2{font:400 clamp(40px,4.7vw,72px)/1.04 Georgia,serif;letter-spacing:-.045em;margin:16px 0 20px;text-wrap:balance}.copy p{max-width:440px;font-size:clamp(16px,1.25vw,19px);line-height:1.55}.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase}.copy[data-scene="0"]{color:#fff;text-shadow:0 2px 20px #14252c66;width:min(700px,68vw)}.copy[data-scene="0"] h1{font-size:clamp(48px,5.8vw,88px)}.copy:not([data-scene="0"]){opacity:0}.landscape{position:absolute;inset:0;opacity:0;pointer-events:none}.hills{position:absolute;bottom:20%;left:-20%;width:150%;height:38%;opacity:.45}.far-trees{position:absolute;bottom:24%;width:35vw;opacity:.32;filter:saturate(.5)}.road{position:absolute;left:0;right:0;bottom:13%;height:34px;border-top:1px solid #862e5133;border-bottom:1px solid #862e5122;background:linear-gradient(90deg,#f0dacc55,#dfcab866)}.road:after{content:'';position:absolute;left:-100%;right:-100%;top:16px;height:1px;background:repeating-linear-gradient(90deg,#862e5150 0 30px,transparent 30px 90px);transform:translateX(var(--road-shift,0px))}.encounter{position:absolute;width:43vw;bottom:23%;left:110vw;transform:translateX(-50%);z-index:5;padding:0;border:0;background:none;border-radius:0;visibility:hidden;will-change:left}.encounter img{display:block;width:100%;filter:drop-shadow(0 14px 18px #54263a14);transition:filter .2s}.encounter .tag{display:flex;gap:13px;align-items:center;justify-content:space-between;position:absolute;bottom:5%;left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--paper);color:var(--ink);border:1px solid #862e5150;border-radius:30px;padding:10px 12px 10px 20px;box-shadow:0 6px 20px #34202c10}.tag i{display:inline-grid;place-items:center;font:24px/1 Arial;background:var(--berry);color:white;border-radius:50%;width:30px;height:30px;transition:transform .2s}.encounter:hover .tag i{transform:rotate(90deg)}.encounter:hover img{filter:drop-shadow(0 18px 22px #54263a35)}.encounter[data-encounter="1"]{width:42vw;bottom:23%}.encounter[data-encounter="2"]{width:38vw;bottom:23%}.encounter[data-encounter="2"] .tag{bottom:0}.building{position:absolute;width:61vw;bottom:18%;left:110vw;z-index:3;filter:drop-shadow(0 15px 18px #45233912)}.vehicle{pointer-events:none;position:absolute;width:clamp(230px,31vw,500px);left:0;bottom:14%;z-index:9;opacity:0;will-change:transform;transform-origin:50% 90%}.real-vehicle{display:block;width:100%;transform:scaleX(-1);overflow:visible;filter:drop-shadow(0 6px 3px #34202c28)}.road-note{position:absolute;bottom:7%;left:6vw;z-index:18;font-size:12px;letter-spacing:.02em;background:#fcf6f0d9;padding:5px 10px;border-radius:20px}.controls{position:absolute;bottom:4%;right:5vw;z-index:18;display:flex;gap:6px}.controls button{display:flex;align-items:center;gap:8px;background:#fcf6f0ee;font-size:12px;padding:9px 13px}.controls b{font-size:10px;font-weight:400;opacity:.65}.controls button[aria-current="step"]{background:var(--berry);color:white;border-color:var(--berry)}.progress{position:absolute;bottom:0;left:0;height:3px;background:var(--berry);width:0;z-index:20}.outro{padding:90px 8vw 100px;max-width:1100px;margin:auto}.outro h2{font:400 clamp(34px,4vw,56px)/1.1 Georgia,serif;max-width:750px}.outro p{max-width:700px}.outro a{display:inline-block;padding:13px 22px;border-radius:30px;background:var(--berry);color:white;text-decoration:none;margin-top:15px}.prototype-note{font-size:12px;opacity:.75;margin-top:40px}dialog{border:1px solid #862e5120;border-radius:4px 32px 4px 32px;padding:32px;width:min(580px,90vw);max-height:85svh;overflow:auto;color:var(--ink);background:var(--paper);box-shadow:0 24px 100px #0004}dialog::backdrop{background:#25162288;backdrop-filter:blur(5px)}dialog h2{font:38px/1.1 Georgia,serif;margin:20px 0}dialog p{font-size:17px}dialog .close{float:right}dialog .eyebrow{padding-top:14px}body.modal-open{overflow:hidden}
@media(max-width:900px){.controls{right:4vw;gap:4px}.controls button{padding:9px 11px}.road-note{bottom:11%;left:5vw}.copy{width:42vw}.copy h2{font-size:clamp(36px,4.7vw,54px)}}
@media(max-width:650px){header{height:70px;padding:0 5vw}.brand{font-size:14px}.brand small{font-size:8px}.tools{gap:6px}.tools button,.tools select{padding:8px 10px;font-size:12px}.stage{min-height:680px}.intro-photo{inset:70px 0 0;background:#193543}.copy{left:7vw;top:13%;width:86vw!important}.copy h1,.copy h2,.copy[data-scene="0"] h1{font-size:clamp(34px,9vw,45px);margin:10px 0 12px}.copy p{font-size:15px;line-height:1.45;max-width:94%;margin-top:0}.eyebrow{font-size:9px}.vehicle{width:58vw;bottom:16%}.encounter,.encounter[data-encounter="1"],.encounter[data-encounter="2"]{width:62vw;bottom:31%}.encounter .tag{font-size:13px;padding:7px 8px 7px 13px;gap:8px;bottom:35%}.encounter[data-encounter="2"] .tag{bottom:35%}.tag i{width:26px;height:26px;font-size:22px}.building{width:108vw;bottom:32%}.far-trees{width:65vw;bottom:35%}.road{bottom:15%}.hills{bottom:28%}.controls{left:7vw;right:auto;bottom:4%;gap:8px}.controls button{width:43px;height:43px;min-height:43px;padding:0;justify-content:center}.controls b{font-size:12px;opacity:1}.step-label{display:none}.road-note{bottom:11%;left:7vw;font-size:11px}.outro{padding:60px 7vw}.outro h2{font-size:34px}dialog{padding:24px}dialog h2{font-size:32px}}
.static #journey{height:auto}.static .stage{position:relative;height:auto;min-height:0;padding-top:90px;overflow:visible;display:flex;flex-direction:column}.static .intro-photo{position:relative;inset:auto;height:auto;aspect-ratio:1824/1367;order:0;background:transparent}.static .photo-canvas{position:absolute;inset:0;width:100%!important;height:100%!important;left:0!important;top:0!important}.static .intro-photo:after{display:none}.static #departure-shift{transform:none!important}.static .copy{position:relative;top:auto;left:auto;width:auto!important;padding:24px 7vw;opacity:1!important;visibility:visible!important;color:var(--ink)!important;text-shadow:none;transform:none!important;order:1}.static .copy h1,.static .copy h2{font-size:clamp(34px,5vw,56px)}.static .copy[data-scene="1"]{order:3}.static .copy[data-scene="2"]{order:5}.static .copy[data-scene="3"]{order:7}.static .copy[data-scene="4"]{order:9}.static .vehicle{position:relative;left:auto;bottom:auto;width:min(480px,75%);opacity:1;margin:0 auto;order:2;transform:none!important}.static .encounter{position:relative;left:auto!important;bottom:auto!important;width:min(570px,86%)!important;margin:0 auto 40px;visibility:visible!important;opacity:1!important;transform:none!important;order:4}.static .encounter[data-encounter="1"]{order:6}.static .encounter[data-encounter="2"]{order:8}.static .building{position:relative;left:auto!important;bottom:auto;width:min(850px,90%);margin:auto;order:10;opacity:1!important}.static .landscape,.static .controls,.static .road-note,.static .progress{display:none}

/* Reuse the Home and Drive collage vocabulary. */
.sky-moon{position:absolute;top:11%;left:0;width:clamp(160px,23vw,330px);opacity:.58;filter:saturate(.65);will-change:transform}
.railway{position:absolute;left:0;right:0;bottom:44%;height:3px;border-top:1px solid #74576733;border-bottom:1px solid #74576718}
.distant-train{position:absolute;left:0;bottom:calc(44% + 3px);width:clamp(250px,39vw,640px);aspect-ratio:7/1;overflow:hidden;opacity:.73;will-change:transform}
.distant-train img{position:absolute;width:100%;height:auto;left:0;top:50%;transform:translateY(-51%);filter:saturate(.6) contrast(.9)}
.encounter .house-fish{position:absolute;width:75%;left:15%;top:-24%;filter:drop-shadow(0 10px 10px #71365016);animation:fish-drift 12s ease-in-out infinite;animation-play-state:paused}
.encounter[data-encounter="1"]{width:clamp(220px,25vw,360px);bottom:23%}
.encounter[data-encounter="1"] .tag{bottom:3%;z-index:3}
.idea-tree{position:relative;transform-origin:50% 99%;animation:tree-sway 10s ease-in-out infinite;animation-play-state:paused}
.tree-light{position:absolute;top:0;left:2%;width:41%;height:26%;background:radial-gradient(ellipse,#ffd8a166,transparent 70%);filter:blur(8px);animation:idea-glow 8s ease-in-out infinite;animation-play-state:paused}
.encounter[data-encounter="2"]{width:31vw;max-width:440px;bottom:22%}
.encounter .playing-child{width:89%;margin-left:11%;transform-origin:52% 85%;animation:child-bob 8s ease-in-out infinite;animation-play-state:paused}
.encounter .cloud-viewer{position:absolute;width:42%;left:-25%;top:2%;mix-blend-mode:multiply;filter:none;animation:cloud-drift 14s ease-in-out infinite;animation-play-state:paused}
body.scenery-active .house-fish,body.scenery-active .idea-tree,body.scenery-active .tree-light,body.scenery-active .playing-child,body.scenery-active .cloud-viewer{animation-play-state:running}
body.modal-open .encounter img,body.modal-open .tree-light,.encounter:hover img,.encounter:focus-visible img,.encounter:hover .tree-light,.encounter:focus-visible .tree-light{animation-play-state:paused}
@keyframes fish-drift{0%,100%{transform:translate(0,0) rotate(-2deg)}50%{transform:translate(18px,-9px) rotate(1deg)}}
@keyframes tree-sway{0%,100%{transform:rotate(-.4deg)}50%{transform:rotate(.6deg)}}
@keyframes idea-glow{0%,100%{opacity:.25}50%{opacity:.75}}
@keyframes child-bob{0%,100%{transform:translateY(0) rotate(-.3deg)}50%{transform:translateY(-6px) rotate(.4deg)}}
@keyframes cloud-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(max-width:900px){.encounter[data-encounter="1"]{width:27vw;min-width:190px}.encounter[data-encounter="2"]{width:36vw}}
@media(max-width:650px){.sky-moon{width:40vw;min-width:0;top:39%;opacity:.36}.railway{bottom:41%}.distant-train{bottom:calc(41% + 3px);width:64vw;min-width:0;opacity:.58}.encounter .house-fish{width:68%;left:22%;top:-20%}.encounter[data-encounter="1"]{width:36vw;min-width:0;bottom:31%}.encounter[data-encounter="1"] .tag{bottom:20%}.encounter[data-encounter="2"]{width:47vw;bottom:32%}.encounter[data-encounter="2"] .tag{bottom:13%}.encounter .cloud-viewer{width:37%;left:-20%;top:10%}.encounter .playing-child{width:94%;margin-left:6%}}
.static .encounter img,.static .tree-light{animation:none!important}.static .encounter[data-encounter="1"]{width:min(300px,52%)!important}.static .encounter[data-encounter="2"]{width:min(470px,65%)!important}.static .encounter .tag{bottom:0}.static .encounter[data-encounter="0"]{margin-top:40px}
@media(prefers-reduced-motion:reduce){.encounter img,.tree-light{animation:none!important}}

.encounter .tag{white-space:normal;line-height:1.25;width:max-content;max-width:340px;text-align:left}.tag i{flex-shrink:0}.encounter:hover .cloud-viewer{filter:none}.encounter[aria-hidden="true"] img,.encounter[aria-hidden="true"] .tree-light{animation-play-state:paused}
@media(max-width:650px){.encounter .tag{left:calc(50% - 14vw);max-width:78vw;min-width:185px}}
.static .encounter .tag{left:50%}

/* A continuous inhabited landscape, without additional interaction targets. */
.stage{--rail-y:55%}
.viaduct{position:absolute;top:var(--rail-y);left:-7%;width:114%;height:auto;opacity:.32;filter:saturate(.65)}
.distant-train{bottom:calc(100% - var(--rail-y) - 2px);aspect-ratio:1484/172;overflow:visible;opacity:.76}
.distant-train svg{display:block;width:100%;height:auto;filter:saturate(.65) contrast(.92)}
.poetry{position:absolute;inset:0;z-index:2;opacity:0;pointer-events:none}
.poetry-defs{position:absolute;overflow:hidden}
.poetry-item{position:absolute;left:0;bottom:var(--item-bottom);width:var(--item-w);opacity:var(--item-alpha);pointer-events:none;will-change:transform;visibility:hidden}
.poetry-item>svg,.poetry-item>img{display:block;width:100%;height:auto;user-select:none}
.mini-grove{filter:drop-shadow(0 8px 6px #862e510a)}
.grove-0,.grove-3{filter:saturate(.8);z-index:0}
.wind-bike{max-width:285px;filter:drop-shadow(0 8px 5px #34202c0c);z-index:1}
.bear-portrait{max-width:540px;aspect-ratio:1.8;z-index:2}
.bear-portrait .photographer{position:absolute;bottom:0;left:9%;width:20%;height:auto;transform-origin:50% 100%}
.bear-portrait .portrait-bear{position:absolute;bottom:0;right:0;width:47%;height:auto}
.walkers{max-width:170px;z-index:2}
.walkers svg{transform:translateY(var(--step-bob,0px))}
.copy:not([data-scene="0"]):before{content:'';position:absolute;inset:-24px -28px -30px -32px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 35% 45%,#f9ede4ed 15%,#f9ede4bc 57%,#f9ede400 76%);filter:blur(12px)}
@media(min-width:1600px){.viaduct{width:100%;left:0}}
@media(max-width:900px){.wind-bike{width:20vw}.bear-portrait{width:40vw}}
@media(max-width:650px){.stage{--rail-y:59%}.viaduct{width:160%;left:-30%;opacity:.28}.distant-train{bottom:calc(100% - var(--rail-y) - 2px);width:64vw;opacity:.65}.mini-grove{width:calc(var(--item-w) * 1.28);bottom:calc(var(--item-bottom) + 3%)}.wind-bike{width:24vw;bottom:31%}.bear-portrait{width:48vw;bottom:29%}.walkers-near{width:16vw;bottom:25%}.walkers-far{width:12vw;bottom:34%}.copy:not([data-scene="0"]):before{inset:-15px -20px -20px -20px;background:radial-gradient(ellipse,#f9ede4ed 25%,#f9ede4c9 60%,#f9ede400 77%)}.encounter[data-encounter="2"] .playing-child{margin-left:0;width:100%}}
.static .poetry{position:relative;inset:auto;width:min(1000px,90%);margin:30px auto 45px;display:grid;grid-template-columns:1fr 1.6fr .8fr;align-items:end;gap:25px;order:8;opacity:1!important}
.static .poetry-item{position:relative;left:auto;bottom:auto;width:100%;max-width:none;transform:none!important;visibility:visible!important;opacity:1}
.static .mini-grove,.static .walkers-far{display:none}.static .wind-bike{max-width:240px}.static .walkers svg{transform:none}.static .copy:before{display:none}
@media(max-width:650px){.static .poetry{gap:12px;grid-template-columns:1fr 1.7fr}.static .walkers-near{width:50%;grid-column:1/3;justify-self:center}}

/* Depth and ground contact adjusted after reviewing the user's screenshot. */
.stage{--rail-y:53%;--walk-far-y:76%;--walk-near-y:81%}
.viaduct{width:114%;left:-7%;opacity:.28}
.distant-train{width:clamp(170px,24vw,395px);opacity:.68}
.land-floor{position:absolute;bottom:0;left:0;width:100%;height:32%;opacity:.92}
.walking-path{position:absolute;left:0;right:0;height:9px;transform:translateY(-1px);background:#fff7ee66;border-bottom:1px solid #b28b8f33}
.walking-path-far{top:var(--walk-far-y);height:6px;opacity:.65}
.walking-path-near{top:var(--walk-near-y)}
.walkers-near{bottom:calc(100% - var(--walk-near-y));width:9vw;max-width:145px}
.walkers-far{bottom:calc(100% - var(--walk-far-y));width:7vw;max-width:114px}
.walkers svg{transform:none}
.walkers:after{content:'';position:absolute;bottom:-3px;left:3%;right:3%;height:6px;background:#604d4929;filter:blur(3px);border-radius:50%;z-index:-1}
.grove-0{bottom:26%}.grove-3{bottom:25%}
@media(max-width:650px){.stage{--rail-y:56%;--walk-far-y:74%;--walk-near-y:79%}.viaduct{width:190%;left:-45%;opacity:.25}.distant-train{width:46vw;min-width:0;opacity:.64}.land-floor{height:35%}.walkers-near{width:14vw;bottom:calc(100% - var(--walk-near-y))}.walkers-far{width:10vw;bottom:calc(100% - var(--walk-far-y))}.grove-0,.grove-3{bottom:26%}}
.static .walkers-near{width:100%;max-width:none;bottom:auto}.static .walkers:after{display:none}
@media(max-width:650px){.static .walkers-near{width:50%}}

/* Anchor the visible building and forecourt, rather than the transparent image canvas. */
.building{width:56vw;bottom:16%;height:auto;filter:drop-shadow(0 4px 5px #45233914)}
@media(max-width:650px){.building{width:84vw;bottom:19%}}
.static .building{width:min(850px,90%);bottom:auto;overflow:visible}

/* Align visible ground contact with the footpaths, excluding transparent padding. */
.encounter[data-encounter="0"]{bottom:calc(100% - var(--walk-near-y))}
.encounter .scene-house{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 2px #54263a12)}
.encounter[data-encounter="0"] .tag{bottom:12px}
.wind-bike{bottom:calc(100% - var(--walk-far-y));filter:drop-shadow(0 2px 2px #34202c12)}
.static .wind-bike{bottom:auto}

/* Keep the playful child in proportion to the other people along the route. */
.encounter[data-encounter="2"]{width:21vw;max-width:300px;bottom:20%}
.encounter .playing-child{margin-bottom:18px}
@media(max-width:650px){.encounter[data-encounter="2"]{width:32vw;bottom:27%}.encounter[data-encounter="2"] .tag{bottom:0}}
.static .encounter[data-encounter="2"]{width:min(300px,52%)!important}

/* One composition frame for images, text and travel, including panoramic windows. */
:root{--scene-width:min(100vw,177.7777778svh,1800px);--scene-unit:calc(var(--scene-width) / 100);--scene-left:calc((100vw - var(--scene-width)) / 2)}
.viaduct{width:calc(342 * var(--scene-unit));left:calc(50% - 171 * var(--scene-unit))}
@media(min-width:651px){
 .stage{min-height:0}
 header{padding-inline:calc(var(--scene-left) + 5 * var(--scene-unit))}
 .copy{left:calc(var(--scene-left) + 6 * var(--scene-unit));width:min(520px,calc(38 * var(--scene-unit)));top:max(96px,16svh)}
 .copy h1,.copy h2{font-size:clamp(36px,min(calc(4.7 * var(--scene-unit)),8.2svh),72px)}
 .copy p{font-size:clamp(16px,calc(1.25 * var(--scene-unit)),19px)}
 .copy[data-scene="0"]{width:min(700px,calc(68 * var(--scene-unit)))}
 .copy[data-scene="0"] h1{font-size:clamp(40px,min(calc(5.8 * var(--scene-unit)),10svh),88px)}
 .vehicle{width:clamp(230px,calc(31 * var(--scene-unit)),500px)}
 .building{width:calc(56 * var(--scene-unit))}
 .encounter[data-encounter="0"]{width:calc(43 * var(--scene-unit))}
 .encounter[data-encounter="1"]{width:clamp(190px,calc(25 * var(--scene-unit)),360px)}
 .encounter[data-encounter="2"]{width:calc(21 * var(--scene-unit))}
 .sky-moon{width:clamp(160px,calc(23 * var(--scene-unit)),330px)}
 .distant-train{width:clamp(170px,calc(24 * var(--scene-unit)),395px)}
 .wind-bike{width:calc(18 * var(--scene-unit))}
 .bear-portrait{width:calc(36 * var(--scene-unit))}
 .walkers-near{width:calc(9 * var(--scene-unit))}
 .walkers-far{width:calc(7 * var(--scene-unit))}
 .road-note{left:calc(var(--scene-left) + 6 * var(--scene-unit))}
 .controls{right:calc(var(--scene-left) + 5 * var(--scene-unit))}
}
@media(min-width:651px) and (max-width:900px){.copy{width:calc(42 * var(--scene-unit))}.wind-bike{width:calc(20 * var(--scene-unit))}.bear-portrait{width:calc(40 * var(--scene-unit))}}
@media(max-width:650px){:root{--scene-width:100vw}.viaduct{width:570vw;left:-235vw}}

/* Editorial reading area: compact clauses, readable body copy and a quiet backdrop. */
.copy{top:clamp(108px,13svh,148px);width:min(620px,calc(45 * var(--scene-unit)));color:var(--ink);text-shadow:none;pointer-events:auto}
.copy h1,.copy h2{font-size:clamp(32px,min(calc(3.2 * var(--scene-unit)),6.25svh),52px);line-height:1.1;letter-spacing:-.025em;margin:11px 0 16px;text-wrap:initial;overflow-wrap:normal;hyphens:none}
.copy .title-line{display:block}
.copy p{max-width:49ch;margin:0;font-size:clamp(18px,calc(1.3 * var(--scene-unit)),20px);line-height:1.5;text-wrap:pretty}
.copy .eyebrow{font-size:12px;line-height:1.45;letter-spacing:.12em;font-weight:600}
.copy::before,.copy:not([data-scene="0"])::before{content:'';position:absolute;inset:-16px -20px -18px;z-index:-1;pointer-events:none;background:#f9ede4;box-shadow:0 0 28px 18px #f9ede4;filter:blur(12px);opacity:.98}
.copy[data-scene="0"]{width:min(680px,calc(72 * var(--scene-unit)));color:#fff;text-shadow:0 1px 3px #10232c55}
.copy[data-scene="0"]::before{display:none}
.copy[data-scene="0"] h1{font-size:clamp(36px,min(calc(4.4 * var(--scene-unit)),7.2svh),66px)}
.copy[data-scene="0"] p{max-width:52ch}
.intro-photo::after{background:linear-gradient(180deg,#12252bed 0%,#12252bc2 42%,#12252b00 65%)}
.road-note{font-size:13px;line-height:1.4}
.controls button{font-size:13px}
@media(max-width:650px){
 .copy,.copy[data-scene="0"]{left:7vw;top:94px;width:86vw!important;color:var(--ink);text-shadow:none}
 .copy h1,.copy h2{font-size:clamp(26px,7.6vw,34px);line-height:1.12;margin:9px 0 12px}
 .copy[data-scene="0"] h1{font-size:clamp(30px,8vw,38px)}
 .copy p{max-width:none;font-size:16px;line-height:1.5}
 .copy .eyebrow{font-size:10px;letter-spacing:.1em;line-height:1.5}
 .copy::before,.copy:not([data-scene="0"])::before,.copy[data-scene="0"]::before{display:block;inset:-12px -12px -14px;background:#f9ede4;box-shadow:0 0 20px 12px #f9ede4;filter:blur(8px)}
 .intro-photo::after{background:none}
 .road-note{font-size:11px}
}
@media(min-width:651px) and (max-height:560px){
 .copy,.copy[data-scene="0"]{top:94px;width:calc(88 * var(--scene-unit));display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);column-gap:24px;align-items:start}
 .copy .eyebrow{grid-column:1 / -1;font-size:10px;margin-bottom:8px}
 .copy h1,.copy h2,.copy[data-scene="0"] h1{font-size:clamp(24px,calc(3.5 * var(--scene-unit)),32px);line-height:1.1;margin:0}
 .copy p{font-size:16px;line-height:1.45;max-width:none}
 .copy[data-scene="0"]{color:var(--ink);text-shadow:none}
 .copy[data-scene="0"]::before{display:block}
 .intro-photo::after{background:linear-gradient(#12252b33,transparent 55%)}
 .controls button{width:44px;padding:0;justify-content:center}.controls b{font-size:12px}.controls .step-label{display:none}
 .road-note{bottom:4%;font-size:11px;max-width:calc(88 * var(--scene-unit) - 260px)}
}
.static .copy,.static .copy[data-scene="0"]{display:block;left:auto;top:auto;width:auto!important;color:var(--ink);text-shadow:none;padding:28px 7vw}
.static .copy h1,.static .copy h2,.static .copy[data-scene="0"] h1{font-size:clamp(30px,4.5vw,52px);max-width:680px;margin:12px 0 16px}
.static .copy p{max-width:60ch;font-size:18px;line-height:1.55}
.static .copy::before,.static .copy:not([data-scene="0"])::before,.static .copy[data-scene="0"]::before{display:none}

/* WordPress integration: navigation and an accessible document fallback. */
.brand{color:inherit;text-decoration:none;flex-shrink:0}.brand:hover{color:var(--berry)}
.skip-link{position:fixed;top:8px;left:8px;z-index:100;transform:translateY(-150%);background:var(--ink);color:white;padding:12px 20px;border-radius:24px}.skip-link:focus{transform:none}
.hub-menu-links{display:grid;gap:0;margin:24px 0}.hub-menu-links a{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid #34202c25;font-size:20px;color:var(--ink);text-decoration:none}.hub-menu-links a::after{content:'↗';color:var(--berry)}
#site-menu{width:min(640px,92vw)}#site-menu .menu-close{float:right}.menu-home{color:var(--ink)}
.outro{max-width:1300px;scroll-margin-top:90px}.outro h2{max-width:900px}.outro-actions{display:flex;gap:12px;flex-wrap:wrap}.outro .secondary-link{background:transparent;border:1px solid #862e51;color:var(--berry)}
.explore-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:36px;margin:45px 0 20px}.outro .explore-links a{display:flex;justify-content:space-between;gap:16px;align-items:center;border-radius:0;background:none;color:var(--ink);border-bottom:1px solid #34202c40;padding:22px 0;margin:0;text-decoration:none;font-size:19px}.explore-links a::after{content:'↗';color:var(--berry)}
.outro .explore-links a:hover,.hub-menu-links a:hover{color:var(--berry)}
.site-footer{padding:25px 8vw 35px;border-top:1px solid #34202c25;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:14px}.site-footer nav{display:flex;gap:22px;flex-wrap:wrap}.site-footer a{color:var(--ink)}.image-credit{font-size:13px!important;color:#65545c;margin-top:35px;max-width:85ch!important}
#detail-links{display:flex;gap:10px;flex-wrap:wrap;padding-top:15px}#detail-links a{padding:10px 15px;border:1px solid #862e5166;border-radius:25px;color:var(--berry);text-decoration:none;font-size:16px}
button.encounter:focus-visible{outline-offset:7px}body:not(.motion-ready) #motion,body:not(.motion-ready) #menu-open{display:none}body:not(.motion-ready) .encounter{pointer-events:none}
@media(max-width:700px){.explore-links{grid-template-columns:1fr 1fr;gap:0 22px}.outro .explore-links a{font-size:16px}.outro-actions{display:block}.outro-actions a{display:block;width:fit-content}.site-footer{padding:24px 7vw}.tools #motion{width:40px;padding:8px;font-size:0}.tools #motion::before{content:'Ⅱ';font-size:17px}.tools #motion[aria-pressed="true"]::before{content:'▷'}.tools{gap:5px}#menu-open{padding:8px 10px;font-size:12px}.brand small{font-size:7px}}
@media(max-width:380px){header{padding-inline:4vw}.brand{font-size:12px}.brand small{font-size:6px}.tools #language{padding-inline:5px}.tools{gap:3px}}
@media(max-height:560px) and (min-width:651px){.stage{min-height:100svh}}
@media(min-width:651px){body:not(.static) .encounter[data-encounter="2"] .tag{left:calc(50% + 60px)}}
@media(max-width:650px){.intro-photo{background:#f9ede4}.copy[data-scene="0"]::before{box-shadow:none;filter:none;inset:-16px -7vw;background:#f9ede4}.vehicle{max-width:calc(100vw - 20px)}}
body:not(.motion-ready) #language{display:none}body:not(.motion-ready) .encounter .tag{display:none}

/* Two flowering trees announce the next street without masking its encounters. */
.street-cherry--medium{z-index:1}
.street-cherry--large{z-index:0}
.real-vehicle.new-karbike-profile{transform:none}
@media(max-width:650px){.street-cherry--medium{width:42vw;bottom:32%}.street-cherry--large{width:54vw;bottom:38%}}
.static .street-cherry{width:100%;bottom:auto;max-width:380px}