/* =========================================================
   MODELO HERO
========================================================= */

.modelo-hero {
    position        : relative;
    width           : 100%;
    background-color: #000000;
    overflow        : hidden;
}

.modelo-hero__swiper {
    width     : 100%;
    height    : calc(100vh - 70px);
    min-height: 650px;
}

.modelo-hero__slide {
    position: relative;
    width   : 100%;
    height  : 100%;
    overflow: hidden;
}

/* IMAGEN */

.modelo-hero__image {
    position: absolute;
    inset   : 0;
    display : block;
    width   : 100%;
    height  : 100%;
}

.modelo-hero__image img {
    display        : block;
    width          : 100%;
    height         : 100%;
    object-fit     : cover;
    object-position: center;
}

/* CONTENIDO */

.modelo-hero__content {
    position: absolute;
    left    : 5%;
    bottom  : 8%;
    z-index : 3;
    width   : min(90%, 650px);
}

/* TITULO */

.modelo-hero__title {
    margin     : 0;
    color      : #ffffff;
    font-size  : clamp(2.5rem, 5vw, 5rem);
    font-weight: 700;
    line-height: 1;
}

/* SUBTITULO */

.modelo-hero__subtitle {
    margin     : 1rem 0 0;
    max-width  : 550px;
    color      : rgba(255, 255, 255, 0.9);
    font-size  : clamp(1rem, 1.5vw, 1.25rem);
    font-weight: 300;
    line-height: 1.5;
}

/* CARACTERISTICAS */

.modelo-hero__features {
    display       : flex;
    margin-top    : 2rem;
    /* border-top : 1px solid rgba(255, 255, 255, 0.5); */
    /* border-left: 1px solid rgba(255, 255, 255, 0.5); */
}

.modelo-hero__feature {
    min-width       : 140px;
    padding         : 1rem 1.5rem;
    /* border-right : 1px solid rgba(255, 255, 255, 0.5); */
    /* border-bottom: 1px solid rgba(255, 255, 255, 0.5); */
}

.modelo-hero__feature-value {
    display    : block;
    color      : #ffffff;
    font-size  : 1.5rem;
    font-weight: 500;
    line-height: 1.2;
}

.modelo-hero__feature-label {
    display    : block;
    margin-top : 0.35rem;
    color      : rgba(255, 255, 255, 0.75);
    font-size  : 0.8rem;
    font-weight: 300;
    line-height: 1.3;
}

/* PAGINACION */

.modelo-hero__pagination {
    position : absolute;
    left     : 50% !important;
    bottom   : 25px !important;
    z-index  : 10;
    display  : flex;
    width    : min(300px, 70%) !important;
    gap      : 4px;
    transform: translateX(-50%);
}

.modelo-hero__pagination .swiper-pagination-bullet {
    flex            : 1;
    width           : auto;
    height          : 2px;
    margin          : 0 !important;
    border-radius   : 0;
    background-color: rgba(255, 255, 255, 0.45);
    opacity         : 1;
}

.modelo-hero__pagination .swiper-pagination-bullet-active {
    height          : 3px;
    background-color: #1ef1c6;
}




/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 768px) {

    .modelo-hero__swiper {
        height    : calc(100vh - 70px);
        min-height: 560px;
    }

    .modelo-hero__image img {
        object-position: center;
    }

    .modelo-hero__content {
        left  : 6%;
        bottom: 8%;
        width : 88%;
    }

    .modelo-hero__title {
        font-size: clamp(2.2rem, 10vw, 3.5rem);
    }

    .modelo-hero__subtitle {
        margin-top : 0.75rem;
        font-size  : 1rem;
        line-height: 1.4;
    }

    .modelo-hero__features {
        margin-top: 1.5rem;
        width     : 100%;
        overflow-x: auto;
    }

    .modelo-hero__feature {
        min-width: 110px;
        padding  : 0.8rem 1rem;
    }

    .modelo-hero__feature-value {
        font-size: 1.2rem;
    }

    .modelo-hero__feature-label {
        font-size: 0.75rem;
    }

    .modelo-hero__pagination {
        bottom: 20px !important;
        width : 80% !important;
    }

}