/**
 * Responsive Background Video – Elementor overrides
 *
 * Paired with responsive-bg-video.js.
 * Apply the class .responsive-bg-video to any Elementor section/container
 * that uses a hosted background video with mobile/desktop variants.
 */

/* Container setup */
.responsive-bg-video {
  position: relative;
  overflow: hidden;
  background: #000;
}

/* Force hosted video to cover the container */
.responsive-bg-video .elementor-background-video-container video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: none !important;
}

/* Hidden until JS confirms the correct source is loaded */
.responsive-bg-video .elementor-background-video-container {
  opacity: 0;
  transition: opacity 0.5s ease;
}
.responsive-bg-video.video-loaded .elementor-background-video-container {
  opacity: 1;
}

/* Hide browser-extension video speed controllers */
vsc-controller {
  display: none !important;
}