/* Imágenes y vídeo de fondo (2026-10-12). Se carga solo en las páginas que usan medios.
   El vídeo de la portada solo se descarga en pantallas anchas, sin "reducir movimiento"
   y sin ahorro de datos (ver el script al final de index.html). Créditos: /creditos-imagenes.html */

/* --- Fondo de la cabecera de la portada --- */
.hero-media{
  position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none;
  background:#0f1a14 url("media/brigadistas-incendio-poster.webp") center/cover no-repeat;
}
.hero-media video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1.4s ease;
}
.hero-media video.on{ opacity:.85; }
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(15,26,20,.62) 0%, rgba(15,26,20,.82) 100%);
}
.hero-credit{
  position:absolute; right:14px; bottom:8px; z-index:2;
  max-width:60ch; text-align:right; font-size:.7rem; line-height:1.3; color:#b9bcab;
}
.hero-credit a{ color:inherit; }

/* --- Imagen destacada en páginas de análisis --- */
.media-banner{ margin:6px 0 22px; }
.media-banner img{
  display:block; width:100%; height:auto; max-height:340px; object-fit:cover;
  border-radius:8px; border:1px solid var(--line);
}
.media-banner figcaption{ font-size:.78rem; color:#6b6d5f; margin-top:6px; line-height:1.4; }
.media-banner figcaption a{ color:inherit; }

@media (max-width:800px){
  .media-banner img{ max-height:210px; }
  .hero-credit{ position:static; text-align:left; padding:0 16px 8px; }
}
@media (prefers-reduced-motion: reduce){
  .hero-media video{ display:none; }
}