/* Persistent controls and a quiet, repeating vertical scan. */
#page-fullscreen{position:fixed;left:20px;bottom:max(18px,env(safe-area-inset-bottom));z-index:95;display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 14px;border:1px solid #d4e7a070;border-radius:30px;background:#102e2af2;color:var(--paper);font-size:10px;box-shadow:0 3px 14px #0c24212b;backdrop-filter:blur(8px)}
#page-fullscreen:hover{background:var(--lime);color:var(--green)}
#page-fullscreen-status{position:fixed;left:20px;right:auto;bottom:80px;z-index:95;max-width:270px}
.return-top{left:auto;right:20px;bottom:max(18px,env(safe-area-inset-bottom));z-index:95}
body:has(.header.scrolled) #page-fullscreen{left:10px;width:44px;padding:10px;gap:0;justify-content:center}
body:has(.header.scrolled) #page-fullscreen .fullscreen-label{display:none}
body:has(.header.scrolled) .return-top{right:10px}
.floating-contact{bottom:82px;right:20px}
.hero-foot>span{margin-left:140px}
.hero .hero-scroll{bottom:24px;gap:9px;min-height:58px;min-width:64px}
.hero-scroll .scroll-track{position:relative;display:block;width:2px;height:36px;overflow:hidden;background:#f3f1e833;font-size:0}
.scroll-beam{position:absolute;left:0;top:0;display:block;width:2px;height:14px;background:var(--lime);box-shadow:0 0 7px #d4e7a099;animation:vertical-scan 1.9s cubic-bezier(.4,0,.25,1) infinite}
@keyframes vertical-scan{0%{transform:translateY(-16px);opacity:0}18%{opacity:1}75%{opacity:1}100%{transform:translateY(40px);opacity:0}}
.no-motion .scroll-beam{animation:none;transform:translateY(11px)}
@media(prefers-reduced-motion:reduce){.scroll-beam{animation:none;transform:translateY(11px)}}

/* The arch stays; the film keeps one large centred crop for every shot. */
.hero-window{transform:none}
.hero-window img,.hero-window video{object-fit:cover;object-position:49% center;transform:none;transform-origin:center}
.hero-atmosphere{display:none}
@media(min-width:1001px){.hero-window{width:45%;right:2.5%;top:17%;bottom:18%;border-radius:38% 38% 4px 4px}}

/* Bring the heading, photographs and their caption into the same view. */
.living-archive{padding-top:28px;margin-top:32px;scroll-margin-top:0}
.archive-heading h3{font-size:clamp(36px,3.5vw,46px);line-height:1.02}
.archive-heading .eyebrow{margin-bottom:12px}
.archive-heading p{font-size:13px;line-height:1.65}
.archive-heading .text-button{font-size:11px;padding-block:9px}
.archive-stage{margin-top:14px}
.archive-foot{margin-top:10px;padding-top:15px;gap:24px}
.archive-foot .eyebrow{font-size:9px}
#archive-description{font-size:12px;line-height:1.6}
@media(prefers-reduced-motion:no-preference){
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-stage{height:clamp(350px,calc(100svh - 330px),480px)}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-wheel{top:52%}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo{--photo-h:clamp(280px,calc(100svh - 370px),420px)}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-hint{top:0;bottom:auto;font-size:10px}
}
@media(max-width:760px){
 html{scroll-padding-top:76px}
 #page-fullscreen{left:14px;bottom:max(14px,env(safe-area-inset-bottom));font-size:9px;padding:9px 11px;gap:7px}
 #page-fullscreen-status{left:14px;bottom:76px}
 .return-top{left:auto;right:14px;bottom:max(14px,env(safe-area-inset-bottom))}
 .floating-contact{right:14px;bottom:78px}
 .hero .hero-scroll{bottom:15px;min-width:44px;min-height:48px;justify-content:center}
 .hero-scroll .scroll-track{height:34px}
 .living-archive{padding-top:22px;margin-top:26px}
 .archive-heading{gap:12px}
 .archive-heading h3{font-size:34px;line-height:1.02}
 .archive-heading .eyebrow{font-size:9px;margin-bottom:10px}
 .archive-heading p{font-size:13px;line-height:1.6}
 .archive-heading .text-button{min-height:40px;padding-block:8px}
 .archive-stage{margin-top:10px}
 .archive-foot{margin-top:8px;padding-top:10px}
 .archive-controls{gap:8px}
 .archive-controls button{min-height:40px}
 #archive-description{font-size:11px;line-height:1.6;margin-top:10px;min-height:35px}
 .archive-foot .eyebrow{display:none}
 body:has(.header.scrolled) #page-fullscreen{left:8px}
 body:has(.header.scrolled) .return-top{right:8px}
 #archive-description{padding-inline:36px}
}
@media(max-width:760px) and (prefers-reduced-motion:no-preference){
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-stage{height:clamp(270px,39svh,340px)}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo{--photo-w:clamp(170px,25svh,215px);--photo-h:clamp(210px,31svh,265px)}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo:nth-child(2),html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo:nth-child(3),html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo:nth-child(5){--photo-w:clamp(220px,32svh,270px);--photo-h:clamp(155px,23svh,190px)}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-wheel{top:52%}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-hint{top:0;bottom:auto;font-size:9px}
}

@media(max-width:760px) and (max-height:740px){
 .archive-heading{gap:8px}
 .archive-heading h3{font-size:31px}
 .archive-heading .eyebrow{margin-bottom:6px}
 .archive-foot{padding-top:8px}
 #archive-description{margin-top:8px}
}
@media(max-width:760px) and (max-height:740px) and (prefers-reduced-motion:no-preference){
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-stage{height:236px}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo{--photo-w:155px;--photo-h:190px}
 html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo:nth-child(2),html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo:nth-child(3),html:not(.no-motion) .living-archive[data-archive-motion="on"] .archive-photo:nth-child(5){--photo-w:210px;--photo-h:148px}
}
@media(max-width:360px) and (max-height:740px){
 .archive-controls{gap:6px}
 .archive-controls button{width:44px;min-width:44px;min-height:44px;padding:8px}
 #archive-pause{width:44px;min-width:44px;font-size:0}
 #archive-pause::after{content:'Ⅱ';font-size:16px;line-height:1}
 #archive-pause[aria-pressed="true"]::after{content:'▷'}
}

/* Slower, cleaner gathering transition: each card holds, copy fades out before the next arrives. */
.story-pinned .story-journey{height:calc(100svh - 76px + 260svh)}
.story-pinned .story-card:first-child .story-copy{opacity:var(--copy-a,1)}
.story-pinned .story-card:last-child .story-copy{opacity:var(--copy-b,0)}
.no-motion .story-card .story-copy{opacity:1!important}
@media(max-width:760px){.story-pinned .story-journey{height:calc(100svh - 68px + 220svh)}}
.film-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;margin:0;padding:12px 20px;border-radius:30px;background:#102e2ae6;color:var(--paper);font-size:12px;letter-spacing:.04em;pointer-events:none}
#film-dialog{position:fixed}#film-dialog .film-loading{top:45%}