.hero{isolation:isolate}
.hero-landscape{z-index:0}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;z-index:1}
.hero-shade{z-index:2;pointer-events:none}
.hero .hero-content,.hero-caption{z-index:3}
@media(max-width:700px){.hero-video{object-position:65% center}}

/* Keep the video visible before playback: its poster covers loading, and mobile
   WebKit must see the media element to start muted inline autoplay. */
.cinematic-home .hero-video{opacity:1}

.hero-video-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:1;opacity:1;visibility:visible}
.hero-video.is-ready + .hero-video-fallback{opacity:0;visibility:hidden}
@media(max-width:700px){.hero-video-fallback{object-position:57% center}}