.hero-media{position:absolute;inset:0;z-index:-3}
.hero .hero-image{animation:none;transform:none}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:1;pointer-events:none}
.hero-video-toggle{position:absolute;left:5%;bottom:42px;width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.6);border-radius:50%;color:white;background:rgba(8,38,55,.16);cursor:pointer;backdrop-filter:blur(6px)}
.hero-video-toggle[hidden]{display:none}
.hero-video-toggle:hover{background:rgba(8,38,55,.4)}
.hero-video-toggle:focus-visible{outline:2px solid white;outline-offset:4px}
.hero-video-toggle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hero-video-toggle .video-play-icon,.hero-video-toggle.is-paused .video-pause-icon{display:none}
.hero-video-toggle.is-paused .video-play-icon{display:block}
@media(max-width:600px){.hero-video{object-position:32% center}.hero-video-toggle{bottom:36px;left:20px;width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.hero-video,.hero-video-toggle{display:none}}

/* The full homepage hero headline stays white and semibold over the image and video. */
.hero #hero-title,.hero #hero-title em{color:#fff;font-weight:600}