.elementor-96 .elementor-element.elementor-element-7893fbf{--display:flex;--min-height:0px;}.elementor-96 .elementor-element.elementor-element-5469b14 .elementor-repeater-item-a8da1c2 .swiper-slide-bg{background-color:#833ca3;background-image:url(https://iberiat.portales.eas.org.pe/wp-content/uploads/2026/09/escolta.jpg);background-size:cover;}.elementor-96 .elementor-element.elementor-element-5469b14 .elementor-repeater-item-a8da1c2 .swiper-slide-contents{margin-right:auto;}.elementor-96 .elementor-element.elementor-element-5469b14 .elementor-repeater-item-a8da1c2 .swiper-slide-inner{align-items:center;}.elementor-96 .elementor-element.elementor-element-5469b14 .swiper-slide{transition-duration:calc(5000ms*1.2);height:535px;}.elementor-96 .elementor-element.elementor-element-5469b14 .swiper-slide-contents{max-width:66%;}.elementor-96 .elementor-element.elementor-element-5469b14 .swiper-slide-inner{text-align:center;}.elementor-96 .elementor-element.elementor-element-5469b14 .elementor-slide-heading{font-family:"Arial", Sans-serif;}.elementor-96 .elementor-element.elementor-element-c282b7c{--display:flex;}.elementor-96 .elementor-element.elementor-element-9e75799{--display:flex;}.elementor-96 .elementor-element.elementor-element-38dfab7{--display:flex;}@media(min-width:768px){.elementor-96 .elementor-element.elementor-element-7893fbf{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-7893fbf *//* ============================================================
   SLIDER INSTITUCIONAL
   IESTP SANGARARÁ
   Clase del widget: sg-slider-pro
============================================================ */

.sg-slider-pro{
    --sg-blue:#0A6EB4;
    --sg-blue-dark:#005299;
    --sg-blue-light:#004A8F;

    --sg-blue-claro:#1A8FE3;
    --sg-blue-oscuro:#002C4F;

    --sg-white:#FFFFFF;

    width:100% !important;

    position:relative;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;
}


/* ============================================================
   CONTENEDOR GENERAL
============================================================ */

.sg-slider-pro .elementor-widget-container{
    position:relative;

    overflow:hidden;

    border-radius:28px !important;

    background:
        linear-gradient(
            135deg,
            rgb(0 45 85 / 95%),
            rgb(0 32 60 / 98%)
        );

    box-shadow:
        0 25px 60px
        rgba(0,45,85,.16);
}


/* ============================================================
   SLIDER / SWIPER
============================================================ */

.sg-slider-pro .swiper,
.sg-slider-pro .swiper-container{
    position:relative;

    overflow:hidden !important;

    border-radius:28px !important;
}


/* ============================================================
   CADA SLIDE
============================================================ */

.sg-slider-pro .swiper-slide{
    position:relative !important;

    overflow:hidden !important;

    min-height:620px;

    background:
        linear-gradient(
            135deg,
            rgb(0 45 85 / 95%),
            rgb(0 32 60 / 98%)
        ) !important;
}


/* ============================================================
   IMAGEN DE FONDO
============================================================ */

.sg-slider-pro .swiper-slide-bg{
    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    background-position:center center !important;

    background-size:cover !important;

    transform:scale(1.04);

    transition:
        transform 6s ease !important;
}


.sg-slider-pro
.swiper-slide-active
.swiper-slide-bg{
    transform:scale(1);
}


/* ============================================================
   OVERLAY OSCURO
============================================================ */

.sg-slider-pro .swiper-slide::before{
    content:"";

    position:absolute;

    inset:0;

    z-index:1;

    pointer-events:none;

    background:
        linear-gradient(
            90deg,
            rgb(0 20 40 / 91%) 0%,
            rgb(0 32 60 / 82%) 34%,
            rgb(0 45 85 / 55%) 62%,
            rgb(0 45 85 / 18%) 100%
        );
}


/* BRILLO AZUL */

.sg-slider-pro .swiper-slide::after{
    content:"";

    position:absolute;

    z-index:1;

    width:600px;
    height:600px;

    top:-280px;
    right:-170px;

    border-radius:50%;

    pointer-events:none;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.15) 0%,
            rgba(26,143,227,.10) 42%,
            transparent 70%
        );
}


/* ============================================================
   CONTENIDO DEL SLIDE
============================================================ */

.sg-slider-pro .swiper-slide-inner{
    position:relative !important;

    z-index:3 !important;

    display:flex !important;

    align-items:center !important;

    justify-content:flex-start !important;

    min-height:620px !important;

    padding:
        70px 9% !important;

    text-align:left !important;
}


/* CONTENEDOR DEL TEXTO */

.sg-slider-pro .swiper-slide-contents{
    width:100% !important;

    max-width:720px !important;

    margin:0 !important;

    text-align:left !important;
}


/* ============================================================
   PEQUEÑO DETALLE SUPERIOR
============================================================ */

.sg-slider-pro
.swiper-slide-contents::before{
    content:"IESTP SANGARARÁ";

    display:inline-flex;

    align-items:center;

    margin-bottom:20px;

    padding:9px 15px;

    color:#5BB8F5;

    background:
        rgba(255,255,255,.08);

    border:
        1px solid rgba(255,255,255,.15);

    border-radius:999px;

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

    font-size:10px;

    font-weight:850;

    letter-spacing:1.2px;

    text-transform:uppercase;
}


/* ============================================================
   TÍTULO
============================================================ */

.sg-slider-pro
.elementor-slide-heading{
    max-width:700px !important;

    margin:
        0 0 18px !important;

    padding:0 !important;

    color:#FFFFFF !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size:
        clamp(40px,5vw,65px) !important;

    font-weight:900 !important;

    line-height:1.03 !important;

    letter-spacing:-1.5px !important;

    text-shadow:
        0 4px 20px
        rgba(0,0,0,.20);
}


/* ============================================================
   LÍNEA AZUL
============================================================ */

.sg-slider-pro
.elementor-slide-heading::after{
    content:"";

    display:block;

    width:90px;
    height:6px;

    margin-top:18px;

    border-radius:999px;

    background:
        linear-gradient(
            90deg,
            #1A8FE3,
            #0A6EB4,
            #005299
        );

    box-shadow:
        0 5px 14px
        rgba(0,45,85,.25);
}


/* ============================================================
   DESCRIPCIÓN
============================================================ */

.sg-slider-pro
.elementor-slide-description{
    max-width:640px !important;

    margin:
        0 0 28px !important;

    color:
        rgba(255,255,255,.91) !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size:16px !important;

    font-weight:400 !important;

    line-height:1.8 !important;
}


/* ============================================================
   BOTÓN
============================================================ */

.sg-slider-pro
.elementor-slide-button{
    display:inline-flex !important;

    align-items:center !important;

    justify-content:center !important;

    min-height:52px !important;

    padding:
        0 25px !important;

    color:#FFFFFF !important;

    background:
        linear-gradient(
            135deg,
            #1A8FE3 0%,
            #0A6EB4 40%,
            #005299 100%
        ) !important;

    border:
        0 !important;

    border-radius:13px !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size:13px !important;

    font-weight:850 !important;

    text-decoration:none !important;

    text-transform:none !important;

    box-shadow:
        0 13px 28px
        rgba(0,45,85,.28) !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease !important;
}


.sg-slider-pro
.elementor-slide-button:hover{
    color:#FFFFFF !important;

    transform:
        translateY(-4px);

    box-shadow:
        0 18px 35px
        rgba(0,45,85,.38) !important;
}


/* FLECHA PEQUEÑA EN BOTÓN */

.sg-slider-pro
.elementor-slide-button::after{
    content:"→";

    margin-left:9px;

    font-size:17px;

    line-height:1;
}


/* ============================================================
   FLECHAS DEL SLIDER
============================================================ */

.sg-slider-pro
.elementor-swiper-button,
.sg-slider-pro
.swiper-button-prev,
.sg-slider-pro
.swiper-button-next{
    width:52px !important;
    height:52px !important;

    display:flex !important;

    align-items:center !important;

    justify-content:center !important;

    color:#FFFFFF !important;

    background:
        rgba(255,255,255,.10) !important;

    border:
        1px solid rgba(255,255,255,.18) !important;

    border-radius:50% !important;

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease !important;
}


.sg-slider-pro
.elementor-swiper-button:hover,
.sg-slider-pro
.swiper-button-prev:hover,
.sg-slider-pro
.swiper-button-next:hover{
    color:#FFFFFF !important;

    background:
        linear-gradient(
            135deg,
            #1A8FE3,
            #0A6EB4
        ) !important;

    transform:
        scale(1.08);
}


/* TAMAÑO DEL ICONO */

.sg-slider-pro
.elementor-swiper-button svg{
    width:20px !important;
    height:20px !important;

    fill:currentColor !important;
}


/* POSICIÓN */

.sg-slider-pro
.elementor-swiper-button-prev{
    left:23px !important;
}


.sg-slider-pro
.elementor-swiper-button-next{
    right:23px !important;
}


/* ============================================================
   PAGINACIÓN
============================================================ */

.sg-slider-pro
.swiper-pagination{
    position:absolute !important;

    left:50% !important;

    bottom:23px !important;

    width:auto !important;

    display:flex;

    align-items:center;

    gap:8px;

    padding:
        9px 13px;

    background:
        rgba(255,255,255,.10);

    border:
        1px solid rgba(255,255,255,.14);

    border-radius:999px;

    backdrop-filter:blur(9px);

    -webkit-backdrop-filter:blur(9px);

    transform:
        translateX(-50%);
}


/* DOT NORMAL */

.sg-slider-pro
.swiper-pagination-bullet{
    width:9px !important;
    height:9px !important;

    margin:0 !important;

    background:
        rgba(255,255,255,.50) !important;

    opacity:1 !important;

    border-radius:999px !important;

    transition:
        width .3s ease,
        background .3s ease !important;
}


/* DOT ACTIVO */

.sg-slider-pro
.swiper-pagination-bullet-active{
    width:28px !important;

    background:
        linear-gradient(
            90deg,
            #1A8FE3,
            #0A6EB4
        ) !important;
}


/* ============================================================
   LÍNEA DECORATIVA INFERIOR
============================================================ */

.sg-slider-pro::after{
    content:"";

    position:absolute;

    z-index:10;

    left:0;
    bottom:0;

    width:100%;
    height:6px;

    pointer-events:none;

    background:
        linear-gradient(
            90deg,
            #1A8FE3,
            #0A6EB4,
            #005299
        );
}


/* ============================================================
   ANIMACIONES DEL CONTENIDO
============================================================ */

.sg-slider-pro
.swiper-slide-active
.swiper-slide-contents{
    animation:
        sgSliderContent .8s ease both;
}


@keyframes sgSliderContent{

    from{
        opacity:0;

        transform:
            translateY(25px);
    }

    to{
        opacity:1;

        transform:
            translateY(0);
    }

}


/* ============================================================
   TABLET
============================================================ */

@media(max-width:1024px){

    .sg-slider-pro
    .swiper-slide,
    .sg-slider-pro
    .swiper-slide-inner{
        min-height:560px !important;
    }


    .sg-slider-pro
    .swiper-slide-inner{
        padding:
            60px 8% !important;
    }


    .sg-slider-pro
    .elementor-slide-heading{
        font-size:
            clamp(38px,6vw,54px) !important;
    }


    .sg-slider-pro
    .elementor-slide-description{
        max-width:560px !important;

        font-size:15px !important;
    }

}


/* ============================================================
   MÓVIL
============================================================ */

@media(max-width:767px){

    .sg-slider-pro
    .elementor-widget-container,
    .sg-slider-pro
    .swiper,
    .sg-slider-pro
    .swiper-container{
        border-radius:20px !important;
    }


    .sg-slider-pro
    .swiper-slide{
        min-height:550px !important;
    }


    .sg-slider-pro
    .swiper-slide-inner{
        min-height:550px !important;

        align-items:flex-end !important;

        padding:
            45px 20px 75px !important;
    }


    .sg-slider-pro
    .swiper-slide::before{
        background:
            linear-gradient(
                180deg,
                rgb(0 20 40 / 22%) 0%,
                rgb(0 20 40 / 53%) 40%,
                rgb(0 20 40 / 96%) 100%
            );
    }


    .sg-slider-pro
    .swiper-slide-contents::before{
        margin-bottom:14px;

        padding:
            7px 11px;

        font-size:8px;
    }


    .sg-slider-pro
    .elementor-slide-heading{
        margin-bottom:
            13px !important;

        font-size:
            34px !important;

        line-height:
            1.07 !important;
    }


    .sg-slider-pro
    .elementor-slide-heading::after{
        width:70px;
        height:5px;

        margin-top:13px;
    }


    .sg-slider-pro
    .elementor-slide-description{
        margin-bottom:
            20px !important;

        font-size:
            13px !important;

        line-height:
            1.65 !important;
    }


    .sg-slider-pro
    .elementor-slide-button{
        min-height:
            45px !important;

        padding:
            0 18px !important;

        font-size:
            11px !important;
    }


    .sg-slider-pro
    .elementor-swiper-button,
    .sg-slider-pro
    .swiper-button-prev,
    .sg-slider-pro
    .swiper-button-next{
        width:
            42px !important;

        height:
            42px !important;
    }


    .sg-slider-pro
    .elementor-swiper-button-prev{
        left:
            9px !important;
    }


    .sg-slider-pro
    .elementor-swiper-button-next{
        right:
            9px !important;
    }

}


/* ============================================================
   MÓVILES PEQUEÑOS
============================================================ */

@media(max-width:480px){

    .sg-slider-pro
    .swiper-slide,
    .sg-slider-pro
    .swiper-slide-inner{
        min-height:
            520px !important;
    }


    .sg-slider-pro
    .elementor-slide-heading{
        font-size:
            30px !important;
    }


    .sg-slider-pro
    .elementor-slide-description{
        font-size:
            12.5px !important;
    }

}

/* ============================================================
   FIX FULL WIDTH REAL
   SLIDER PRODUCCIÓN AGROPECUARIA
============================================================ */


/* CONTENEDOR PADRE */
.sg-slider-full{
    position:relative !important;

    width:100vw !important;
    max-width:100vw !important;

    left:50% !important;

    margin-left:-50vw !important;
    margin-right:-50vw !important;

    padding:0 !important;

    gap:0 !important;

    --gap:0px !important;
    --row-gap:0px !important;
    --column-gap:0px !important;

    overflow:hidden !important;
}


/* SI ES CONTAINER DE ELEMENTOR */
.sg-slider-full.e-con,
.e-con.sg-slider-full{
    width:100vw !important;
    max-width:100vw !important;

    flex-basis:100vw !important;

    left:50% !important;

    margin-left:-50vw !important;
    margin-right:-50vw !important;
}


/* QUITAR POSIBLES LIMITACIONES INTERNAS */
.sg-slider-full > .e-con-inner{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;
}


/* ============================================================
   WIDGET SLIDER
============================================================ */

.sg-slider-full .sg-slider-pro{
    position:relative !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    left:auto !important;
}


/* ============================================================
   CONTENEDOR INTERNO
============================================================ */

.sg-slider-full
.sg-slider-pro
.elementor-widget-container{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    /*
       QUITAMOS REDONDEO EXTERIOR
       PORQUE AHORA LLEGA A LOS BORDES
    */
    border-radius:0 !important;
}


/* ============================================================
   SWIPER
============================================================ */

.sg-slider-full
.sg-slider-pro
.swiper,

.sg-slider-full
.sg-slider-pro
.swiper-container,

.sg-slider-full
.sg-slider-pro
.elementor-slides-wrapper{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;

    border-radius:0 !important;
}


/* ============================================================
   CADA SLIDE
============================================================ */

.sg-slider-full
.sg-slider-pro
.swiper-slide{
    width:100% !important;
    max-width:none !important;

    min-height:620px !important;
}


/* ============================================================
   IMAGEN
============================================================ */

.sg-slider-full
.sg-slider-pro
.swiper-slide-bg{
    width:100% !important;
    height:100% !important;

    background-size:cover !important;
    background-position:center center !important;
}


/* ============================================================
   CONTENIDO
   EL SLIDER ES FULL WIDTH,
   PERO EL TEXTO NO QUEDA PEGADO AL BORDE
============================================================ */

.sg-slider-full
.sg-slider-pro
.swiper-slide-inner{
    width:100% !important;
    max-width:1600px !important;

    min-height:620px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding:
        70px 7% !important;
}


/* ============================================================
   FRANJA INFERIOR
============================================================ */

.sg-slider-full
.sg-slider-pro::after{
    left:0 !important;
    bottom:0 !important;

    width:100% !important;

    border-radius:0 !important;
}


/* ============================================================
   TABLET
============================================================ */

@media(max-width:1024px){

    .sg-slider-full
    .sg-slider-pro
    .swiper-slide,

    .sg-slider-full
    .sg-slider-pro
    .swiper-slide-inner{
        min-height:560px !important;
    }


    .sg-slider-full
    .sg-slider-pro
    .swiper-slide-inner{
        padding:
            60px 6% !important;
    }

}


/* ============================================================
   MÓVIL
============================================================ */

@media(max-width:767px){

    .sg-slider-full
    .sg-slider-pro
    .swiper-slide,

    .sg-slider-full
    .sg-slider-pro
    .swiper-slide-inner{
        min-height:550px !important;
    }


    .sg-slider-full
    .sg-slider-pro
    .swiper-slide-inner{
        padding:
            45px 20px 75px !important;
    }

}


/* EVITAR SCROLL HORIZONTAL */
html,
body{
    overflow-x:hidden !important;
}

/* ============================================================
   CAMBIO DE COLORES
   IESTP DIVINO JESÚS
   SOLO COLORES - NO MODIFICA ESTRUCTURA
============================================================ */

.sg-slider-pro{
    --sg-blue:#5A1B87;
    --sg-blue-dark:#32105F;
    --sg-blue-light:#43106F;

    --sg-blue-claro:#7A35A8;
    --sg-blue-oscuro:#210638;

    --sg-white:#FFFFFF;
}


/* ============================================================
   FONDO GENERAL DEL SLIDER
============================================================ */

.sg-slider-pro .elementor-widget-container{
    background:
        linear-gradient(
            135deg,
            rgb(50 16 95 / 95%),
            rgb(33 6 56 / 98%)
        );

    box-shadow:
        0 25px 60px
        rgba(43,11,79,.16);
}


/* ============================================================
   FONDO DE CADA SLIDE
============================================================ */

.sg-slider-pro .swiper-slide{
    background:
        linear-gradient(
            135deg,
            rgb(50 16 95 / 95%),
            rgb(33 6 56 / 98%)
        ) !important;
}


/* ============================================================
   OVERLAY
   MISMA INTENSIDAD DEL ORIGINAL
   SOLO CAMBIA AZUL POR MORADO
============================================================ */

.sg-slider-pro .swiper-slide::before{
    background:
        linear-gradient(
            90deg,
            rgb(24 4 43 / 91%) 0%,
            rgb(43 11 79 / 82%) 34%,
            rgb(68 16 111 / 55%) 62%,
            rgb(68 16 111 / 18%) 100%
        );
}


/* ============================================================
   BRILLO DECORATIVO
============================================================ */

.sg-slider-pro .swiper-slide::after{
    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.15) 0%,
            rgba(122,53,168,.10) 42%,
            transparent 70%
        );
}


/* ============================================================
   ETIQUETA SUPERIOR
============================================================ */

.sg-slider-pro
.swiper-slide-contents::before{
    content:"IESTP DIVINO JESÚS";

    color:#FFD84D;

    background:
        rgba(255,255,255,.08);

    border:
        1px solid rgba(255,255,255,.15);
}


/* ============================================================
   LÍNEA DEBAJO DEL TÍTULO
============================================================ */

.sg-slider-pro
.elementor-slide-heading::after{
    background:
        linear-gradient(
            90deg,
            #FFD84D,
            #F5B900,
            #DCA600
        );

    box-shadow:
        0 5px 14px
        rgba(245,185,0,.25);
}


/* ============================================================
   BOTÓN
============================================================ */

.sg-slider-pro
.elementor-slide-button{
    color:#2B0B4F !important;

    background:
        linear-gradient(
            135deg,
            #FFD84D 0%,
            #F5B900 45%,
            #DCA600 100%
        ) !important;

    box-shadow:
        0 13px 28px
        rgba(245,185,0,.25) !important;
}


/* HOVER BOTÓN */

.sg-slider-pro
.elementor-slide-button:hover{
    color:#FFFFFF !important;

    background:
        linear-gradient(
            135deg,
            #5A1B87,
            #32105F
        ) !important;

    box-shadow:
        0 18px 35px
        rgba(43,11,79,.35) !important;
}


/* ============================================================
   FLECHAS
   CONSERVAMOS EL ESTILO ORIGINAL
============================================================ */

.sg-slider-pro
.elementor-swiper-button,
.sg-slider-pro
.swiper-button-prev,
.sg-slider-pro
.swiper-button-next{
    color:#FFFFFF !important;

    background:
        rgba(50,16,95,.38) !important;

    border:
        1px solid rgba(255,255,255,.18) !important;
}


/* HOVER DE FLECHAS */

.sg-slider-pro
.elementor-swiper-button:hover,
.sg-slider-pro
.swiper-button-prev:hover,
.sg-slider-pro
.swiper-button-next:hover{
    color:#2B0B4F !important;

    background:
        linear-gradient(
            135deg,
            #FFD84D,
            #F5B900
        ) !important;
}


/* ============================================================
   PAGINACIÓN
============================================================ */

.sg-slider-pro
.swiper-pagination{
    background:
        rgba(50,16,95,.35);

    border:
        1px solid rgba(255,255,255,.14);
}


/* PUNTO NORMAL */

.sg-slider-pro
.swiper-pagination-bullet{
    background:
        rgba(255,255,255,.50) !important;
}


/* PUNTO ACTIVO */

.sg-slider-pro
.swiper-pagination-bullet-active{
    background:
        linear-gradient(
            90deg,
            #FFD84D,
            #F5B900
        ) !important;
}


/* ============================================================
   FRANJA INFERIOR
============================================================ */

.sg-slider-pro::after{
    background:
        linear-gradient(
            90deg,
            #32105F 0%,
            #5A1B87 35%,
            #F5B900 50%,
            #5A1B87 65%,
            #32105F 100%
        );
}


/* ============================================================
   OVERLAY MÓVIL
   MISMA CONFIGURACIÓN DEL ORIGINAL
   SOLO CAMBIO DE COLOR
============================================================ */

@media(max-width:767px){

    .sg-slider-pro
    .swiper-slide::before{
        background:
            linear-gradient(
                180deg,
                rgb(43 11 79 / 22%) 0%,
                rgb(43 11 79 / 53%) 40%,
                rgb(24 4 43 / 96%) 100%
            );
    }

}

/* ============================================================
   IDENTIDAD VISUAL - IESTP IBERIA
   NARANJA PROFUNDO + TERRACOTA + DORADO
   PEGAR AL FINAL DEL CSS DEL SLIDER
============================================================ */

.sg-slider-pro{
    --sg-blue:#9A3412;
    --sg-blue-dark:#5B210D;
    --sg-blue-light:#7C2D12;

    --sg-blue-claro:#C45112;
    --sg-blue-oscuro:#3F1406;

    --sg-white:#FFFFFF;
}


/* ============================================================
   FONDO GENERAL DEL SLIDER
============================================================ */

.sg-slider-pro .elementor-widget-container{
    background:
        linear-gradient(
            135deg,
            rgb(91 33 13 / 96%) 0%,
            rgb(74 23 7 / 98%) 55%,
            rgb(55 16 4 / 99%) 100%
        ) !important;

    box-shadow:
        0 25px 60px
        rgba(75,24,6,.22) !important;
}


/* ============================================================
   FONDO DE CADA SLIDE
============================================================ */

.sg-slider-pro .swiper-slide{
    background:
        linear-gradient(
            135deg,
            rgb(91 33 13 / 96%) 0%,
            rgb(74 23 7 / 98%) 55%,
            rgb(55 16 4 / 99%) 100%
        ) !important;
}


/* ============================================================
   OVERLAY
   OSCURO PARA QUE EL TEXTO SIEMPRE SE LEA
============================================================ */

.sg-slider-pro .swiper-slide::before{
    background:
        linear-gradient(
            90deg,
            rgb(48 13 3 / 94%) 0%,
            rgb(74 23 7 / 88%) 30%,
            rgb(105 34 9 / 67%) 58%,
            rgb(124 45 18 / 25%) 100%
        ) !important;
}


/* ============================================================
   BRILLO DECORATIVO
============================================================ */

.sg-slider-pro .swiper-slide::after{
    background:
        radial-gradient(
            circle,
            rgba(240,200,90,.16) 0%,
            rgba(194,65,12,.12) 40%,
            transparent 70%
        ) !important;
}


/* ============================================================
   ETIQUETA SUPERIOR
============================================================ */

.sg-slider-pro
.swiper-slide-contents::before{
    content:"IESTP IBERIA" !important;

    color:#F0C85A !important;

    background:
        rgba(68,18,3,.45) !important;

    border:
        1px solid rgba(240,200,90,.30) !important;

    box-shadow:
        0 6px 18px rgba(30,6,0,.15);

    backdrop-filter:
        blur(10px);

    -webkit-backdrop-filter:
        blur(10px);
}


/* ============================================================
   TÍTULO PRINCIPAL
============================================================ */

.sg-slider-pro
.elementor-slide-heading{
    color:#FFFFFF !important;

    text-shadow:
        0 4px 20px
        rgba(36,7,0,.40) !important;
}


/* ============================================================
   LÍNEA DEBAJO DEL TÍTULO
============================================================ */

.sg-slider-pro
.elementor-slide-heading::after{
    background:
        linear-gradient(
            90deg,
            #B57D0C 0%,
            #D6A21C 50%,
            #F0C85A 100%
        ) !important;

    box-shadow:
        0 5px 15px
        rgba(214,162,28,.28) !important;
}


/* ============================================================
   DESCRIPCIÓN
============================================================ */

.sg-slider-pro
.elementor-slide-description{
    color:
        rgba(255,247,240,.94) !important;

    text-shadow:
        0 2px 8px
        rgba(38,8,0,.20);
}


/* ============================================================
   BOTÓN PRINCIPAL
============================================================ */

.sg-slider-pro
.elementor-slide-button{
    color:#FFFFFF !important;

    background:
        linear-gradient(
            135deg,
            #7C2D12 0%,
            #9A3412 52%,
            #C45112 100%
        ) !important;

    border:
        1px solid
        rgba(240,200,90,.55) !important;

    box-shadow:
        0 13px 28px
        rgba(75,24,6,.34) !important;
}


/* HOVER BOTÓN */

.sg-slider-pro
.elementor-slide-button:hover{
    color:#4A1707 !important;

    background:
        linear-gradient(
            135deg,
            #B57D0C 0%,
            #D6A21C 48%,
            #F0C85A 100%
        ) !important;

    border-color:
        #F0C85A !important;

    transform:
        translateY(-4px);

    box-shadow:
        0 18px 35px
        rgba(91,50,3,.32) !important;
}


/* ============================================================
   FLECHAS
============================================================ */

.sg-slider-pro
.elementor-swiper-button,

.sg-slider-pro
.swiper-button-prev,

.sg-slider-pro
.swiper-button-next{
    color:#FFFFFF !important;

    background:
        rgba(76,22,6,.55) !important;

    border:
        1px solid
        rgba(240,200,90,.42) !important;

    box-shadow:
        0 7px 20px
        rgba(35,7,0,.20) !important;

    backdrop-filter:
        blur(10px);

    -webkit-backdrop-filter:
        blur(10px);
}


/* HOVER FLECHAS */

.sg-slider-pro
.elementor-swiper-button:hover,

.sg-slider-pro
.swiper-button-prev:hover,

.sg-slider-pro
.swiper-button-next:hover{
    color:#4A1707 !important;

    background:
        linear-gradient(
            135deg,
            #B57D0C,
            #D6A21C,
            #F0C85A
        ) !important;

    border-color:
        #F0C85A !important;

    transform:
        scale(1.08);
}


/* ============================================================
   PAGINACIÓN
============================================================ */

.sg-slider-pro
.swiper-pagination{
    background:
        rgba(62,16,4,.48) !important;

    border:
        1px solid
        rgba(240,200,90,.25) !important;

    box-shadow:
        0 5px 15px
        rgba(31,6,0,.15);
}


/* PUNTO NORMAL */

.sg-slider-pro
.swiper-pagination-bullet{
    background:
        rgba(255,244,234,.60) !important;
}


/* PUNTO ACTIVO */

.sg-slider-pro
.swiper-pagination-bullet-active{
    background:
        linear-gradient(
            90deg,
            #B57D0C,
            #D6A21C,
            #F0C85A
        ) !important;
}


/* ============================================================
   FRANJA INFERIOR DEL SLIDER
============================================================ */

.sg-slider-pro::after{
    background:
        linear-gradient(
            90deg,
            #4A1707 0%,
            #7C2D12 22%,
            #C45112 42%,
            #D6A21C 50%,
            #C45112 58%,
            #7C2D12 78%,
            #4A1707 100%
        ) !important;
}


/* ============================================================
   MÓVIL
============================================================ */

@media(max-width:767px){

    .sg-slider-pro
    .swiper-slide::before{
        background:
            linear-gradient(
                180deg,
                rgb(76 22 6 / 18%) 0%,
                rgb(76 22 6 / 50%) 38%,
                rgb(43 10 2 / 96%) 100%
            ) !important;
    }


    .sg-slider-pro
    .swiper-slide-contents::before{
        color:
            #F0C85A !important;

        background:
            rgba(59,14,3,.55) !important;
    }

}


/* ============================================================
   AJUSTE EXTRA - FLECHAS EN MÓVIL
============================================================ */

@media(max-width:767px){

    .sg-slider-pro
    .elementor-swiper-button,

    .sg-slider-pro
    .swiper-button-prev,

    .sg-slider-pro
    .swiper-button-next{
        background:
            rgba(74,23,7,.72) !important;

        border:
            1px solid
            rgba(240,200,90,.45) !important;
    }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c282b7c *//* ============================================================
   PRESENTACIÓN DEL PROGRAMA
   IESTP SANGARARÁ
============================================================ */

.sg-program-intro,
.sg-program-intro *,
.sg-program-intro *::before,
.sg-program-intro *::after{
    box-sizing:border-box;
}


/* ============================================================
   CONTENEDOR PRINCIPAL
============================================================ */

.sg-program-intro{
    --azul:#172D54;
    --azul2:#10213F;
    --azul3:#23416F;

    --amarillo:#FFBD0A;
    --amarillo2:#FFD45A;

    --naranja:#FF9800;
    --naranja2:#EF6C00;

    --crema:#FFFAEF;
    --crema2:#FFF3D6;

    --blanco:#FFFFFF;
    --gris:#69768A;

    position:relative !important;

    width:100vw !important;
    max-width:100vw !important;

    left:50% !important;

    margin-left:-50vw !important;
    margin-right:-50vw !important;

    min-height:650px !important;

    padding:
        75px 52% 75px 7% !important;

    overflow:hidden !important;

    background:
        radial-gradient(
            circle at 8% 8%,
            rgba(255,189,10,.12),
            transparent 24%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(255,152,0,.08),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            #FFFDF8 0%,
            #FFFAF0 55%,
            #FFF5E2 100%
        ) !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;
}


/* QUITAR GAPS DE ELEMENTOR */

.sg-program-intro.e-con{
    --gap:0px !important;
    --row-gap:0px !important;
    --column-gap:0px !important;

    gap:0 !important;
}


/* ============================================================
   DECORACIONES
============================================================ */

.sg-program-intro::before{
    content:"";

    position:absolute;

    width:440px;
    height:440px;

    top:-310px;
    left:-180px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,189,10,.25),
            transparent 68%
        );

    pointer-events:none;
}


.sg-program-intro::after{
    content:"";

    position:absolute;

    width:430px;
    height:430px;

    right:-250px;
    bottom:-270px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,152,0,.13),
            transparent 68%
        );

    pointer-events:none;
}


/* ============================================================
   ENCABEZADO
============================================================ */

.sg-program-intro-title{
    position:relative !important;

    z-index:6;

    width:100% !important;

    max-width:720px !important;

    margin:
        0 0 22px !important;

    padding-top:
        42px !important;

    text-align:left !important;
}


/* BADGE */

.sg-program-intro-title::before{
    content:"quienes somos";

    position:absolute;

    top:0;
    left:0;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    padding:
        9px 15px;

    color:#D96800;

    background:#FFF0CA;

    border:
        1px solid
        rgba(239,108,0,.11);

    border-radius:999px;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif;

    font-size:8px;

    font-weight:900;

    line-height:1;

    letter-spacing:1px;

    text-transform:uppercase;
}


/* TITULO */

.sg-program-intro-title
.elementor-heading-title{
    margin:0 !important;

    color:#172D54 !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size:
        clamp(40px,4.7vw,58px) !important;

    font-weight:900 !important;

    line-height:1.02 !important;

    letter-spacing:-1.5px !important;

    text-align:left !important;
}


/* ============================================================
   TEXTO INTRODUCTORIO
============================================================ */

.sg-program-intro-text{
    position:relative !important;

    z-index:6;

    width:100% !important;

    max-width:720px !important;

    margin:
        0 0 28px !important;
}


.sg-program-intro-text,
.sg-program-intro-text p{
    color:#69768A !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size:14px !important;

    font-weight:400 !important;

    line-height:1.9 !important;

    text-align:left !important;
}


.sg-program-intro-text p{
    margin:
        0 0 20px !important;
}


.sg-program-intro-text p:last-child{
    margin-bottom:0 !important;
}


/* RESALTADOS */

.sg-program-intro-text strong{
    color:#EF6C00 !important;

    font-weight:850 !important;
}


/* ============================================================
   GRID 2 X 2
============================================================ */

.sg-program-features{
    position:relative !important;

    z-index:6;

    display:grid !important;

    grid-template-columns:
        repeat(2,minmax(0,1fr)) !important;

    gap:
        12px !important;

    width:100% !important;

    max-width:720px !important;

    margin:
        28px 0 0 !important;

    padding:0 !important;
}


/* ============================================================
   CADA FEATURE
============================================================ */

.sg-program-feature{
    position:relative !important;

    min-width:0 !important;

    min-height:52px !important;

    display:flex !important;

    align-items:center !important;

    margin:0 !important;

    padding:
        14px 18px 14px 50px !important;

    background:
        rgba(255,255,255,.92) !important;

    border:
        1px solid
        rgba(239,108,0,.18) !important;

    border-radius:
        13px !important;

    box-shadow:
        0 8px 22px
        rgba(23,45,84,.04) !important;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease !important;
}


.sg-program-feature:hover{
    transform:
        translateY(-4px);

    border-color:
        rgba(239,108,0,.35) !important;

    box-shadow:
        0 14px 30px
        rgba(23,45,84,.09) !important;
}


/* CHECK AMARILLO */

.sg-program-feature::before{
    content:"✓";

    position:absolute;

    left:13px;
    top:50%;

    width:27px;
    height:27px;

    display:flex;

    align-items:center;
    justify-content:center;

    color:#FFFFFF;

    background:
        linear-gradient(
            145deg,
            #FFD45A,
            #FFBD0A,
            #FF9800
        );

    border-radius:8px;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif;

    font-size:13px;

    font-weight:900;

    transform:
        translateY(-50%);

    box-shadow:
        0 6px 14px
        rgba(239,108,0,.13);
}


/* TEXTO DEL FEATURE */

.sg-program-feature,
.sg-program-feature p{
    color:#172D54 !important;

    font-family:
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size:10px !important;

    font-weight:750 !important;

    line-height:1.4 !important;

    text-align:left !important;
}


.sg-program-feature p{
    margin:0 !important;
}


/* ============================================================
   IMÁGENES
============================================================ */

.sg-program-img{
    position:absolute !important;

    z-index:4;

    margin:0 !important;

    overflow:hidden !important;

    background:#FFFFFF !important;

    border:
        6px solid #FFFFFF !important;

    border-radius:
        22px !important;

    box-shadow:
        0 24px 55px
        rgba(23,45,84,.16) !important;

    transition:
        transform .45s ease,
        box-shadow .45s ease !important;
}


.sg-program-img
.elementor-widget-container{
    width:100% !important;
    height:100% !important;

    margin:0 !important;
    padding:0 !important;
}


.sg-program-img img{
    width:100% !important;
    height:100% !important;

    display:block !important;

    object-fit:cover !important;

    border-radius:
        15px !important;

    transition:
        transform .55s ease !important;
}


.sg-program-img:hover img{
    transform:
        scale(1.045);
}


/* ============================================================
   IMAGEN GRANDE
============================================================ */

.sg-program-img-1{
    width:
        min(440px,31vw) !important;

    height:
        315px !important;

    top:
        105px !important;

    right:
        15% !important;

    transform:
        rotate(.4deg);
}


/* ============================================================
   IMAGEN SECUNDARIA
============================================================ */

.sg-program-img-2{
    width:
        min(310px,24vw) !important;

    height:
        205px !important;

    right:
        6.5% !important;

    bottom:
        72px !important;

    z-index:7;

    transform:
        rotate(.5deg);
}


/* ============================================================
   HOVER IMÁGENES
============================================================ */

.sg-program-img-1:hover{
    transform:
        rotate(0deg)
        translateY(-7px);
}


.sg-program-img-2:hover{
    transform:
        rotate(0deg)
        translateY(-7px);
}


/* ============================================================
   CÍRCULO / SELLO
   SE GENERA AUTOMÁTICAMENTE
============================================================ */

.sg-program-img-1::after{
    content:"Educación\A tecnológica\A productiva";

    white-space:pre;

    position:absolute;

    z-index:10;

    right:-115px;
    top:15px;

    width:120px;
    height:120px;

    display:flex;

    align-items:center;
    justify-content:center;

    padding:20px;

    color:#FFFFFF;

    background:
        linear-gradient(
            145deg,
            #FFD33D,
            #FFBD0A,
            #FF9800
        );

    border:
        6px solid #FFFFFF;

    border-radius:50%;

    box-shadow:
        0 16px 35px
        rgba(239,108,0,.17);

    font-family:
        "Segoe UI",
        Arial,
        sans-serif;

    font-size:10px;

    font-weight:900;

    line-height:1.35;

    text-align:center;

    pointer-events:none;
}


/* ============================================================
   PROTECCIÓN ELEMENTOR
============================================================ */

.sg-program-intro >
.elementor-element{
    min-width:0 !important;
}


/* ============================================================
   TABLET GRANDE
============================================================ */

@media(max-width:1180px){

    .sg-program-intro{
        min-height:
            680px !important;

        padding:
            65px 48% 70px 5% !important;
    }


    .sg-program-img-1{
        width:
            37vw !important;

        height:
            300px !important;

        right:
            9% !important;
    }


    .sg-program-img-2{
        width:
            27vw !important;

        height:
            195px !important;

        right:
            3% !important;
    }


    .sg-program-img-1::after{
        right:
            -80px;

        width:
            100px;

        height:
            100px;

        font-size:
            8px;
    }

}


/* ============================================================
   TABLET
============================================================ */

@media(max-width:900px){

    .sg-program-intro{
        min-height:auto !important;

        padding:
            60px 5% 65px !important;
    }


    .sg-program-intro-title,
    .sg-program-intro-text,
    .sg-program-features{
        max-width:
            100% !important;
    }


    /*
       LAS FOTOS PASAN DEBAJO DEL TEXTO
    */

    .sg-program-img{
        position:relative !important;

        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        left:auto !important;

        display:inline-block !important;

        vertical-align:top;

        margin-top:
            25px !important;
    }


    .sg-program-img-1{
        width:
            58% !important;

        height:
            310px !important;

        margin-right:
            2% !important;

        transform:none;
    }


    .sg-program-img-2{
        width:
            38% !important;

        height:
            235px !important;

        transform:none;
    }


    .sg-program-img-1::after{
        right:
            18px;

        top:
            18px;

        width:
            95px;

        height:
            95px;

        border-width:
            4px;
    }

}


/* ============================================================
   MÓVIL
============================================================ */

@media(max-width:767px){

    .sg-program-intro{
        padding:
            55px 17px 65px !important;
    }


    .sg-program-intro-title
    .elementor-heading-title{
        font-size:
            37px !important;
    }


    .sg-program-intro-text,
    .sg-program-intro-text p{
        font-size:
            13px !important;

        line-height:
            1.75 !important;
    }


    .sg-program-features{
        grid-template-columns:
            1fr !important;

        gap:
            10px !important;
    }


    .sg-program-feature{
        min-height:
            50px !important;
    }


    .sg-program-img-1,
    .sg-program-img-2{
        width:
            100% !important;

        height:
            240px !important;

        margin:
            18px 0 0 !important;
    }


    .sg-program-img-1{
        margin-top:
            32px !important;
    }


    .sg-program-img-1::after{
        width:
            82px;

        height:
            82px;

        right:
            14px;

        top:
            14px;

        padding:
            12px;

        font-size:
            7px;
    }

}


/* ============================================================
   MÓVIL PEQUEÑO
============================================================ */

@media(max-width:420px){

    .sg-program-intro{
        padding:
            48px 14px 58px !important;
    }


    .sg-program-intro-title
    .elementor-heading-title{
        font-size:
            33px !important;
    }


    .sg-program-img-1,
    .sg-program-img-2{
        height:
            215px !important;
    }

}


/* ============================================================
   EVITAR SCROLL HORIZONTAL
============================================================ */

html,
body{
    overflow-x:hidden !important;
}

/* ============================================================
   PRESENTACIÓN DEL PROGRAMA
   SOLO CAMBIO DE PALETA A AZULES
   NO MODIFICA ESTRUCTURA
============================================================ */


/* ============================================================
   VARIABLES + FONDO GENERAL
============================================================ */

.sg-program-intro{
    --azul:rgb(0 45 85 / 95%);
    --azul2:#001F3B;
    --azul3:#075D97;

    --amarillo:#70C8F4;
    --amarillo2:#BDEAFF;

    --naranja:#1580C1;
    --naranja2:#075D97;

    --crema:#002D55;
    --crema2:#073A66;

    --blanco:#FFFFFF;
    --gris:#C7D9E7;

    background:
        radial-gradient(
            circle at 8% 8%,
            rgba(112,200,244,.18),
            transparent 24%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(21,128,193,.14),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            rgb(0 45 85 / 99%) 0%,
            rgb(0 38 72 / 99%) 55%,
            rgb(0 25 49 / 100%) 100%
        ) !important;
}


/* ============================================================
   DECORACIONES
============================================================ */

.sg-program-intro::before{
    background:
        radial-gradient(
            circle,
            rgba(112,200,244,.25),
            transparent 68%
        ) !important;
}


.sg-program-intro::after{
    background:
        radial-gradient(
            circle,
            rgba(21,128,193,.18),
            transparent 68%
        ) !important;
}


/* ============================================================
   BADGE "PRESENTACIÓN DEL PROGRAMA"
============================================================ */

.sg-program-intro-title::before{
    color:#BDEAFF !important;

    background:
        rgba(255,255,255,.08) !important;

    border-color:
        rgba(112,200,244,.20) !important;

    box-shadow:
        0 7px 18px
        rgba(0,20,40,.12) !important;

    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}


/* ============================================================
   TÍTULO PRINCIPAL
============================================================ */

.sg-program-intro-title
.elementor-heading-title{
    color:#FFFFFF !important;

    text-shadow:
        0 5px 20px
        rgba(0,20,40,.20) !important;
}


/* ============================================================
   TEXTO INTRODUCTORIO
============================================================ */

.sg-program-intro-text,
.sg-program-intro-text p{
    color:
        rgba(255,255,255,.78) !important;
}


/* TEXTO DESTACADO */

.sg-program-intro-text strong{
    color:#70C8F4 !important;
}


/* ============================================================
   CUADROS 2 X 2
============================================================ */

.sg-program-feature{
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.11),
            rgba(255,255,255,.07)
        ) !important;

    border-color:
        rgba(112,200,244,.22) !important;

    box-shadow:
        0 8px 22px
        rgba(0,18,35,.17) !important;

    backdrop-filter:
        blur(8px);

    -webkit-backdrop-filter:
        blur(8px);
}


/* HOVER */

.sg-program-feature:hover{
    border-color:
        rgba(112,200,244,.48) !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.15),
            rgba(255,255,255,.09)
        ) !important;

    box-shadow:
        0 14px 30px
        rgba(0,18,35,.25) !important;
}


/* ============================================================
   CHECK DE CADA CUADRO
============================================================ */

.sg-program-feature::before{
    color:#002D55 !important;

    background:
        linear-gradient(
            145deg,
            #D9F3FF,
            #9FDEFF,
            #70C8F4
        ) !important;

    box-shadow:
        0 6px 14px
        rgba(0,20,40,.16) !important;
}


/* ============================================================
   TEXTO DE LOS CUADROS
============================================================ */

.sg-program-feature,
.sg-program-feature p{
    color:#FFFFFF !important;
}


/* ============================================================
   IMÁGENES
   SOLO CAMBIO DE SOMBRA / BORDE
============================================================ */

.sg-program-img{
    background:#FFFFFF !important;

    border-color:#FFFFFF !important;

    box-shadow:
        0 24px 55px
        rgba(0,18,35,.32) !important;
}


.sg-program-img:hover{
    box-shadow:
        0 30px 65px
        rgba(0,18,35,.42) !important;
}


/* ============================================================
   SELLO CIRCULAR
   "Educación tecnológica productiva"
============================================================ */

.sg-program-img-1::after{
    color:#FFFFFF !important;

    background:
        linear-gradient(
            145deg,
            #1580C1,
            #075D97,
            #002D55
        ) !important;

    border-color:#FFFFFF !important;

    box-shadow:
        0 16px 35px
        rgba(0,20,40,.30) !important;
}

/* ============================================================
   PRESENTACIÓN DEL PROGRAMA
   IESTP DIVINO JESÚS

   SOLO CAMBIO DE COLORES
   NO MODIFICA ESTRUCTURA
   NO MODIFICA RESPONSIVE
   NO MODIFICA TAMAÑOS
   NO MODIFICA POSICIONES
============================================================ */


/* ============================================================
   VARIABLES + FONDO GENERAL
============================================================ */

.sg-program-intro{

    --azul:#32105F;
    --azul2:#210638;
    --azul3:#4B176D;

    --amarillo:#F5B900;
    --amarillo2:#FFD84D;

    --naranja:#DCA600;
    --naranja2:#B98B00;

    --crema:#32105F;
    --crema2:#421066;

    --blanco:#FFFFFF;
    --gris:#DDD5E5;

    background:
        radial-gradient(
            circle at 8% 8%,
            rgba(245,185,0,.16),
            transparent 24%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(105,36,155,.16),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            #32105F 0%,
            #2B0B4F 55%,
            #210638 100%
        ) !important;
}


/* ============================================================
   DECORACIONES
============================================================ */

.sg-program-intro::before{

    background:
        radial-gradient(
            circle,
            rgba(245,185,0,.25),
            transparent 68%
        ) !important;
}


.sg-program-intro::after{

    background:
        radial-gradient(
            circle,
            rgba(105,36,155,.20),
            transparent 68%
        ) !important;
}


/* ============================================================
   BADGE SUPERIOR
============================================================ */

.sg-program-intro-title::before{

    color:#FFD84D !important;

    background:
        rgba(255,255,255,.08) !important;

    border-color:
        rgba(245,185,0,.25) !important;

    box-shadow:
        0 7px 18px
        rgba(20,4,35,.15) !important;
}


/* ============================================================
   TÍTULO PRINCIPAL
============================================================ */

.sg-program-intro-title
.elementor-heading-title{

    color:#FFFFFF !important;

    text-shadow:
        0 5px 20px
        rgba(20,4,35,.24) !important;
}


/* ============================================================
   TEXTO INTRODUCTORIO
============================================================ */

.sg-program-intro-text,
.sg-program-intro-text p{

    color:
        rgba(255,255,255,.80) !important;
}


/* TEXTO DESTACADO */

.sg-program-intro-text strong{

    color:#FFD84D !important;
}


/* ============================================================
   CUADROS 2 X 2
============================================================ */

.sg-program-feature{

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.11),
            rgba(255,255,255,.07)
        ) !important;

    border-color:
        rgba(245,185,0,.22) !important;

    box-shadow:
        0 8px 22px
        rgba(20,4,35,.19) !important;
}


/* HOVER */

.sg-program-feature:hover{

    border-color:
        rgba(245,185,0,.48) !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.15),
            rgba(255,255,255,.09)
        ) !important;

    box-shadow:
        0 14px 30px
        rgba(20,4,35,.27) !important;
}


/* ============================================================
   CHECK DE CADA CUADRO
============================================================ */

.sg-program-feature::before{

    color:#2B0B4F !important;

    background:
        linear-gradient(
            145deg,
            #FFE985,
            #FFD84D,
            #F5B900
        ) !important;

    box-shadow:
        0 6px 14px
        rgba(245,185,0,.20) !important;
}


/* ============================================================
   TEXTO DE LOS CUADROS
============================================================ */

.sg-program-feature,
.sg-program-feature p{

    color:#FFFFFF !important;
}


/* ============================================================
   IMÁGENES
   SOLO SOMBRA / BORDE
============================================================ */

.sg-program-img{

    background:#FFFFFF !important;

    border-color:#FFFFFF !important;

    box-shadow:
        0 24px 55px
        rgba(20,4,35,.34) !important;
}


.sg-program-img:hover{

    box-shadow:
        0 30px 65px
        rgba(20,4,35,.44) !important;
}


/* ============================================================
   SELLO CIRCULAR
============================================================ */

.sg-program-img-1::after{

    color:#2B0B4F !important;

    background:
        linear-gradient(
            145deg,
            #FFD84D,
            #F5B900,
            #DCA600
        ) !important;

    border-color:#FFFFFF !important;

    box-shadow:
        0 16px 35px
        rgba(245,185,0,.26) !important;
}

/* ============================================================
   PRESENTACIÓN INSTITUCIONAL
   IESTP IBERIA

   NARANJA PROFUNDO + TERRACOTA + DORADO
   SOLO CAMBIO VISUAL
   NO MODIFICA ESTRUCTURA / RESPONSIVE / TAMAÑOS
============================================================ */


/* ============================================================
   VARIABLES + FONDO GENERAL
============================================================ */

.sg-program-intro{

    --azul:#7C2D12;
    --azul2:#4A1707;
    --azul3:#9A3412;

    --amarillo:#D6A21C;
    --amarillo2:#F0C85A;

    --naranja:#C45112;
    --naranja2:#9A3412;

    --crema:#6A220C;
    --crema2:#842D0F;

    --blanco:#FFFFFF;
    --gris:#EADBD2;

    background:

        radial-gradient(
            circle at 8% 8%,
            rgba(240,200,90,.15),
            transparent 24%
        ),

        radial-gradient(
            circle at 95% 85%,
            rgba(196,81,18,.18),
            transparent 27%
        ),

        linear-gradient(
            135deg,
            #68250E 0%,
            #55200D 48%,
            #3F1406 100%
        ) !important;
}


/* ============================================================
   DECORACIONES
============================================================ */

.sg-program-intro::before{

    background:
        radial-gradient(
            circle,
            rgba(240,200,90,.25),
            transparent 68%
        ) !important;
}


.sg-program-intro::after{

    background:
        radial-gradient(
            circle,
            rgba(196,81,18,.20),
            transparent 68%
        ) !important;
}


/* ============================================================
   BADGE SUPERIOR
============================================================ */

.sg-program-intro-title::before{

    color:#F0C85A !important;

    background:
        rgba(59,16,3,.40) !important;

    border-color:
        rgba(240,200,90,.28) !important;

    box-shadow:
        0 7px 18px
        rgba(35,8,0,.20) !important;

    backdrop-filter:
        blur(8px);

    -webkit-backdrop-filter:
        blur(8px);
}


/* ============================================================
   TÍTULO PRINCIPAL
============================================================ */

.sg-program-intro-title
.elementor-heading-title{

    color:#FFFFFF !important;

    text-shadow:
        0 5px 22px
        rgba(35,8,0,.32) !important;
}


/* ============================================================
   TEXTO INTRODUCTORIO
============================================================ */

.sg-program-intro-text,
.sg-program-intro-text p{

    color:
        rgba(255,245,238,.86) !important;
}


/* TEXTO DESTACADO */

.sg-program-intro-text strong{

    color:#F0C85A !important;

    font-weight:
        850 !important;
}


/* ============================================================
   CUADROS 2 X 2
============================================================ */

.sg-program-feature{

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.12),
            rgba(255,244,236,.065)
        ) !important;

    border-color:
        rgba(240,200,90,.25) !important;

    box-shadow:
        0 8px 22px
        rgba(37,8,0,.22) !important;

    backdrop-filter:
        blur(9px);

    -webkit-backdrop-filter:
        blur(9px);
}


/* ============================================================
   HOVER CUADROS
============================================================ */

.sg-program-feature:hover{

    border-color:
        rgba(240,200,90,.58) !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.17),
            rgba(240,200,90,.09)
        ) !important;

    box-shadow:
        0 15px 32px
        rgba(37,8,0,.30) !important;
}


/* ============================================================
   CHECK DE CADA CUADRO
============================================================ */

.sg-program-feature::before{

    color:#55200D !important;

    background:
        linear-gradient(
            145deg,
            #F7D96F 0%,
            #F0C85A 35%,
            #D6A21C 70%,
            #B57D0C 100%
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.25);

    box-shadow:
        0 6px 15px
        rgba(87,50,3,.27) !important;
}


/* ============================================================
   TEXTO DE LOS CUADROS
============================================================ */

.sg-program-feature,
.sg-program-feature p{

    color:#FFFFFF !important;
}


/* ============================================================
   IMÁGENES
============================================================ */

.sg-program-img{

    background:
        #FFF9F5 !important;

    border-color:
        #FFF9F5 !important;

    box-shadow:
        0 24px 55px
        rgba(38,8,0,.36) !important;
}


.sg-program-img:hover{

    box-shadow:
        0 31px 68px
        rgba(38,8,0,.47) !important;
}


/* ============================================================
   BORDE INTERNO SUTIL EN LAS IMÁGENES
============================================================ */

.sg-program-img img{

    box-shadow:
        inset 0 0 0 1px
        rgba(124,45,18,.08);
}


/* ============================================================
   SELLO CIRCULAR
============================================================ */

.sg-program-img-1::after{

    color:#55200D !important;

    background:
        linear-gradient(
            145deg,
            #F0C85A 0%,
            #D6A21C 48%,
            #B77C0D 100%
        ) !important;

    border-color:
        #FFF9F5 !important;

    box-shadow:
        0 17px 37px
        rgba(72,37,2,.32) !important;
}


/* ============================================================
   PEQUEÑO EFECTO EN EL SELLO
============================================================ */

.sg-program-img-1:hover::after{

    background:
        linear-gradient(
            145deg,
            #F6D870,
            #E2B334,
            #C68B12
        ) !important;
}


/* ============================================================
   TABLET / MÓVIL
   SOLO AJUSTES DE CONTRASTE
============================================================ */

@media(max-width:900px){

    .sg-program-intro{

        background:

            radial-gradient(
                circle at 10% 5%,
                rgba(240,200,90,.14),
                transparent 24%
            ),

            linear-gradient(
                150deg,
                #68250E 0%,
                #55200D 50%,
                #3F1406 100%
            ) !important;
    }

}


@media(max-width:767px){

    .sg-program-intro-title::before{

        background:
            rgba(57,14,2,.55) !important;

        border-color:
            rgba(240,200,90,.32) !important;
    }


    .sg-program-feature{

        background:
            linear-gradient(
                145deg,
                rgba(255,255,255,.13),
                rgba(255,255,255,.07)
            ) !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-2a21a03 *//* ============================================================
   RESEÑA HISTÓRICA
   IESTP IBERIA TAHUAMANU
   NARANJA INTENSO + MARRÓN
============================================================ */

.iberia-history,
.iberia-history *,
.iberia-history *::before,
.iberia-history *::after{
    box-sizing:border-box;
}


/* ============================================================
   VARIABLES
============================================================ */

.iberia-history{

    --ib-orange:#f05a00;
    --ib-orange-2:#ff7300;
    --ib-orange-3:#ff922b;
    --ib-orange-dark:#cc4700;

    --ib-brown:#462312;
    --ib-brown-2:#603119;
    --ib-brown-3:#7c482b;

    --ib-cream:#fff8f1;
    --ib-cream-2:#f9eee5;

    --ib-white:#ffffff;

    --ib-text:#513c30;
    --ib-muted:#806d60;

    width:100%;

    padding:70px 20px 80px;

    font-family:
        "Roboto",
        Arial,
        sans-serif;

    color:
        var(--ib-text);

    background:

        radial-gradient(
            circle at 0% 5%,
            rgba(255,115,0,.10),
            transparent 26%
        ),

        radial-gradient(
            circle at 100% 55%,
            rgba(96,49,25,.07),
            transparent 28%
        ),

        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffaf6 100%
        );
}


.iberia-history__container{

    width:100%;

    max-width:1220px;

    margin:0 auto;
}


/* ============================================================
   CABECERA
============================================================ */

.iberia-history__heading{

    max-width:760px;

    margin:
        0 auto 45px;

    text-align:center;
}


.iberia-history__eyebrow{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    min-height:30px;

    padding:0 15px;

    margin-bottom:14px;

    border-radius:50px;

    color:
        var(--ib-orange);

    background:
        rgba(240,90,0,.09);

    border:
        1px solid
        rgba(240,90,0,.13);

    font-size:10px;

    font-weight:900;

    letter-spacing:1.6px;

    text-transform:uppercase;
}


.iberia-history__heading h2{

    margin:0;

    color:
        var(--ib-brown);

    font-size:
        clamp(32px,3.7vw,46px);

    font-weight:900;

    line-height:1.08;

    letter-spacing:-1px;
}


.iberia-history__heading h2 strong{

    color:
        var(--ib-orange);

    font-weight:900;
}


.iberia-history__heading p{

    max-width:650px;

    margin:
        15px auto 0;

    color:
        var(--ib-muted);

    font-size:14px;

    line-height:1.75;
}


.iberia-history__line{

    display:block;

    width:86px;
    height:5px;

    margin:
        20px auto 0;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            var(--ib-orange-2),
            var(--ib-brown)
        );
}


/* ============================================================
   INTRODUCCIÓN
============================================================ */

.iberia-history__intro{

    position:relative;

    max-width:980px;

    margin:
        0 auto 60px;

    padding:
        28px 32px;

    display:flex;

    align-items:center;

    gap:20px;

    overflow:hidden;

    border-radius:21px;

    color:#ffffff;

    background:

        radial-gradient(
            circle at 100% 0%,
            rgba(255,115,0,.25),
            transparent 30%
        ),

        linear-gradient(
            135deg,
            #67351c 0%,
            #542712 55%,
            #3f1c0d 100%
        );

    box-shadow:
        0 16px 38px
        rgba(70,35,18,.15);
}


.iberia-history__intro-icon{

    width:64px;
    height:64px;

    flex:0 0 64px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:17px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            var(--ib-orange-3),
            var(--ib-orange-dark)
        );

    box-shadow:
        0 8px 18px
        rgba(0,0,0,.18);
}


.iberia-history__intro-icon svg{

    width:30px;
    height:30px;

    fill:currentColor;
}


.iberia-history__intro > div:last-child{

    display:flex;

    flex-direction:column;
}


.iberia-history__intro > div > span{

    margin-bottom:5px;

    color:#ff9d54;

    font-size:9px;

    font-weight:900;

    letter-spacing:1.4px;

    text-transform:uppercase;
}


.iberia-history__intro h3{

    margin:
        0 0 7px;

    color:#ffffff;

    font-size:20px;

    font-weight:900;

    line-height:1.25;
}


.iberia-history__intro p{

    margin:0;

    color:
        rgba(255,255,255,.72);

    font-size:12.5px;

    line-height:1.65;
}


/* ============================================================
   LÍNEA DE TIEMPO
============================================================ */

.iberia-history__timeline{

    position:relative;

    max-width:1000px;

    margin:0 auto;

    display:flex;

    flex-direction:column;

    gap:24px;
}


/* LÍNEA VERTICAL */

.iberia-history__timeline::before{

    content:"";

    position:absolute;

    top:40px;
    bottom:40px;

    left:55px;

    width:3px;

    border-radius:10px;

    background:
        linear-gradient(
            180deg,
            var(--ib-orange-2),
            var(--ib-orange),
            var(--ib-brown)
        );
}


/* ============================================================
   ITEM
============================================================ */

.iberia-history__item{

    position:relative;

    display:grid;

    grid-template-columns:
        112px 1fr;

    align-items:start;
}


/* ============================================================
   AÑO
============================================================ */

.iberia-history__year{

    position:relative;

    z-index:3;

    width:82px;
    height:82px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:20px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            var(--ib-orange-2),
            var(--ib-orange-dark)
        );

    border:
        5px solid #fff8f1;

    box-shadow:
        0 10px 23px
        rgba(240,90,0,.20);
}


.iberia-history__year span{

    font-size:14px;

    font-weight:900;

    letter-spacing:.4px;
}


/* ============================================================
   TARJETA
============================================================ */

.iberia-history__card{

    position:relative;

    min-height:150px;

    padding:
        25px 27px;

    overflow:hidden;

    border-radius:19px;

    background:
        #ffffff;

    border:
        1px solid
        rgba(96,49,25,.09);

    box-shadow:
        0 10px 30px
        rgba(70,35,18,.07);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


/* DETALLE IZQUIERDO */

.iberia-history__card::before{

    content:"";

    position:absolute;

    top:0;
    bottom:0;

    left:0;

    width:5px;

    background:
        linear-gradient(
            180deg,
            var(--ib-orange-2),
            var(--ib-brown)
        );
}


.iberia-history__item:hover
.iberia-history__card{

    transform:
        translateX(6px);

    border-color:
        rgba(240,90,0,.20);

    box-shadow:
        0 17px 39px
        rgba(70,35,18,.12);
}


/* ============================================================
   FECHA
============================================================ */

.iberia-history__date{

    display:inline-flex;

    min-height:25px;

    padding:
        0 11px;

    margin-bottom:
        9px;

    align-items:center;

    border-radius:
        30px;

    color:
        var(--ib-orange-dark);

    background:
        rgba(240,90,0,.08);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .7px;

    text-transform:
        uppercase;
}


/* ============================================================
   TÍTULOS
============================================================ */

.iberia-history__card h3{

    margin:
        0 0 12px;

    color:
        var(--ib-brown);

    font-size:
        20px;

    font-weight:
        900;

    line-height:
        1.2;
}


/* ============================================================
   TEXTOS
============================================================ */

.iberia-history__card p{

    margin:
        0 0 10px;

    color:
        var(--ib-muted);

    font-size:
        13px;

    line-height:
        1.7;
}


.iberia-history__card p:last-of-type{

    margin-bottom:0;
}


.iberia-history__card strong{

    color:
        var(--ib-brown-2);

    font-weight:
        800;
}


/* ============================================================
   RESOLUCIÓN
============================================================ */

.iberia-history__highlight{

    width:max-content;

    max-width:100%;

    margin-top:17px;

    padding:
        10px 13px;

    display:flex;

    align-items:center;

    gap:10px;

    border-radius:12px;

    background:
        var(--ib-cream);

    border:
        1px solid
        rgba(240,90,0,.12);
}


.iberia-history__highlight-icon{

    width:35px;
    height:35px;

    flex:0 0 35px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:9px;

    color:#ffffff;

    background:
        var(--ib-orange);
}


.iberia-history__highlight-icon svg{

    width:17px;
    height:17px;

    fill:currentColor;
}


.iberia-history__highlight div{

    display:flex;

    flex-direction:column;

    gap:2px;
}


.iberia-history__highlight small{

    color:
        var(--ib-muted);

    font-size:8px;

    font-weight:700;

    text-transform:uppercase;
}


.iberia-history__highlight strong{

    color:
        var(--ib-brown);

    font-size:11px;

    font-weight:900;
}


/* ============================================================
   ETIQUETA
============================================================ */

.iberia-history__tag{

    display:inline-flex;

    align-items:center;

    min-height:29px;

    margin-top:15px;

    padding:
        0 13px;

    border-radius:30px;

    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            var(--ib-orange-2),
            var(--ib-orange-dark)
        );

    font-size:
        9px;

    font-weight:
        900;
}


/* ============================================================
   TAGS
============================================================ */

.iberia-history__tags{

    display:flex;

    flex-wrap:wrap;

    gap:7px;

    margin-top:15px;
}


.iberia-history__tags span{

    padding:
        7px 11px;

    border-radius:30px;

    color:
        var(--ib-brown-2);

    background:
        var(--ib-cream);

    border:
        1px solid
        rgba(96,49,25,.09);

    font-size:
        9px;

    font-weight:
        800;
}


/* ============================================================
   2025 DESTACADO
============================================================ */

.iberia-history__item--featured
.iberia-history__year{

    background:
        linear-gradient(
            135deg,
            #ff922b,
            #f05a00
        );

    box-shadow:
        0 10px 26px
        rgba(240,90,0,.30);
}


.iberia-history__item--featured
.iberia-history__card{

    background:

        radial-gradient(
            circle at 100% 0%,
            rgba(255,115,0,.08),
            transparent 27%
        ),

        #ffffff;

    border-color:
        rgba(240,90,0,.16);
}


/* ============================================================
   LICENCIAMIENTO
============================================================ */

.iberia-history__licensed{

    margin-top:18px;

    padding:
        13px 15px;

    display:flex;

    align-items:center;

    gap:11px;

    border-radius:13px;

    background:
        linear-gradient(
            135deg,
            rgba(255,115,0,.12),
            rgba(96,49,25,.05)
        );

    border:
        1px solid
        rgba(240,90,0,.15);
}


.iberia-history__licensed-icon{

    width:40px;
    height:40px;

    flex:0 0 40px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            var(--ib-orange-2),
            var(--ib-orange-dark)
        );
}


.iberia-history__licensed-icon svg{

    width:23px;
    height:23px;

    fill:currentColor;
}


.iberia-history__licensed div{

    display:flex;

    flex-direction:column;

    gap:2px;
}


.iberia-history__licensed small{

    color:
        var(--ib-orange);

    font-size:8px;

    font-weight:900;

    text-transform:uppercase;
}


.iberia-history__licensed strong{

    color:
        var(--ib-brown);

    font-size:12px;

    font-weight:900;
}


/* ============================================================
   CIERRE
============================================================ */

.iberia-history__closing{

    max-width:1000px;

    margin:
        55px auto 0;

    padding:
        26px 30px;

    display:flex;

    align-items:center;

    gap:18px;

    border-radius:20px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            var(--ib-orange-dark) 0%,
            var(--ib-orange) 40%,
            var(--ib-brown) 100%
        );

    box-shadow:
        0 15px 36px
        rgba(96,49,25,.16);
}


.iberia-history__closing-icon{

    width:58px;
    height:58px;

    flex:0 0 58px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:15px;

    color:
        var(--ib-orange);

    background:#ffffff;
}


.iberia-history__closing-icon svg{

    width:28px;
    height:28px;

    fill:currentColor;
}


.iberia-history__closing > div{

    display:flex;

    flex-direction:column;
}


.iberia-history__closing div > span{

    margin-bottom:4px;

    color:
        #ffd0ac;

    font-size:8.5px;

    font-weight:900;

    letter-spacing:1.3px;

    text-transform:uppercase;
}


.iberia-history__closing h3{

    margin:
        0 0 6px;

    color:#ffffff;

    font-size:18px;

    font-weight:900;
}


.iberia-history__closing p{

    margin:0;

    color:
        rgba(255,255,255,.80);

    font-size:12px;

    line-height:1.6;
}


/* ============================================================
   TABLET
============================================================ */

@media(max-width:850px){

    .iberia-history{

        padding:
            55px 17px 65px;
    }


    .iberia-history__timeline::before{

        left:43px;
    }


    .iberia-history__item{

        grid-template-columns:
            90px 1fr;
    }


    .iberia-history__year{

        width:70px;
        height:70px;
    }

}


/* ============================================================
   MÓVIL
============================================================ */

@media(max-width:600px){

    .iberia-history{

        padding:
            42px 14px 50px;
    }


    .iberia-history__heading{

        margin-bottom:30px;
    }


    .iberia-history__heading h2{

        font-size:29px;
    }


    .iberia-history__intro{

        margin-bottom:40px;

        padding:
            22px 19px;

        align-items:flex-start;
    }


    .iberia-history__intro-icon{

        width:50px;
        height:50px;

        flex-basis:50px;
    }


    .iberia-history__intro h3{

        font-size:17px;
    }


    .iberia-history__timeline{

        gap:18px;
    }


    .iberia-history__timeline::before{

        left:28px;
    }


    .iberia-history__item{

        grid-template-columns:
            65px 1fr;
    }


    .iberia-history__year{

        width:56px;
        height:56px;

        border-width:4px;

        border-radius:15px;
    }


    .iberia-history__year span{

        font-size:11px;
    }


    .iberia-history__card{

        min-height:0;

        padding:
            20px 17px;
    }


    .iberia-history__card h3{

        font-size:16px;
    }


    .iberia-history__card p{

        font-size:12px;
    }


    .iberia-history__closing{

        margin-top:38px;

        padding:
            22px 18px;

        align-items:flex-start;
    }


    .iberia-history__closing-icon{

        width:48px;
        height:48px;

        flex-basis:48px;
    }


    .iberia-history__closing h3{

        font-size:16px;
    }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-38dfab7 *//* ============================================================
   MENSAJE INSTITUCIONAL - FULL WIDTH
   IESTP IBERIA TAHUAMANU

   PALETA:
   NARANJA INTENSO + MARRÓN
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 {

  /* ==========================================================
     COLORES INSTITUCIONALES
  ========================================================== */

  --marron-oscuro: #3D1D0D;
  --marron: #5A2A14;
  --marron-medio: #75401F;

  --naranja-oscuro: #C94700;
  --naranja: #F05A00;
  --naranja-intenso: #FF6A00;
  --naranja-claro: #FF8A22;
  --naranja-suave: #FFF0E4;

  --crema: #FFF9F4;

  --color-texto: #685548;


  position: relative !important;

  isolation: isolate;


  /* ============================================
     FULL WIDTH
  ============================================ */

  width: 100vw !important;

  max-width: 100vw !important;

  left: 50% !important;

  margin-left: -50vw !important;

  margin-right: -50vw !important;


  display: grid !important;

  grid-template-columns:
    minmax(260px, 400px)
    minmax(0, 1fr);

  grid-template-areas:
    "imagen titulo"
    "imagen contenido";


  column-gap:
    clamp(36px, 5vw, 72px);

  row-gap: 0;


  align-items: start;


  overflow: hidden;


  padding:
    clamp(40px, 6vw, 84px);


  /* ==========================================================
     FONDO NARANJA + MARRÓN MUY SUAVE
  ========================================================== */

  background:

    radial-gradient(
      circle at 92% 12%,
      rgba(240, 90, 0, 0.13),
      transparent 27%
    ),

    radial-gradient(
      circle at 10% 90%,
      rgba(90, 42, 20, 0.055),
      transparent 28%
    ),

    linear-gradient(
      115deg,
      #FFFFFF 0%,
      #FFF9F4 52%,
      #FFF0E4 100%
    ) !important;
}


/* ============================================================
   SI ES UN CONTAINER DE ELEMENTOR
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7.e-con,
.e-con .elementor-96 .elementor-element.elementor-element-38dfab7 {

  width: 100vw !important;

  max-width: 100vw !important;

  flex-basis: 100vw !important;

  left: 50% !important;

  margin-left: -50vw !important;

  margin-right: -50vw !important;
}


/* ============================================================
   QUITAR LIMITACIÓN DEL CONTENEDOR INTERNO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 > .e-con-inner {

  width: 100% !important;

  max-width: none !important;

  margin: 0 !important;

  padding: 0 !important;
}


/* ============================================================
   ELEMENTOS INTERIORES
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen,
.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo,
.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido {

  width: 100%;

  max-width: 100%;

  min-width: 0;
}


/* ============================================================
   IMAGEN
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen {

  grid-area: imagen;

  align-self: stretch;
}


.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen .elementor-widget-container,
.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen a {

  display: block;

  height: 100%;
}


.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen img {

  display: block;

  width: 100%;

  height: 100%;

  min-height: 450px;


  object-fit: cover;

  object-position: center;


  border-radius: 24px;


  /* SOMBRA MARRÓN */

  box-shadow:

    0 20px 45px
    rgba(90, 42, 20, 0.18);


  transition:

    transform .45s ease,
    box-shadow .45s ease;
}


/* EFECTO SUAVE EN IMAGEN */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen:hover img {

  transform:
    translateY(-3px)
    scale(1.01);


  box-shadow:

    0 26px 55px
    rgba(90, 42, 20, 0.24);
}


/* ============================================================
   ENCABEZADO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo {

  grid-area: titulo;

  position: relative;

  padding-top: 82px;
}


/* ============================================================
   ETIQUETA
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo::before {

  content: "MENSAJE INSTITUCIONAL";


  position: absolute;

  top: 42px;

  left: 0;


  padding:

    8px 15px;


  border-radius:

    999px;


  /* NARANJA SUAVE */

  background:

    #FFF0E4;


  color:

    #D94B00;


  border:

    1px solid
    rgba(240, 90, 0, 0.17);


  font-size:

    10px;


  font-weight:

    800;


  line-height:

    1;


  letter-spacing:

    0.11em;


  white-space:

    nowrap;
}


/* ============================================================
   COMILLA DECORATIVA
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo::after {

  content: "“";


  position: absolute;


  top:

    -30px;


  left:

    -6px;


  /* NARANJA */

  color:

    rgba(240, 90, 0, 0.20);


  font-family:

    Georgia,
    "Times New Roman",
    serif;


  font-size:

    106px;


  font-weight:

    700;


  line-height:

    1;


  pointer-events:

    none;
}


/* ============================================================
   TÍTULO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo
:is(h1, h2, h3, h4, h5, h6) {

  margin: 0;


  /* MARRÓN OSCURO */

  color:

    #3D1D0D !important;


  font-size:

    clamp(
      34px,
      3.3vw,
      52px
    );


  font-weight:

    800;


  line-height:

    1.08;


  letter-spacing:

    -0.025em;
}


/* ============================================================
   LÍNEA DECORATIVA BAJO EL TÍTULO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo
:is(h1, h2, h3, h4, h5, h6)::after {

  content: "";


  display: block;


  width:

    82px;


  height:

    5px;


  margin-top:

    18px;


  border-radius:

    30px;


  background:

    linear-gradient(
      90deg,
      #FF6A00,
      #F05A00,
      #75401F
    );
}


/* ============================================================
   CONTENIDO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido {

  grid-area: contenido;


  margin-top:

    20px;


  color:

    var(--color-texto);
}


.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido p {

  margin:

    0 0 18px;


  color:

    inherit !important;


  font-size:

    15px;


  line-height:

    1.85;


  text-align:

    justify;
}


/* ============================================================
   NEGRITAS DEL TEXTO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido p strong {

  color:

    #5A2A14;


  font-weight:

    800;
}


/* ============================================================
   FIRMA / ÚLTIMO PÁRRAFO
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido p:last-child {

  margin:

    25px 0 0;


  padding-top:

    19px;


  border-top:

    1px solid
    rgba(240, 90, 0, 0.23);


  line-height:

    1.45;


  text-align:

    left;
}


/* NOMBRE */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido
p:last-child strong {

  color:

    #3D1D0D !important;


  font-weight:

    900;
}


/* ============================================================
   DETALLE PEQUEÑO EN FIRMA
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido p:last-child::before {

  content: "";


  display: block;


  width:

    48px;


  height:

    4px;


  margin-bottom:

    13px;


  border-radius:

    30px;


  background:

    linear-gradient(
      90deg,
      #FF6A00,
      #F05A00
    );
}


/* ============================================================
   TABLET
============================================================ */

@media (max-width: 1024px) {

  .elementor-96 .elementor-element.elementor-element-38dfab7 {

    grid-template-columns:

      minmax(240px, 38%)
      minmax(0, 1fr);


    column-gap:

      36px;


    padding:

      44px 28px;
  }


  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen img {

    min-height:

      420px;
  }

}


/* ============================================================
   CELULAR
============================================================ */

@media (max-width: 767px) {

  .elementor-96 .elementor-element.elementor-element-38dfab7 {

    grid-template-columns:

      minmax(0, 1fr);


    grid-template-areas:

      "imagen"
      "titulo"
      "contenido";


    padding:

      28px 20px 38px;


    /* FONDO RESPONSIVE */

    background:

      radial-gradient(
        circle at 100% 8%,
        rgba(240, 90, 0, 0.11),
        transparent 30%
      ),

      radial-gradient(
        circle at 0% 95%,
        rgba(90, 42, 20, 0.05),
        transparent 30%
      ),

      linear-gradient(
        160deg,
        #FFFFFF 0%,
        #FFF7F0 100%
      ) !important;
  }


  /* IMAGEN */

  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen,
  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen
  .elementor-widget-container,
  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen a {

    height:

      auto;
  }


  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-imagen img {

    height:

      clamp(
        260px,
        72vw,
        390px
      );


    min-height:

      0;


    border-radius:

      18px;
  }


  /* TÍTULO */

  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo {

    margin-top:

      18px;


    padding-top:

      78px;
  }


  /* COMILLA */

  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo::after {

    top:

      -24px;


    font-size:

      94px;
  }


  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-titulo
  :is(h1, h2, h3, h4, h5, h6) {

    font-size:

      clamp(
        30px,
        9vw,
        42px
      );
  }


  /* CONTENIDO */

  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido {

    margin-top:

      16px;
  }


  .elementor-96 .elementor-element.elementor-element-38dfab7 .mensaje-contenido p {

    font-size:

      14px;


    line-height:

      1.75;


    text-align:

      left;
  }

}


/* ============================================================
   TIPOGRAFÍA GENERAL
============================================================ */

.elementor-96 .elementor-element.elementor-element-38dfab7,
.elementor-96 .elementor-element.elementor-element-38dfab7 * {

  font-family:

    "Segoe UI",
    Arial,
    sans-serif !important;
}


/* ============================================================
   EVITAR SCROLL HORIZONTAL
============================================================ */

html,
body {

  overflow-x:

    hidden !important;
}/* End custom CSS */