/* ch-fotos-verticales · Colombia House · OC-20261031-19 / OC-19b / OC-20261101-26
   Fotos verticales en celdas horizontales: la foto se ve completa (contain)
   sobre un fondo difuminado de ella misma, en lugar de recortarse.
   Lo activa js/ch-fotos-verticales.20261102.js (clases .ch-vert / .ch-vert-pos + variable --ch-foto).
   Las fotos horizontales no cambian: sin la clase, ninguna regla aplica.
   OC-26: archivo con NOMBRE NUEVO (antes 20261101) para que ningún navegador siga usando
   la copia de 7 días en caché de la versión previa a OC-19b, que dejaba el fondo difuminado
   suelto sobre todo el «Recorrido en fotos» (barras de desplazamiento y fotos tapadas).
   Sin isolation ni z-index en las tarjetas: la caja NO crea contexto de apilamiento, así el
   enlace que cubre la tarjeta (.t-link) y los botones con z-index (Guardar, Comparar)
   conservan su orden de siempre. */
.ch-vert {
  overflow: hidden !important;   /* OC-19b: .chf .pista button {all:unset} lo quitaba */
  background-color: #1e293b;     /* slate-800 mientras carga el fondo */
}
.ch-vert-pos { position: relative !important; } /* Solo si era static (lo decide el JS) */

/* OC-26 · Blindaje de las celdas de la ficha (mosaico, galería móvil y recorrido).
   Esos botones solo contienen la foto, así que se puede usar contención de pintura:
   la celda pasa a ser SIEMPRE el bloque contenedor del fondo y lo recorta, aunque otra
   regla (p. ej. {all:unset}) le quite position u overflow. Más específico que
   .chf .tour button (0,2,1) y con !important. No se aplica a las tarjetas del listado,
   porque allí crearía un contexto de apilamiento que taparía Guardar y Comparar. */
.chf .tour button.ch-vert,
.chf .pista button.ch-vert,
.chf .mosaico button.ch-vert {
  position: relative !important;
  overflow: hidden !important;
  contain: paint !important;
}
/* Sin desbordamiento lateral en el recorrido, pase lo que pase con una celda. */
.chf #hoja-tour .hoja-cuerpo { overflow-x: hidden; }

.ch-vert::before {
  content: "";
  position: absolute;
  top: -40px; right: -40px; bottom: -40px; left: -40px; /* margen fijo > difuminado: bordes sin halo */
  background-image: var(--ch-foto);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  filter: blur(20px) saturate(1.1) brightness(0.8);
  pointer-events: none;
}
/* Miniaturas pequeñas: menos difuminado, menos costo de pintura */
.tour .ch-vert::before { filter: blur(10px) saturate(1.1) brightness(0.8); }

.ch-vert > img {
  position: relative;          /* encima del fondo; sin z-index para no alterar el orden */
  object-fit: contain !important;
  background: transparent !important;
}

@media (prefers-reduced-transparency: reduce) {
  .ch-vert::before { filter: none; opacity: 0.25; }
}
@media (forced-colors: active) {
  .ch-vert::before { display: none; }
}
/* El visor ampliado (.visor-pista) ya usa contain sobre fondo neutro: no se toca. */
