html[data-motion="full"] .journey-book{height:1892svh}
.encounter-panel{position:relative;min-height:90svh;overflow:hidden;background:#0b110e}
html[data-motion="full"] .journey-stage>.encounter-panel{position:absolute;inset:0;min-height:0;height:100%;visibility:hidden;z-index:2}
html[data-motion="full"] .journey-stage>.encounter-panel.is-current{visibility:visible}
.encounter-plates{position:absolute;inset:0;overflow:hidden;background:#101a14 url('assets/scenes/grimshack-moonlit-forest-1920.jpg') 60% center/cover no-repeat}
.encounter-plates img[hidden]{display:none}
.encounter-plates img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center;transform-origin:var(--camera-origin,50% 50%);max-width:none;will-change:opacity,transform}
.encounter-plates img+img{opacity:0}
.encounter-copy{top:auto;bottom:12%;max-width:690px}
.flash-copy{z-index:31;left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);width:86%;max-width:780px;text-align:center;color:#211b12;pointer-events:none}
.flash-copy h2{font-size:clamp(42px,5.3vw,80px);color:#211b12;text-wrap:balance}
.flash-copy .eyebrow{color:#453421;margin-bottom:24px}
.flash-copy .scene-description{max-width:480px;margin:24px auto 0;color:#35291c;line-height:1.7}
.flash-reading{position:relative;padding:40px 7%;background:#f5d797;color:#211b12}
.flash-reading h2{font-size:32px;color:#211b12}
.flash-reading .eyebrow{color:#453421}.flash-reading .scene-description{color:#35291c}
.flash-reading p{max-width:520px;line-height:1.7;margin-top:18px}
.flash-copy[hidden],.flash-reading[hidden]{display:none}
@media(max-width:699px){.flash-copy h2{font-size:clamp(36px,9vw,52px)}.flash-copy .scene-description{max-width:330px;font-size:16px}}
@media(max-height:500px) and (orientation:landscape){.flash-copy h2{font-size:38px}.flash-copy .eyebrow{margin-bottom:12px}.flash-copy .scene-description{font-size:15px;margin-top:14px}}
.underwater-copy{z-index:31;top:auto;bottom:17%;max-width:650px;pointer-events:none;text-shadow:0 2px 24px #031316}
.underwater-copy h2{font-size:clamp(38px,4.5vw,68px);text-wrap:balance}
.underwater-copy .scene-description{max-width:520px;line-height:1.7}
.underwater-reading{position:relative;padding:30px 7% 45px;background:#102b2e;color:#e7ebe0}
.underwater-reading h2{font-size:32px}
.underwater-reading p{max-width:520px;line-height:1.7;margin-top:18px}
.underwater-copy[hidden],.underwater-reading[hidden]{display:none}
.shore-copy{z-index:31;top:auto;bottom:12%;width:43%;max-width:600px;pointer-events:none;text-shadow:0 2px 20px #08110be6}
.shore-copy::before{content:'';position:absolute;inset:-50px -80px;z-index:-1;background:radial-gradient(ellipse,#08110b94,transparent 72%);pointer-events:none}
.shore-copy h2{font-size:clamp(38px,4.5vw,68px);text-wrap:balance}
.shore-copy .scene-description{max-width:410px}
.shore-reading{position:relative;padding:30px 7% 45px;background:#17231a;color:#e7ebe0}
.shore-reading h2{font-size:32px}.shore-reading p{max-width:520px;line-height:1.7;margin-top:18px}
.shore-copy[hidden],.shore-reading[hidden]{display:none}
@media(max-width:699px){.shore-copy{top:auto;bottom:12%;width:86%}.shore-copy h2{font-size:clamp(32px,8.2vw,44px)}.shore-copy .scene-description{max-width:310px}}
@media(max-height:500px) and (orientation:landscape){.shore-copy{top:auto;bottom:10%;width:46%}.shore-copy h2{font-size:32px}.shore-copy .eyebrow{margin-bottom:14px}.shore-copy .scene-description{font-size:15px;margin-top:16px}}
.encounter-copy h2{font-size:clamp(40px,4.8vw,72px);text-wrap:balance;max-width:680px}
.encounter-panel>.scene-shade{background:linear-gradient(0deg,#050c0bdc,transparent 73%),linear-gradient(90deg,#030c0855,transparent 65%)}
.encounter-curtain{position:absolute;inset:0;z-index:30;pointer-events:none;visibility:hidden;overflow:hidden}
.curtain-backing{position:absolute;inset:0;opacity:var(--backing,0);background:#151613}
.encounter-curtain[data-kind="riverbank"] .curtain-backing{background:#102b2e}
.curtain-glow{display:none;position:absolute;left:calc(var(--glow-x,62%) - 140%);top:calc(var(--glow-y,30%) - 140%);width:280%;height:280%;background:radial-gradient(ellipse at center,#fff5ca 0%,#ffd183 20%,#dda24d90 42%,transparent 70%);opacity:var(--glow-opacity,0);transform:scale(var(--bloom-scale,.025));transform-origin:center}
.encounter-curtain[data-kind="lantern"] .curtain-backing{background:#f5d797}
.encounter-curtain[data-kind="lantern"] .curtain-glow{display:block}
.curtain-underwater,.curtain-riverbank,.curtain-shoulder{display:none}
.encounter-curtain[data-kind="riverbank"] .curtain-underwater{display:block;position:absolute;inset:0;z-index:2;background:#102b2e;opacity:var(--underwater,0);clip-path:url(#river-surface-cut)}
.curtain-underwater>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transform:translateY(var(--surface-y,0%)) scale(1.32);filter:url(#river-refraction)}
.river-effects{position:absolute;pointer-events:none}
.curtain-surface-water{display:none;position:absolute;inset:0;z-index:3;width:100%;height:100%;overflow:visible;opacity:calc(var(--surface-splash,0) * .78);transform:translateY(var(--waterline-y,-22%));filter:brightness(.88) saturate(.62)}
.encounter-curtain[data-kind="riverbank"] .curtain-surface-water{display:block}
.encounter-curtain[data-kind="riverbank"] .curtain-riverbank{display:block;position:absolute;top:0;left:0;width:100%;height:220%;max-width:none;object-fit:cover;object-position:50% 0;opacity:var(--shore-opacity,0);transform:translateY(var(--shore-y,-40%)) scale(var(--shore-scale,1));transform-origin:50% 0;filter:blur(var(--shore-blur,0px))}
.encounter-curtain[data-kind="shoulder"] .curtain-shoulder{display:block;position:absolute;inset:0;opacity:var(--shoulder-opacity,0)}
.shoulder-plane{position:absolute;inset:0}
.shoulder-cabin,.shoulder-figure{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.curtain-shoulder .scene-shade,.shack-beat .scene-shade{background:linear-gradient(90deg,#040a08ad,#040a0866 43%,transparent 75%)}
html[data-motion="full"] .journey-stage>.storybook{z-index:4;background:transparent;pointer-events:none}
html[data-motion="full"] .storybook .story-stage{background:transparent}
html[data-motion="full"] .aerial-beat{opacity:var(--aerial-visible,1)}
html[data-motion="full"] .journey-stage>.cabin-book{z-index:5}
html[data-motion="full"] .journey-stage>.contact{z-index:6}
html[data-motion="reduced"] .encounter-curtain{display:none}
html[data-motion="reduced"] .encounter-panel .story-copy{bottom:auto;padding-top:55svh;padding-bottom:10svh}
html[data-motion="reduced"] .encounter-panel{visibility:visible!important}
@media(max-width:699px){.encounter-copy{bottom:11%;width:86%}.encounter-copy h2{font-size:clamp(35px,7.8vw,50px)}.encounter-plates img{object-position:60% center}.encounter-copy .scene-description{margin-top:20px;max-width:300px}}
@media(max-width:699px) and (orientation:portrait){
 .encounter-curtain[data-kind="riverbank"] .curtain-riverbank{left:-82%;width:190%;height:148%;transform:translateY(var(--shore-mobile-y,-32%)) scale(var(--shore-mobile-scale,1));filter:blur(var(--shore-mobile-blur,0px))}
 .encounter-panel{background:radial-gradient(ellipse at 50% 26%,#27322d 0%,#0b1414 50%,#080e0b 85%)}
 /* Keep the same immersive scene in portrait; crop the art, not its viewport. */
 .encounter-plates{inset:0;height:100%;aspect-ratio:auto;mask-image:none}
 .encounter-plates img{object-fit:cover}
 .encounter-panel>.scene-shade{background:linear-gradient(0deg,#050c0bec,transparent 77%)}
 .encounter-copy{top:auto;bottom:12%;width:86%}
 .encounter-copy h2{font-size:clamp(32px,8.2vw,44px)}
 html[data-motion="reduced"] .encounter-panel .story-copy{padding-top:56svh}
}
/* Per-picture framing also applies to portrait tablets. A zoom stays centered
   on the selected crop instead of pulling the subject offscreen. */
@media(max-aspect-ratio:1/1){
 .encounter-plates img{object-position:var(--portrait-position,60% 50%);transform-origin:50% 50%}
}
@media(max-width:950px) and (max-height:500px) and (orientation:landscape){
 .encounter-copy{top:auto;bottom:12%;max-width:48%;width:48%}
 .encounter-copy h2{font-size:clamp(25px,4.4vw,36px)}
 .encounter-copy .eyebrow{font-size:9px;margin-bottom:12px}
 .encounter-copy .scene-description{font-size:13px;line-height:1.5;margin-top:14px;max-width:290px}
 .encounter-panel>.scene-shade{background:linear-gradient(90deg,#030b09bf,transparent 80%)}
}



/* The bank keeps its irregular leaf silhouette; no rectangular backing. */


.encounter-curtain[data-media='fallback'] .curtain-underwater,.encounter-curtain[data-media='fallback'] .curtain-riverbank,.encounter-curtain[data-media='fallback'] .curtain-shoulder,.encounter-curtain[data-media='fallback'] .curtain-surface-water{display:none}
.encounter-curtain[data-kind='riverbank'] .curtain-backing{background:#102b2e}






.curtain-surface-water>span{position:absolute;width:1.5625%;height:clamp(120px,18vw,240px);transform:translateY(-54%);overflow:hidden}
.curtain-surface-water img{position:absolute;top:0;width:6400%;height:100%;max-width:none;object-fit:fill}