/* ==========================================================================
   Carrusel de la intranet (clasico y v2): muestra cada imagen completa, sin
   recortar, sea cual sea su proporcion (pieza grafica 16:9, foto 4:3,
   cuadrada o vertical). El espacio sobrante se rellena con la misma imagen
   desenfocada, en lugar de franjas negras.
   ========================================================================== */

.carrusel-escena {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: clamp(220px, 40vw, 520px);
    background: #0f1b2d;
}

/* Copia desenfocada de la imagen para el fondo. */
.carrusel-fondo {
    position: absolute;
    inset: -24px;
    background-position: center;
    background-size: cover;
    filter: blur(22px) brightness(.62) saturate(1.1);
    transform: scale(1.08);
}

/* La imagen real: completa y centrada. */
.swiper .carrusel-escena .carrusel-img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
    object-position: center;
}

/* El texto del banner queda sobre la imagen. */
.carrusel-escena + .swiper-slide-content,
.swiper-slide .swiper-slide-content {
    z-index: 2;
}

/* El carrusel clasico tenia max-height: 470px; la escena define el alto. */
.swiper_horizontal {
    max-height: none;
}

@media (max-width: 767.98px) {
    .carrusel-escena {
        height: clamp(200px, 62vw, 340px);
    }

    /* En pantallas tactiles se desliza con el dedo; las flechas tapaban el
       contenido de la imagen. */
    .swiper_horizontal .swiper-button-prev,
    .swiper_horizontal .swiper-button-next {
        display: none;
    }
}
