.elementor-749 .elementor-element.elementor-element-52e8a291{--display:flex;}/* Start custom CSS for html, class: .elementor-element-bc6d954 *//* ============================================================
   IESTP ENRIQUE PABLO MEJÍA TUPAYACHI
   MISIÓN + VISIÓN + VALORES
   PALETA 100% AZUL
============================================================ */

.ep-blue-section,
.ep-blue-section *,
.ep-blue-section *::before,
.ep-blue-section *::after{
    box-sizing:border-box;
}


/* ============================================================
   VARIABLES
============================================================ */

.ep-blue-section{

    --blue-950:#031a30;
    --blue-900:#05294b;
    --blue-850:#07365f;
    --blue-800:#074577;
    --blue-700:#075d97;
    --blue-600:#0b76b7;
    --blue-500:#1591d0;
    --blue-400:#43a8db;
    --blue-300:#89c9e9;
    --blue-200:#c5e5f5;
    --blue-100:#e9f5fb;
    --blue-50:#f5fafe;

    --text:#28455d;
    --muted:#647d91;

    width:100%;

    padding:
        75px 20px 85px;

    font-family:
        "Roboto",
        Arial,
        sans-serif;

    color:var(--text);

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(21,145,208,.10),
            transparent 27%
        ),
        radial-gradient(
            circle at 100% 45%,
            rgba(7,93,151,.07),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7fbfe 100%
        );
}


.ep-blue-container{

    width:100%;

    max-width:1320px;

    margin:0 auto;
}


/* ============================================================
   CABECERAS
============================================================ */

.ep-blue-heading,
.ep-values-heading{

    max-width:760px;

    margin:
        0 auto 45px;

    text-align:center;
}


.ep-blue-eyebrow{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-height:30px;

    padding:
        0 15px;

    margin-bottom:
        14px;

    border-radius:50px;

    color:var(--blue-700);

    background:var(--blue-100);

    border:
        1px solid
        var(--blue-200);

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        1.7px;

    text-transform:
        uppercase;
}


.ep-blue-heading h2,
.ep-values-heading h2{

    margin:0;

    color:var(--blue-900);

    font-size:
        clamp(30px,3.5vw,43px);

    font-weight:900;

    line-height:1.1;

    letter-spacing:-1px;
}


.ep-blue-heading p,
.ep-values-heading p{

    max-width:650px;

    margin:
        14px auto 0;

    color:var(--muted);

    font-size:14px;

    line-height:1.75;
}


.ep-blue-line{

    display:block;

    width:78px;

    height:4px;

    margin:
        19px auto 0;

    border-radius:30px;

    background:
        linear-gradient(
            90deg,
            var(--blue-400),
            var(--blue-700),
            var(--blue-900)
        );
}


/* ============================================================
   MISIÓN + VISIÓN GRID
============================================================ */

.ep-mv-grid{

    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    align-items:stretch;

    gap:26px;
}


/* ============================================================
   TARJETA MISIÓN / VISIÓN
============================================================ */

.ep-mv-card{

    position:relative;

    height:100%;

    padding:
        31px 31px 32px;

    overflow:hidden;

    border-radius:22px;

    background:#ffffff;

    border:
        1px solid
        rgba(7,69,119,.10);

    box-shadow:
        0 13px 35px
        rgba(5,41,75,.08);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


/* LÍNEA SUPERIOR */

.ep-mv-card::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:5px;

    background:
        linear-gradient(
            90deg,
            var(--blue-400),
            var(--blue-700),
            var(--blue-900)
        );
}


.ep-mv-card::after{

    content:"";

    position:absolute;

    width:180px;
    height:180px;

    right:-90px;
    bottom:-95px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(21,145,208,.08),
            transparent 68%
        );

    pointer-events:none;
}


.ep-mv-card:hover{

    transform:
        translateY(-7px);

    border-color:
        rgba(21,145,208,.27);

    box-shadow:
        0 22px 48px
        rgba(5,41,75,.13);
}


/* ============================================================
   CABECERA MISIÓN / VISIÓN
============================================================ */

.ep-mv-card__top{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:23px;
}


.ep-mv-icon{

    width:58px;
    height:58px;

    flex:0 0 58px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:16px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            var(--blue-500),
            var(--blue-800)
        );

    box-shadow:
        0 9px 20px
        rgba(7,93,151,.20);
}


.ep-mv-icon svg{

    width:27px;
    height:27px;

    fill:currentColor;
}


.ep-mv-label{

    display:block;

    margin-bottom:4px;

    color:var(--blue-500);

    font-size:9.5px;

    font-weight:900;

    letter-spacing:1.2px;

    text-transform:uppercase;
}


.ep-mv-card h3{

    margin:0;

    color:var(--blue-900);

    font-size:22px;

    font-weight:900;

    line-height:1.2;
}


/* ============================================================
   TEXTO
============================================================ */

.ep-mv-card__content{

    position:relative;

    z-index:2;
}


.ep-mv-card__content p{

    margin:
        0 0 14px;

    color:var(--muted);

    font-size:13.5px;

    line-height:1.75;

    text-align:justify;
}


.ep-mv-card__content p:last-child{

    margin-bottom:0;
}


/* NÚMERO DECORATIVO */

.ep-mv-card__number{

    position:absolute;

    right:24px;
    top:24px;

    color:
        rgba(7,93,151,.075);

    font-size:43px;

    font-weight:900;

    line-height:1;
}


/* ============================================================
   LOGO CENTRAL
============================================================ */

.ep-logo-area{

    display:grid;

    grid-template-columns:
        1fr auto 1fr;

    align-items:center;

    gap:25px;

    margin:
        55px 0 65px;
}


.ep-logo-line{

    display:block;

    width:100%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--blue-200)
        );
}


.ep-logo-line:last-child{

    background:
        linear-gradient(
            90deg,
            var(--blue-200),
            transparent
        );
}


.ep-logo-card{

    width:230px;

    min-height:115px;

    padding:18px 24px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px;

    background:#ffffff;

    border:
        1px solid
        rgba(7,69,119,.10);

    box-shadow:
        0 12px 30px
        rgba(5,41,75,.08);
}


.ep-logo-card img{

    display:block;

    width:100% !important;

    height:auto !important;

    max-height:90px;

    object-fit:contain;

    margin:0 !important;

    filter:
        drop-shadow(
            0 5px 10px
            rgba(5,41,75,.12)
        );
}


/* ============================================================
   VALORES
============================================================ */

.ep-values-heading{

    margin-bottom:38px;
}


.ep-values-grid{

    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    align-items:stretch;

    gap:20px;
}


/* ÚLTIMA TARJETA CENTRADA */

.ep-value-card--last{

    grid-column:
        2 / 4;
}


/* ============================================================
   TARJETA VALOR
============================================================ */

.ep-value-card{

    position:relative;

    height:100%;

    min-height:255px;

    padding:
        27px 23px 25px;

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    overflow:hidden;

    border-radius:19px;

    background:#ffffff;

    border:
        1px solid
        rgba(7,69,119,.09);

    box-shadow:
        0 10px 29px
        rgba(5,41,75,.07);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.ep-value-card::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;

    height:4px;

    background:
        linear-gradient(
            90deg,
            var(--blue-400),
            var(--blue-700)
        );
}


.ep-value-card:hover{

    transform:
        translateY(-7px);

    border-color:
        rgba(21,145,208,.25);

    box-shadow:
        0 18px 40px
        rgba(5,41,75,.12);
}


/* ============================================================
   ICONO VALOR
============================================================ */

.ep-value-icon{

    width:61px;
    height:61px;

    flex:0 0 61px;

    margin-bottom:17px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:17px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            var(--blue-500),
            var(--blue-800)
        );

    box-shadow:
        0 9px 19px
        rgba(7,93,151,.18);

    transition:
        transform .3s ease;
}


.ep-value-card:hover
.ep-value-icon{

    transform:
        scale(1.07)
        rotate(-3deg);
}


.ep-value-icon svg{

    width:27px;
    height:27px;

    fill:currentColor;
}


/* ============================================================
   TEXTO DE VALORES
============================================================ */

.ep-value-card h3{

    min-height:42px;

    margin:
        0 0 11px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--blue-900);

    font-size:17px;

    font-weight:900;

    line-height:1.2;
}


.ep-value-card p{

    margin:0;

    color:var(--muted);

    font-size:12.5px;

    line-height:1.65;

    text-align:center;
}


/* ============================================================
   NÚMERO VALOR
============================================================ */

.ep-value-number{

    position:absolute;

    top:17px;
    right:18px;

    color:
        rgba(7,93,151,.08);

    font-size:26px;

    font-weight:900;
}


/* ============================================================
   TABLET
============================================================ */

@media(max-width:1050px){

    .ep-blue-section{

        padding:
            60px 18px 70px;
    }


    .ep-values-grid{

        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }


    .ep-value-card--last{

        grid-column:auto;
    }

}


/* ============================================================
   TABLET VERTICAL
============================================================ */

@media(max-width:800px){

    .ep-mv-grid{

        grid-template-columns:1fr;
    }


    .ep-values-grid{

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .ep-logo-area{

        margin:
            45px 0 55px;
    }

}


/* ============================================================
   MÓVIL
============================================================ */

@media(max-width:560px){

    .ep-blue-section{

        padding:
            43px 14px 50px;
    }


    .ep-blue-heading,
    .ep-values-heading{

        margin-bottom:30px;
    }


    .ep-blue-heading h2,
    .ep-values-heading h2{

        font-size:28px;
    }


    .ep-mv-card{

        padding:
            26px 20px 24px;
    }


    .ep-mv-card__top{

        align-items:flex-start;
    }


    .ep-mv-icon{

        width:50px;
        height:50px;

        flex-basis:50px;
    }


    .ep-mv-card h3{

        font-size:19px;
    }


    .ep-mv-card__content p{

        font-size:13px;

        text-align:left;
    }


    .ep-logo-area{

        grid-template-columns:1fr;

        margin:
            38px 0 48px;
    }


    .ep-logo-line{

        display:none;
    }


    .ep-logo-card{

        width:220px;

        margin:0 auto;
    }


    .ep-values-grid{

        grid-template-columns:1fr;

        gap:16px;
    }


    .ep-value-card{

        min-height:0;

        padding:
            25px 20px 23px;
    }


    .ep-value-card h3{

        min-height:0;
    }

}/* End custom CSS */