/* ==========================================================
   HERO RESPONSIVE: IMAGEN COMPLETA Y FONDO SIN ESPACIOS
   ========================================================== */

.home-page .hero-section {
    position: relative;
    width: 100%;
    height: clamp(520px, 46vw, 760px);
    min-height: 520px;
    overflow: hidden;
    padding: 0 !important;
    background: #0b1f3a;
}

.home-page .hero-slider-bg,
.home-page .hero-slide {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.home-page .hero-slider-bg {
    overflow: hidden;
}

.home-page .hero-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0b1f3a;
    opacity: 0;
    overflow: hidden;
    transform: scale(1);
    transition:
        opacity 0.65s ease-in-out,
        transform 4s ease-out !important;
}

.home-page .hero-slide.active {
    opacity: 1;
    transform: scale(1.015);
}

/*
 * Copia difuminada de la imagen.
 * Llena completamente el fondo del hero.
 */
.home-page .hero-slide-blur {
    position: absolute;
    inset: -30px;
    z-index: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(24px);
    transform: scale(1.08);
    opacity: 0.75;
}

/*
 * Imagen principal.
 * Se muestra completa sin deformarse ni recortarse.
 */
.home-page .hero-slide-image {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    object-position: center center;
    user-select: none;
    pointer-events: none;
    transition: transform 4s ease-out;
}

.home-page .hero-slide.active .hero-slide-image {
    transform: scale(1.01);
}

/* Reduce ligeramente la oscuridad anterior del hero. */
.home-page .hero-section::after {
    background: linear-gradient(
        180deg,
        rgba(11, 31, 58, 0.12) 0%,
        rgba(11, 31, 58, 0.18) 50%,
        rgba(11, 31, 58, 0.34) 100%
    ) !important;
}

/* Computadores grandes */
@media (min-width: 1400px) {
    .home-page .hero-section {
        height: clamp(600px, 42vw, 800px);
        min-height: 600px;
    }

    .home-page .hero-slide-image {
        object-fit: contain;
    }
}

/* Portátiles y computadores normales */
@media (min-width: 993px) and (max-width: 1399px) {
    .home-page .hero-section {
        height: clamp(520px, 46vw, 680px);
        min-height: 520px;
    }

    .home-page .hero-slide-image {
        object-fit: contain;
    }
}

/* Tablet */
@media (min-width: 769px) and (max-width: 992px) {
    .home-page .hero-section {
        height: clamp(470px, 64vw, 620px);
        min-height: 470px;
    }

    .home-page .hero-slide-image {
        object-fit: contain;
    }
}

/* Móvil: conserva el comportamiento que ya funcionaba */
@media (max-width: 768px) {
    .home-page .hero-section {
        height: clamp(420px, 118vw, 640px) !important;
        min-height: clamp(420px, 118vw, 640px) !important;
        padding-bottom: 0 !important;
    }

    .home-page .hero-slide-blur {
        display: none;
    }

    .home-page .hero-slide-image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
    }

    .home-page .hero-slide.active {
        transform: scale(1.01);
    }
}

/* Móviles pequeños */
@media (max-width: 480px) {
    .home-page .hero-section {
        height: 520px !important;
        min-height: 520px !important;
    }
}
