/* VR Immo – Hero-Video: Ladeanimation statt aufblitzendem Fallback-Bild.
   Greift nur mit html.vr-hero-js (im <head> gesetzt); html.vr-hero-timeout (nach 9 s) stellt das Elementor-Standardverhalten wieder her, falls hero-video.js nicht läuft. */

html.vr-hero-js:not(.vr-hero-timeout) .elementor-540 .elementor-element.elementor-element-bebd0e9:not(.vr-hero-fallback) {
  background-image: none !important;
  background-color: #002D67 !important;
}

html.vr-hero-js:not(.vr-hero-timeout) .elementor-element-bebd0e9 video.elementor-background-video-hosted {
  opacity: 0;
  transition: opacity .7s ease;
}

html.vr-hero-js:not(.vr-hero-timeout) .elementor-element-bebd0e9.vr-hero-ready video.elementor-background-video-hosted {
  opacity: 1;
}

html.vr-hero-js:not(.vr-hero-timeout) .elementor-element-bebd0e9:not(.vr-hero-ready):not(.vr-hero-fallback) .elementor-background-video-container::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, .12) 50%, transparent 65%),
    linear-gradient(90deg, transparent, #E46713, transparent);
  background-repeat: no-repeat;
  background-size: 250% 100%, 30% 3px;
  background-position: 150% 0, -40% 0;
  animation: vrHeroLoading 1.6s ease-in-out infinite;
}

@keyframes vrHeroLoading {
  to { background-position: -50% 0, 140% 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.vr-hero-js:not(.vr-hero-timeout) .elementor-element-bebd0e9:not(.vr-hero-ready):not(.vr-hero-fallback) .elementor-background-video-container::after {
    animation: none;
    background-size: 0 0, 100% 3px;
    background-position: 0 0, 0 0;
  }
  html.vr-hero-js:not(.vr-hero-timeout) .elementor-element-bebd0e9 video.elementor-background-video-hosted {
    transition: none;
  }
}