/* A single cinematic opening, with the existing Synergy palette and navigation. */
.cinema-hero{display:block;margin:0;border-radius:0;overflow:visible;min-height:0;background:transparent}
.hero-stage{position:relative;display:grid;min-height:calc(100svh - 92px);isolation:isolate;overflow:hidden;background:var(--forest);clip-path:inset(12px 22px 12px round 22px)}
.hero-stage>.hero-intro,.hero-stage>.hero-window{grid-area:1/1}
.cinema-hero .hero-window{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.hero-film{position:absolute;inset:0;transform:scale(var(--film-scale,1));transform-origin:55% 50%}
.hero-film img,.hero-film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.gym-film{opacity:0;transition:opacity .7s ease}.hero-film.is-ready .gym-film{opacity:1}
.cinema-hero .hero-window::after{background:linear-gradient(90deg,rgba(10,18,12,.76),rgba(10,18,12,.3) 55%,rgba(10,18,12,.08)),linear-gradient(0deg,rgba(10,18,12,.5),transparent 38%)}
.cinema-hero .hero-intro{padding:88px max(7vw,36px) 145px;align-self:center;transform:translateY(var(--copy-y,0px));width:100%}
.cinema-hero h1{font-size:clamp(64px,7.7vw,116px);line-height:.98;letter-spacing:-.055em;font-weight:500;max-width:800px}
.cinema-hero p{font-size:clamp(17px,1.5vw,21px);margin:28px 0 32px;line-height:1.5}
.cinema-hero .window-caption{left:max(7vw,36px);right:max(7vw,36px);bottom:32px;padding:0 0 22px;border-bottom:1px solid #ffffff45;background:none;z-index:2}
.cinema-hero .window-caption span{font-size:14px;letter-spacing:0}
.cinema-hero .motion-toggle{top:36px;right:40px;background:rgba(15,23,18,.75);color:#fff;border:1px solid #ffffff60;backdrop-filter:blur(16px);font-size:14px;min-width:135px}
.cinema-hero .motion-toggle:focus-visible{outline-color:#fff}
.cinema-hero .hero-intro:focus-within{transform:none}
@media(min-width:761px) and (prefers-reduced-motion:no-preference){.cinema-hero.is-enhanced{height:150svh}.is-enhanced .hero-stage{position:sticky;top:92px;height:calc(100svh - 92px);min-height:570px}}
@media(max-width:760px){.hero-stage{min-height:max(660px,calc(100svh - 78px));clip-path:inset(8px 8px round 16px)}.cinema-hero .hero-intro{padding:120px 30px 135px;align-self:end;transform:none}.cinema-hero h1{font-size:clamp(54px,12.5vw,84px);max-width:550px}.cinema-hero p{max-width:290px;margin:22px 0 28px}.cinema-hero .hero-window::after{background:linear-gradient(0deg,rgba(10,18,12,.91),rgba(10,18,12,.4) 60%,rgba(10,18,12,.08))}.hero-film img,.hero-film video{object-position:58% center}.cinema-hero .window-caption{left:30px;right:30px;bottom:20px;gap:18px}.cinema-hero .window-caption span{font-size:12px}.cinema-hero .motion-toggle{right:24px;top:24px}.hero-film{transform:none}}
@media(prefers-reduced-motion:reduce){.hero-stage{clip-path:inset(8px 8px round 16px)}.hero-film,.cinema-hero .hero-intro{transform:none}.gym-film{display:none}.cinema-hero .motion-toggle{display:none}}
/* Scroll scrubbing replaces playback: one continuous, reversible eight-second move. */
.cinema-hero.is-scrubbing{height:250svh}
.is-scrubbing .hero-stage{position:sticky;top:var(--hero-nav,92px);height:calc(100svh - var(--hero-nav,92px));min-height:560px}
.hero-film{transform:none!important}
.scroll-film-hint{display:none;position:absolute;right:40px;top:38px;z-index:5;color:white;font-size:14px;gap:12px;align-items:center}
.is-scrubbing .scroll-film-hint{display:flex}
.scroll-film-line{height:2px;width:54px;background:#ffffff50;position:relative;overflow:hidden}
.scroll-film-line::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(var(--scroll-progress,0));transform-origin:left}
@media(max-width:760px){.cinema-hero.is-scrubbing{height:235svh}.is-scrubbing .hero-stage{min-height:600px}.scroll-film-hint{top:30px;right:28px;font-size:13px}.cinema-hero .window-caption span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.cinema-hero.is-scrubbing{height:auto}.is-scrubbing .hero-stage{position:relative;top:0;height:auto}.scroll-film-hint{display:none!important}}
/* Keep the phone compositing path simple while the video itself supplies the zoom. */
@media(max-width:760px){.is-scrubbing .hero-stage{clip-path:none;border-radius:14px;margin-inline:8px;overflow:hidden}.cinema-hero .hero-window{will-change:auto}.cinema-hero .hero-intro{transform:none}.scroll-film-line{display:none}}

/* One stable photo texture for touch scrolling, including Safari. */
@media(max-width:760px){
 .gym-film{display:none}
 .is-scrubbing .film-poster{will-change:transform;transform:translate3d(0,0,0);transform-origin:58% 50%;transition:none}
}
@media(prefers-reduced-motion:reduce){.film-poster{will-change:auto;transform:none!important}}

/* The browser owns mobile zoom timing; no JS scroll handler on this path. */
@keyframes gym-native-zoom{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(0,0,0) scale(1.22)}}
@media(max-width:760px) and (prefers-reduced-motion:no-preference){
 .native-zoom.is-scrubbing{view-timeline-name:--gym-zoom;view-timeline-axis:block;view-timeline-inset:var(--hero-nav,78px) 0}
 .native-zoom.is-scrubbing .film-poster{animation:gym-native-zoom linear both;animation-timeline:--gym-zoom;animation-range:contain 0% contain 100%}
}
