/* Paleta de colores */
    :root{
        /* Pricipales */
        --Primario:#13226E;
        --Secundario:#CA3030;
        --info:#2194F3;
        --Fonts: #FFFFFF;

        /* Accion */
        --Warning:#FBC02D;
        --Warning2:#fbc12d49;
        --Error:#E53835;
        --Success:#2E7D31;

        /* Neutral */
        --Neutral-1:#263238;
        --Neutral-2:#4D4D4D;
        --Neutral-3:#717171;
        --Neutral-4:#89939E;
        --Neutral-5:#ABBED1;
        --Neutral-6:#F5F7FA;

        /* Sombras */
        --Shadow-1:#111F63;
        --Shadow-2:#0F1B58;
        --Shadow-3:#0D184D;
        --Shadow-4:#0B1442;
        --Shadow-5:#0A1137;
        --Shadow-7:rgba(14, 24, 124, 0.822);

        /* Tintas */
        --Shadow-1:#2B387D;
        --Shadow-2:#424E8B;
        --Shadow-3:#5A649A;
        --Shadow-4:#717AA8;
        --Shadow-5:#8991B7;
        --Shadow-6:rgba(206, 226, 243,0.2);
    }

/* Parametros globales */

@font-face {
    font-family: 'Poppins';
    src: url('../Fonts/Poppins/Poppins-Regular.ttf') format('truetype');
    font-style: normal;
}


.body{
    max-width: 2560px;
    min-width: 375px;
    font-variant-ligatures: none; /* Evita ligaduras que puedan alterar caracteres */
    text-rendering: optimizeLegibility; /* Asegura la mejor renderización de texto */
}

.is-flex{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

/* Header Section */

    .header{
        margin-bottom: 0.5rem;
        padding: 0.5em 0.2em;
        justify-content: space-between;
    }
        .header__nav{
            gap: 0.15em;
        }
            .header__nav--a{
                font-size: 0.65em;
                padding: 0.28em;
                text-align: center;
            }

            .header__nav--a:nth-child(1){
                background-color: var(--Secundario);
                color: var(--Fonts);
                font-size: 0.7em;
                width: 4.1em;
                border-radius: 4em;
            }

            .header__nav--a:nth-child(2){
                border-radius: 5em;
                background-color: var(--Primario);
                color: var(--Fonts);
                font-size: 0.7em;
                border-radius: 5em;
            }

            .header div:nth-child(1){
                width: 7.5vw;
            }

            .header div:nth-child(3){
                padding: 0.2em ;
                display: flex;
                gap: 0.20em;
            }

            .header__div--a:nth-child(1){
                background-color: var(--Neutral-6);
                padding: 0.2em ;
                border-radius: 5em;
            }
            .header__div--a:nth-child(2){
                background-color: var(--Success);
                color: var(--Fonts);
                border-radius: 5em;
                padding: 0.2em ;
            }
            
            .header__div--a__span{
                font-size: 0.65em;
                font-weight: 500;
            }
                .header__div--a__img{
                    width: 0.95em;
                    filter: brightness(0);
                }

                .header__div--a:nth-child(2){
                    gap: 0.2em;
                }

                .header__div--a__img:nth-child(2){
                    filter: invert(1) brightness(2);
                }

/* Seccion Hero*/
    .hero{
        display: none;
    }

/* Seccion de servicos */

    .Servicios-container{
        text-align: center;
        position: relative;
    }

        .Servicios-container__label{
            font-size: 0.9em;
            font-weight: 600;
            color: black;
            position: absolute;
            background-color: var(--Warning);
            border-radius: 0.25em ;
            left:0;
            width: 10em;
            text-align: center;
        }

        .Servicios-container__div{
            background-color: var(--Neutral-6);
            box-shadow: 1px 1px 2px var(--Neutral-3);
            border-radius: 0.25em;
            margin-bottom: 3em ;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 5px;
        }

        .Servicios-container__div img{
            width: calc(25% - 5px); /* Ajusta el porcentaje según el diseño */
            max-width: 300px;
            height: auto;
            display: block;
        }

        .Servicios-container__div video {
            width: calc(25% - 5px); /* Ajusta el porcentaje según el diseño */
            max-width: 300px;
            height: auto;
            display: block;
        }
      
        .Servicios-container__button{
            position: fixed;
            bottom: 15rem;
            right: 10px;
            width: 35px;
            height: 35px;
            background-image: url(/Icons/arrow-narrow-up-svgrepo-com.svg) ;
            background-size: 70%;
            background-repeat: no-repeat;
            background-position: center;
            background-color: var(--Warning);
            border: none;
            border-radius: 10px;
            cursor: pointer;
            box-shadow: 0 10px 0 var(--Warning2);
            transition: 
                        transform 0.3s,
                        box-shadow 0.3s
        }
            .Servicios-container__button{
                transform: translateY(10px);
                box-shadow: none;
            }
    

/* Footer */

/* Seccion footerUP*/

.footerUP__section {
    background-color: var(--Shadow-7);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 0.5rem;
}

.footerUP__section--div{
    color: white;
}

.footerUP__section--div:nth-child(1){
    align-content: center;
    justify-self: center;
    color: var(--Fonts);
    font-weight: 300;
    width: 8em;
}

.footerUP__section--div:nth-child(1) h3 {
    font-size: 0.8em;
    font-weight: 600;
    margin: 0 0 1em 0;
}

.footerUP__section--div:nth-child(1) .footerUP__section--div__span:nth-child(2){
    font-size: 0.7em;
    font-weight: 500;
    background-color: var(--info);
    border-radius: 0.2em;
    display: block;
    text-align: center;
    width: 11em;
}

.footerUP__section--div:nth-child(1) img{
    width: 3em;
    margin-top: 1em;
    justify-self: center;
}

.footerUP__section--div:nth-child(1) .footerUP__section--div__span:nth-child(4){
    word-break: break-all;
    text-align: justify;
    font-size: 0.7em;
    padding: 0.2em;
}

.footerUP__section--div:nth-child(2) {
    word-break: break-all;
    width: 7.8em;
}

.footerUP__section--div:nth-child(2) h3 {
    font-size: 0.9em;
    font-weight: 600;
}

.footerUP__section--div:nth-child(2) ul {
    margin-top: 0;
    padding-left: 0.4em;
    padding-top: 0.2em;
}

.footerUP__section--div:nth-child(2) li {
    font-size: 0.75em;
}

.footerUP__section--div:nth-child(3) {
    width: 7em;
    justify-items: center;
    align-content: center;
}

.footerUP__section--div:nth-child(3) h3 {
    margin-top: 0.4rem;
    font-size: 1em;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.footerUP__section--div--a {
    border: none;
    width: 9em;
    padding: 0;
    font-size: 0.7em;
    background-color: var(--Secundario);
    border-radius: 5em;
    justify-content: center;
    color: var(--Fonts);
    font-weight: 400;
    display: flex;
}

.footerUP__section--div--a:hover {
    background-color: var(--info);
}


.footerUP__section--div--a__img {
    width: 1em;
    filter: brightness(0);
}

.footerUP__section--div:nth-child(4) {
    display: none;
}


.footerDiv {
    background-color: var(--Warning);
    height: 1.5rem;
}

.footerBottom__section {
    background-color: var(--Neutral-2);
    height: fit-content;
    text-align: center;
    color: var(--Fonts);
    font-size: 0.7em;
}