/* =============================================================
   VÍDEO DE FONDO GLOBAL — B&W fijo durante el scroll
   Capricho del Mar by Z
============================================================= */

/* Fondo de html por si el vídeo no carga aún */
html {
  background: var(--c-deep-2);
}

/* Body transparente para que el vídeo fijo sea visible */
body {
  background: transparent;
}

/* ── VÍDEO FIJO CON RECORRIDO PARALLAX ──────────────────────── */
/*
   El vídeo empieza 25vh por encima del viewport y mide 140vh.
   El JS lo mueve hacia abajo hasta 25vh conforme se scrollea,
   de modo que siempre cubre el viewport sin dejar huecos.
*/
/* Contenedor fijo con recorrido parallax */
.bg-video {
  position: fixed;
  top: -25vh; left: 0;
  width: 100%; height: 140vh;
  z-index: 0;
  filter: grayscale(100%) contrast(1.06);
  will-change: transform;
  pointer-events: none;
}
/* Las dos capas de vídeo que se cruzan */
.bgv {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  max-width: none;
  opacity: 0;
  transition: opacity 1s linear;
}
.bgv.is-front { opacity: 1; }

/* ── STACKING — todo el contenido por encima del vídeo ───────── */
/* .nav, .nav-mobile y .loader se excluyen: ya tienen position:fixed con z-index alto */
.lightbox,
section,
footer,
.carta-bridge {
  position: relative;
  z-index: 1;
}

/* ── SECCIONES CLARAS — fondo translúcido para que el vídeo respire ── */
#filosofia {
  background: rgba(250, 250, 248, 0.91);
}
/* Sección azul — alterna con Filosofía (blanco) */
#experiencia {
  background: rgba(28, 58, 80, 0.92) !important;
}
/* #galeria usa su propio fondo oscuro en .gallery-pin (gallery.css) */

/* ── SECCIONES OSCURAS — semi-transparentes, el vídeo se cuela ─ */
/* Carta Bridge */
.carta-bridge {
  background: rgba(13, 32, 53, 0.72) !important;
}

/* Bridge en versión clara — alterna con las secciones azules */
.carta-bridge--light {
  background: rgba(250, 250, 248, 0.93) !important;
  border-top: 1px solid var(--c-border);
}

/* Sección de reservas */
#reservas {
  background: rgba(28, 58, 80, 0.78) !important;
}

/* Footer */
footer {
  background: rgba(13, 32, 53, 0.86) !important;
}

/* Banda de localidad — ligerísima transparencia */
.band-data {
  background: rgba(13, 32, 53, 0.90) !important;
}


/* ── ACCESIBILIDAD ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .bg-video { display: none; }
  /* Restituir fondos sólidos si el vídeo no se muestra */
  #filosofia     { background: var(--c-white)    !important; }
  #experiencia   { background: var(--c-white)    !important; }
  #galeria .gallery-pin { background: var(--c-deep-2) !important; }
  .carta-bridge  { background: var(--c-deep-2) !important; }
  .carta-bridge--light { background: var(--c-white) !important; }
  #reservas      { background: var(--c-deep)   !important; }
  footer         { background: var(--c-deep-2) !important; }
  .band-data     { background: var(--c-deep-2) !important; }
  body           { background: var(--c-white); }
  html           { background: var(--c-white); }
}