/* =====================================================================================
   Fondo del muro de recuerdos (26/10/2026)
   Imagen a todo el ancho detras de la cabecera del listado de obituarios de la funeraria.
   Arriba se ve la imagen; en su 20% inferior se funde a blanco para unirse con el listado.
   Lo pinta themes/muro/js/fondo-muro.js (rota las imagenes con un fundido). Vale para los
   tres estilos de listado (clasico, legacy y 2026) y para humanos y mascotas.
   ===================================================================================== */
.mr-fondo-muro {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  /* Altura completa de la imagen (16:9): no se recorta por arriba ni por abajo */
  height: 56.25vw;
  min-height: 200px;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
  /* color final del degradado: el JS lo iguala al fondo real del muro (blanco en 2026, gris en el clasico) */
  background: var(--mr-fondo-fin, #fff);
}
.mr-fondo-muro__capa {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  opacity: 0;
  transition: opacity 1.8s ease;
  will-change: opacity;
}
.mr-fondo-muro__capa.mr-on {
  opacity: 1;
}
/* Velo para aclarar la foto (preferencia "brillo", 0-90 %): encima de las capas, debajo del degradado */
.mr-fondo-muro::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background: var(--mr-fondo-fin, #fff);
  opacity: calc(var(--mr-fondo-brillo, 0%) / 100%);
}
/* Degradado al color del fondo en la parte inferior (preferencia "degradado", 10-100 %; por defecto 20 %) */
.mr-fondo-muro::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  height: var(--mr-fondo-deg, 20%);
  background: linear-gradient(to bottom, transparent 0%, var(--mr-fondo-fin, #fff) 100%);
}

/* El contenido va por encima del fondo y los bloques de cabecera dejan de taparlo */
body.mr-con-fondo #wrapper {
  position: relative;
}
/* El listado 2026 pinta #muros en blanco: con fondo pasa a transparente (el body ya es blanco) */
body.mr-con-fondo #muros.tmb-muro-2026,
body.mr-con-fondo #partner,
body.mr-con-fondo #partner-info,
body.mr-con-fondo .breadcrumb,
body.mr-con-fondo #section-footer-top,
body.mr-con-fondo .tmb-muro-2026-container,
body.mr-con-fondo .tmb-muro-2026-header {
  position: relative;
  z-index: 1;
  background-color: transparent;
}
body.mr-con-fondo #partner.partner-top {
  border-top: 0;
}
/* El logo, en una capa superior y con un halo blanco suave para que se lea sobre la foto */
body.mr-con-fondo #partner img,
body.mr-con-fondo .tmb-muro-2026-logo img {
  position: relative;
  z-index: 2;
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.9)) drop-shadow(0 0 18px rgba(255, 255, 255, 0.8));
}

@media (max-width: 767px) {
  .mr-fondo-muro {
    height: 56.25vw;
    min-height: 160px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mr-fondo-muro__capa {
    transition: none;
  }
}
/* global_2026.css fija el blanco de #muros con mas especificidad: aqui manda el fondo */
body.mr-con-fondo.tmb-muro-2026-page #muros.tmb-muro-2026 {
  background: transparent !important;
}