/* FunnyDivers - looping background video for the sub page heroes.
   The start page keeps its own .hero-video rule; this covers
   .hero (courses, daily diving, prices) and .sub-hero (dive sites),
   all of which already establish a positioned, clipped box. */

.fd-herovid{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 50%;
  z-index:0;
  pointer-events:none;
  border:0;
  background:#011820;
  backface-visibility:hidden;
}

/* Dims the raw video the same way the start page's .hero-overlay does, so
   the hero stays a consistent dark backdrop instead of drifting toward
   whatever the clip's current frame looks like (it goes quite blue once it
   pans off the poster's close-up). Without this, the accent-colored
   headline word and CTA button read as if their own color had shifted. */
.fd-herovid-veil{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:radial-gradient(ellipse 65% 60% at 50% 42%,rgba(2,16,22,.38) 0%,rgba(1,12,18,.68) 62%,rgba(0,8,13,.87) 100%);
}

/* Lift the existing content above video and veil without touching markup. */
.hero > .wrap,
.sub-hero > .wrap{position:relative;z-index:2;}

.hero > .wave-bot,
.sub-hero > .wave-bot{z-index:3;}

.fd-footervid{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 50%;
  z-index:0;
  pointer-events:none;
  border:0;
  will-change:transform;
  backface-visibility:hidden;
}

.fd-footervid-veil{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:rgba(0,0,0,.4);
}

footer{position:relative;overflow:hidden;isolation:isolate;}
footer > .wrap{position:relative;z-index:2;}

/* The footer video moved into the dark band right above it (the footer itself
   is now a flat color) - these bands need the same positioned/clipped box the
   footer used to provide. */
.cta-band,
#kontakt{position:relative;overflow:hidden;isolation:isolate;}
.cta-band > .wrap,
#kontakt > .wrap{position:relative;z-index:2;}

@media (prefers-reduced-motion: reduce){
  /* fall back to the poster frame - no looping motion */
  .fd-herovid,
  .fd-footervid{display:none;}
}