.film-showcase{background:#fff;padding:54px 0 0}.film-showcase-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:0 4% 28px;color:#f76200}.film-showcase-heading p{font-size:11px;margin:0 0 14px}.film-showcase-heading h2{font-size:clamp(26px,3.3vw,48px);font-weight:600;line-height:1.5;margin:0}.film-showcase-heading>span{font-size:11px;white-space:nowrap;padding-bottom:9px}.film-showcase-screen{width:100%;aspect-ratio:16/7;max-height:780px;background:#fff3eb;overflow:hidden}.film-showcase-video{display:block;width:100%;height:100%;object-fit:cover}@media(max-width:600px){.film-showcase{padding-top:32px}.film-showcase-heading{padding:0 5% 22px;align-items:flex-start;flex-direction:column;gap:14px}.film-showcase-heading>span{padding:0}.film-showcase-screen{aspect-ratio:4/3}.film-showcase-video{object-fit:contain;background:#fff3eb}}

/* A stable scroll runway lets the centered film expand without moving later sections. */
.film-scroll-runway{height:calc(180svh - var(--film-header,80px))}
.film-scroll-stage{position:sticky;top:var(--film-header,80px);height:calc(100svh - var(--film-header,80px));display:flex;align-items:center;justify-content:center}
.film-scroll-stage .film-showcase-screen{width:var(--film-width,450px);max-width:calc(100% - 40px);max-height:100%;flex-shrink:0}
@media(prefers-reduced-motion:reduce){.film-scroll-runway{height:auto}.film-scroll-stage{position:static;height:auto}.film-scroll-stage .film-showcase-screen{width:100%}}

.film-showcase-heading{flex-direction:column;align-items:center;justify-content:center;text-align:center}

/* Keep the heading close to the expanding film rather than above its scroll stage. */
.film-scroll-stage>.film-showcase-heading{position:absolute;left:0;right:0;bottom:calc(50% + var(--film-screen-height,197px)/2 + 24px);padding:0 4%;gap:20px}
.film-scroll-stage>.film-showcase-heading>span{padding-bottom:0}
@media(max-width:600px){.film-scroll-stage>.film-showcase-heading{gap:14px;padding-inline:5%}}
@media(prefers-reduced-motion:reduce){.film-scroll-stage{flex-direction:column;gap:24px}.film-scroll-stage>.film-showcase-heading{position:static;padding-bottom:0}}

/* Let the service panel slide over the expanded film. */
.film-service-stack{position:relative;isolation:isolate}
.film-service-stack>.film-showcase{position:sticky;top:var(--film-cover-top,0);z-index:0}
.film-service-stack>.service-deck{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.film-service-stack>.film-showcase{position:relative;top:auto}}