/* Mobile hero v8 (2026-09-24), after mobile-hero-v7. Portrait phones only.
   The film fills the space between the header and the copy (cover, panned by --mobile-film-x)
   and the copy sits directly under it, so there is no empty band under the button. */
@media(max-width:800px) and (orientation:portrait){
body{--hero-top:calc(49px + env(safe-area-inset-top));--hero-copy:350px;--film-h:max(200px,calc(100svh - var(--hero-top) - var(--hero-copy)))}
body .hero-frame-sequence,body .film-stage video,body:not(.static-film) .film-stage video{top:var(--hero-top)!important;height:var(--film-h)!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:var(--mobile-film-x,30%) center!important}
body .film-mobile-intro,body .film-ending{top:calc(var(--hero-top) + var(--film-h) + 24px)!important;bottom:auto!important}
body .film-tools{bottom:14px!important}
body.static-film .film-stage{background-size:auto var(--film-h)!important;background-position:30% var(--hero-top)!important}
}
@media(max-width:800px) and (orientation:portrait) and (max-height:700px){
body{--hero-copy:300px;--film-h:max(180px,calc(100svh - var(--hero-top) - var(--hero-copy)))}
body .film-mobile-intro .overline,body .film-ending .eyebrow{display:none!important}
body .film-mobile-intro h2,body .film-ending h2{font-size:28px!important}
body .film-mobile-intro>p:not(.overline),body .film-ending>p{margin:10px 0 14px!important}
}
