.hero-visual { filter: none; }
.hero::after { content: none; }
.hero-video { opacity: 0; pointer-events: none; transition: opacity 300ms ease; }
.hero-video.is-visible { opacity: 1; }
.hero-motion-toggle { position: absolute; z-index: 2; right: 40px; bottom: 42px; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; color: #fff; border: 1px solid #ffffffa6; border-radius: 50%; background: #14281dcc; cursor: pointer; transition: background 160ms; }
.hero-motion-toggle[hidden] { display: none; }
.hero-motion-toggle:hover { background: #14281d; }
.hero-motion-toggle:focus-visible { outline-color: #fff; }
.hero-motion-toggle .icon { width: 20px; height: 20px; }
.video-play-icon { display: none; }
.hero-motion-toggle.is-paused .video-play-icon { display: block; }
.hero-motion-toggle.is-paused .video-pause-icon { display: none; }

@media (max-width: 760px) {
  .hero-visual { object-position: center; transform: none; }
  .hero-motion-toggle { right: 22px; bottom: 38px; width: 44px; height: 44px; }
}

@media (max-width: 380px) {
  .hero-motion-toggle { right: 18px; }
}

@media (max-width: 760px) and (max-height: 700px) {
  .hero-motion-toggle { bottom: 32px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-video, .hero-motion-toggle { display: none !important; }
}