/* Fuentes Montserrat (optimizadas para carga) */
@font-face {
    font-family: 'MonReg';
    src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
    font-display: swap; /* Mejora rendimiento */
}
@font-face {
    font-family: 'MonThi';
    src: url('../fonts/Montserrat-Thin.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'MonBla';
    src: url('../fonts/Montserrat-Black.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'MonSBo';
    src: url('../fonts/Montserrat-SemiBold.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'MonLig';
    src: url('../fonts/Montserrat-Light.ttf') format('truetype');
    font-display: swap;
}

/* Estilos base responsivos */
body {
    background-color: #fff;
    font-family: 'MonReg', sans-serif;
    margin: 0;
    padding: 0;
    line-height: 1.6;
}

/* Tipografía escalable */
h2 {
    font-family: 'MonReg', sans-serif;
    font-size: clamp(1.5rem, 5vw, 3.125rem); /* 24px a 50px */
    opacity: 0.7;
}

h3 {
    color: #fff;
    font-family: 'MonReg', sans-serif;
    font-size: clamp(1.2rem, 3vw, 1.5rem);
    opacity: 0.7;
}

h4 {
    color: #000;
    font-family: 'MonReg', sans-serif;
    font-size: clamp(1rem, 2.5vw, 1.25rem);
    opacity: 0.7;
}

p {
    font-family: 'MonReg', sans-serif;
    font-size: clamp(0.9rem, 2vw, 1rem);
    text-align: justify;
}
g{
    margin: 1%;
    padding: 1%;
}
a{
    text-decoration: none;
}


/* Secciones adaptables */

#sec {
    margin: clamp(2rem, 2.5vw, 4rem);
    padding: clamp(2rem, 2.5vw, 4rem);
    background-color: #eaeaea;
    border-radius: 8px;
    margin-bottom: 10px;
    position: relative;
    text-align: center;
}
#sec2 {
    margin: clamp(0.5rem, 0.5vw, 1rem);
    padding: clamp(0.5rem, 1vw, 1rem);
    background-color: #eaeaea;
    border-radius: 8px;
    margin-bottom: 10px;
    position: relative;
    text-align: center;
}
#sec3 {
    margin: clamp(4rem, 5vw, 7rem);
    padding: clamp(0.5rem, 1vw, 1rem);
    background-color: #eaeaea;
    border-radius: 8px;
    margin-top: 1vh;
    margin-bottom: 1vh;
    position: relative;
    text-align: center;
}
/* Divisor flexible */
.divisor {
    display:grid;
    padding: clamp(0.5rem, 2vw, 1rem);
    flex-wrap: wrap;
    text-align: justify;
}


.divA {
    display: flex;
    justify-content: center;
    padding: 7px;
    gap: clamp(0.5rem, 2vw, 1rem);
    flex-wrap: wrap;
    background-color:#fff ;
    min-width: 20dvw;
    max-width: 40dvw;
    height: 20dvw;
}
.divB{
    padding: 1px;
    background-color: #00000034;
    width: fit-content;
    height: auto;
    display: inline-block;
}


.frM{
    min-width: 30dvw;
    max-width: 50dvw;
    min-height: 50dvh;
    max-height: 60dvh;
    border-radius: 10%;
}

.imgA{
    width: 100%;
    height: auto;
    border-radius: 15px;
}
.imgB{
    height: 100%;
    min-width: 11dvw;
    max-width: 28dvw;
}
.imgC{
    height: auto;
    min-width: 20dvw;
    max-width: 40dvw;
}
.imgD{
    height: 100%;
    min-width: 8dvw;
    max-width: 18dvw;
    border-radius: 50%;
}

.imgE{
    height: auto;
    min-width: 20dvw;
    max-width: 85dvw;
}

.containerS{
    display: flex;                   /* Activa Flexbox */
    justify-content: center;         /* Centra los logos horizontalmente */
    align-items: center;             /* Alinea verticalmente */
    gap: 20px;                       /* Espacio entre logos */
    flex-wrap: wrap;                 /* Permite que los logos salten a otra línea si no caben */
    padding: 0 0;                    /* Eliminar relleno extra */
    margin: 0 0; 
}

a:hover{
    opacity: 0.6;
}


/* Media Queries para ajustes específicos */
@media (max-width: 768px) {
    /* Ajustes para tablets y móviles */
    #sec2 h2 {
        font-size: 2rem; /* Reduce tamaño en móviles */
    }

    .hero-section, #sec {
        margin: 0.5rem;
        border-radius: 5px;
    }
}

@media (max-width: 480px) {
    /* Ajustes para móviles pequeños */
    body {
        font-size: 14px;
    }

    .divisor {
        flex-direction: column; /* Apila elementos en móviles */
        align-items: center;
    }
}

/* Sangrado de Texto para viñetas */
.lista-colgada {
    list-style-type: disc;       /* viñetas */
    list-style-position: outside; /* viñetas colgadas */
    padding-left: 50px;           /* distancia del borde izquierdo */
}

.lista-colgada li {
    margin-bottom: 10px;         /* espacio entre ítems */
}

.lista-colgada ol {
    margin-bottom: 5px;         /* espacio entre ítems */
}