/* MENU - Estilos reutilizables para menu-1 y menu-2 */

/* 1. Large Screens (> 1367px) */
@media (min-width: 1367px) {
    .encabezado {
        display: flex;
        width: 100%;
        height: 70px;
        justify-content: center;
        align-items: center;
    }

    .menu-1 {
        position: fixed;
        z-index: 6;
        display: flex;
        width: 95%;
        height: 70px;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        justify-content: center;
        align-items: center;
        gap: 20px;
        border-radius: 0 0 20px 20px;
    }

    .modulo-m1 {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 20px;
    }

    .bloque-m11 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .icono-m1111 {
        height: 30px;
    }


    .bloque-m13 {
        display: flex;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .contenido-m131 {
        text-decoration: none;
        font-family: 'Regular';
        font-size: 15px;
        color: #213242;
    }

    .bloque-m14 {
        display: flex;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .contenido-m141 {
        display: flex;
        width: 320px;
        height: 40px;
        background-color: #f7f8f8;
        color: #213242;
        justify-content: center;
        align-items: center;
        border-radius: 7px;
        text-decoration: none;
        font-family: 'Negrita';
        font-size: 15px;
        text-align: center;
    }

    .contenido-m141:hover {
        background-color: #213242;
        color: #fff;
    }

    .contenido-m142 {
        display: flex;
        width: 200px;
        height: 40px;
        background-color: #e1b783;
        justify-content: center;
        align-items: center;
        border-radius: 7px;
        text-decoration: none;
        color: #213242;
        font-family: 'Negrita';
        font-size: 15px;
    }

    .contenido-m142:hover {
        background-color: #213242;
        color: #fff;
    }

    .modulo-m2 {
        display: none;
    }

    .contenido-m21,
    .contenido-m22,
    .contenido-m23,
    .contenido-m24,
    .contenido-m25 {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

/* 2. Desktop (1281px - 1366px) */
@media (min-width: 1281px) and (max-width: 1366px) {
    .encabezado {
        display: flex;
        width: 100%;
        height: 70px;
        justify-content: center;
        align-items: center;
    }

    .menu-1 {
        position: fixed;
        z-index: 6;
        display: flex;
        width: 95%;
        height: 70px;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        justify-content: center;
        align-items: center;
        gap: 20px;
        border-radius: 0 0 20px 20px;
    }

    .modulo-m1 {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 20px;
    }

    .bloque-m11 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .icono-m1111 {
        height: 30px;
    }


    .bloque-m13 {
        display: flex;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .contenido-m131 {
        text-decoration: none;
        font-family: 'Regular';
        font-size: 15px;
        color: #213242;
    }

    .bloque-m14 {
        display: flex;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .contenido-m141 {
        display: flex;
        width: 320px;
        height: 40px;
        background-color: #f7f8f8;
        color: #213242;
        justify-content: center;
        align-items: center;
        border-radius: 7px;
        text-decoration: none;
        font-family: 'Negrita';
        font-size: 15px;
        text-align: center;
    }

    .contenido-m141:hover {
        background-color: #213242;
        color: #fff;
    }

    .contenido-m142 {
        display: flex;
        width: 200px;
        height: 40px;
        background-color: #e1b783;
        justify-content: center;
        align-items: center;
        border-radius: 7px;
        text-decoration: none;
        color: #213242;
        font-family: 'Negrita';
        font-size: 15px;
    }

    .contenido-m142:hover {
        background-color: #213242;
        color: #fff;
    }

    .modulo-m2 {
        display: none;
    }

    .contenido-m21 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .contenido-m22 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .contenido-m23 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .contenido-m24 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .contenido-m25 {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

/* 3. Laptop (1025px - 1280px) */
@media (min-width: 1025px) and (max-width: 1280px) {
    .encabezado {
        display: flex;
        width: 100%;
        height: 70px;
        justify-content: center;
        align-items: center;
    }

    .menu-1 {
        position: fixed;
        z-index: 6;
        display: flex;
        width: 95%;
        height: 70px;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        justify-content: center;
        align-items: center;
        gap: 20px;
        border-radius: 0 0 20px 20px;
    }

    .modulo-m1 {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 20px;
    }

    .bloque-m11 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .icono-m1111 {
        height: 30px;
    }



    .bloque-m13 {
        display: flex;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .contenido-m131 {
        text-decoration: none;
        font-family: 'Regular';
        font-size: 15px;
        color: #213242;
    }

    .bloque-m14 {
        display: flex;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .contenido-m141 {
        display: flex;
        width: 320px;
        height: 40px;
        background-color: #f7f8f8;
        color: #213242;
        justify-content: center;
        align-items: center;
        border-radius: 7px;
        text-decoration: none;
        font-family: 'Negrita';
        font-size: 15px;
        text-align: center;
    }

    .contenido-m141:hover {
        background-color: #213242;
        color: #fff;
    }

    .contenido-m142 {
        display: flex;
        width: 200px;
        height: 40px;
        background-color: #e1b783;
        justify-content: center;
        align-items: center;
        border-radius: 7px;
        text-decoration: none;
        color: #213242;
        font-family: 'Negrita';
        font-size: 15px;
    }

    .contenido-m142:hover {
        background-color: #213242;
        color: #fff;
    }

    .modulo-m2 {
        display: none;
    }
}

/* 4. Tablet (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .encabezado {
        display: flex;
        width: 100%;
        height: 70px;
        justify-content: center;
        align-items: center;
    }

    .menu-1 {
        position: fixed;
        z-index: 6;
        display: flex;
        width: 100%;
        height: 70px;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        justify-content: space-between;
        align-items: center;
        padding: 0 5%;
        gap: 20px;
        border-radius: 0 0 20px 20px;
    }

    .modulo-m1 {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        gap: 20px;
    }

    .bloque-m11 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .icono-m1111 {
        height: 25px;
    }



    .bloque-m13 {
        display: none;
    }

    .bloque-m14 {
        display: none;
    }

    .modulo-m2 {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 70px;
        background-color: #213242;
        justify-content: center;
        align-items: center;
        gap: 40px;
        z-index: 6;
    }

    .contenido-m21,
    .contenido-m22,
    .contenido-m23,
    .contenido-m24,
    .contenido-m25 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50px;
        height: 50px;
        text-decoration: none;
        transition: transform 0.2s;
    }

    .contenido-m21:hover,
    .contenido-m22:hover,
    .contenido-m23:hover,
    .contenido-m24:hover,
    .contenido-m25:hover {
        transform: scale(1.1);
    }

    .icono-m211,
    .icono-m221,
    .icono-m231,
    .icono-m241,
    .icono-m251 {
        width: 30px;
        height: 30px;
        fill: white;
    }
}

/* 5. Mobile (481px - 767px) */
@media (min-width: 481px) and (max-width: 767px) {
    .encabezado {
        display: flex;
        width: 100%;
        height: 70px;
        justify-content: center;
        align-items: center;
        background-color: #f7f8f8;
    }

    .menu-1 {
        position: fixed;
        z-index: 6;
        display: flex;
        width: 100%;
        height: 70px;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        justify-content: space-between;
        align-items: center;
        padding: 0 5%;
        gap: 20px;
        border-radius: 0 0 20px 20px;
    }

    .modulo-m1 {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        gap: 20px;
    }

    .bloque-m11 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .icono-m1111 {
        height: 25px;
    }



    .bloque-m13 {
        display: none;
    }

    .bloque-m14 {
        display: none;
    }

    .modulo-m2 {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 65px;
        background-color: #213242;
        justify-content: center;
        align-items: center;
        gap: 40px;
        z-index: 6;
    }

    .contenido-m21,
    .contenido-m22,
    .contenido-m23,
    .contenido-m24,
    .contenido-m25 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50px;
        height: 50px;
        text-decoration: none;
        transition: transform 0.2s;
    }

    .contenido-m21:hover,
    .contenido-m22:hover,
    .contenido-m23:hover,
    .contenido-m24:hover,
    .contenido-m25:hover {
        transform: scale(1.1);
    }

    .icono-m211,
    .icono-m221,
    .icono-m231,
    .icono-m241,
    .icono-m251 {
        width: 26px;
        height: 26px;
    }
}

/* 6. Mobile Small (320px - 480px) */
@media (min-width: 320px) and (max-width: 480px) {
    .encabezado {
        display: flex;
        width: 100%;
        height: 70px;
        justify-content: center;
        align-items: center;
        background-color: #f7f8f8;
    }

    .menu-1 {
        position: fixed;
        z-index: 6;
        display: flex;
        width: 100%;
        height: 70px;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        justify-content: space-between;
        align-items: center;
        padding: 0 5%;
        gap: 20px;
        border-radius: 0 0 20px 20px;
    }

    .modulo-m1 {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        gap: 20px;
    }

    .bloque-m11 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .icono-m1111 {
        height: 25px;
    }


    .bloque-m13 {
        display: none;
    }

    .bloque-m14 {
        display: none;
    }

    .modulo-m2 {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 60px;
        background-color: #213242;
        justify-content: center;
        align-items: center;
        gap: 15px;
        z-index: 6;
    }

    .contenido-m21,
    .contenido-m22,
    .contenido-m23,
    .contenido-m24,
    .contenido-m25 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 45px;
        height: 45px;
        text-decoration: none;
        transition: transform 0.2s;
    }

    .contenido-m21:hover,
    .contenido-m22:hover,
    .contenido-m23:hover,
    .contenido-m24:hover,
    .contenido-m25:hover {
        transform: scale(1.1);
    }

    .icono-m211,
    .icono-m221,
    .icono-m231,
    .icono-m241,
    .icono-m251 {
        width: 28px;
        height: 28px;
    }
}