*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family: Arial, sans-serif;
}

/* ========================= */
/* BARRA SUPERIOR */
/* ========================= */

.top-info-bar{
    background:#062b66;
    color:white;
    padding:10px 40px;
}

.top-left-group{
    justify-content:right;
    display:flex;
    align-items:center;
    gap:25px;
}

.buzon-link{
    color:white;
    text-decoration:none;
}

.right-social{
    display:flex;
    gap:20px;
}

.right-social a{
    color:white;
    font-size:22px;
}

/* ========================= */
/* HEADER */
/* ========================= */

.top-bar{
    background:#0b3d91;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 40px;
}

.logo-container{
    display:flex;
    align-items:center;
    gap:15px;
    color:white;
    filter:drop-shadow(0 15px 30px rgba(0,0,0,0.25));
}

.logo-container img{
    width:90px;
    filter:drop-shadow(0 15px 30px rgba(0,0,0,0.25));
}

/* ========================= */
/* MENÚ */
/* ========================= */

.menu-center{
    flex:1;
    display:flex;
    justify-content:right;
}

.menu-center ul{
    list-style:none;
    display:flex;
    gap:1px;
}

.menu-center ul li{
    position:relative;
}

.menu-center ul li a{
    color:white;
    text-decoration:none;
    font-weight:bold;
    padding:10px;
}

/* ========================= */
/* DROPDOWN */
/* ========================= */

.dropdown-menu{
    display:none !important;
    position:absolute;
    top:100%;
    left:0;
    background:white;
    min-width:230px;
    border-radius:10px;
    box-shadow:0 4px 12px rgba(0,0,0,0.15);
    z-index:999;
}

.dropdown-menu li a{
    color:#0b3d91 !important;
    display:block;
    padding:12px 15px;
}

.dropdown:hover .dropdown-menu{
    display:block !important;
}

/* ========================= */
/* HERO */
/* ========================= */

.hero-slider{

    position:relative;

    width:100%;
    height:100vh;

    overflow:hidden;

    background:black;
}

/* VIDEO */

.hero-video{

    position:absolute;

    top:0;
    
    left:0;

    width:105%;
    height:115%;

    object-fit:contain;

    background:black;

    z-index:1;
}

/* CAPA OSCURA */

.hero-dark-overlay{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,0.35);

    z-index:2;
}

/* DIFUMINADO IZQUIERDO */

.hero-fade{

    position:absolute;

    top:0;
    left:0;

    width:35%;
    height:100%;

    background:linear-gradient(
        to right,
        rgba(255,255,255,0.95) 0%,
        rgba(255,255,255,0.82) 25%,
        rgba(255,255,255,0.45) 55%,
        rgba(255,255,255,0) 100%
    );

    z-index:0;
}

/* LOGO */

.floating-logo{

    position:absolute;

    top:180px;
    left:90px;

    z-index:5;

    animation:floatLogo 5s ease-in-out infinite;
}

.floating-logo img{

    width:340px;

    filter:drop-shadow(
        0 15px 30px rgba(0,0,0,0.35)
    );
}

/* ANIMACIÓN */

@keyframes floatLogo{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-10px);
    }

    100%{
        transform:translateY(0px);
    }
}

/* OVERLAY */

.overlay{

    position:relative;

    z-index:4;

    width:100%;
    height:100%;

    display:flex;

    align-items:center;

    padding-left:70px;
}

/* CONTENIDO */

.hero-content{

    max-width:720px;

    margin-left:500px;
    margin-top:120px;

    padding:50px;

    border-radius:35px;

    background:rgba(255,255,255,0.22);

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    box-shadow:
    0 15px 40px rgba(0,0,0,0.18);

    color:#0b3d91;
}

/* TITULO */

.hero-content h1{

    font-size:64px;

    line-height:1.1;

    margin-bottom:25px;

    font-weight:800;
}

/* TEXTO */

.hero-content p{

    font-size:28px;

    line-height:1.7;

    margin-bottom:35px;

    color:#1d1d1d;
}

/* BOTÓN */

#btnConocenos{

    background:#0b3d91;

    color:white;

    border:none;

    padding:18px 42px;

    border-radius:14px;

    font-size:18px;

    font-weight:bold;

    cursor:pointer;

    transition:0.35s;
}

#btnConocenos:hover{

    background:#062b66;

    transform:
    translateY(-5px)
    scale(1.03);

    box-shadow:
    0 12px 25px rgba(0,0,0,0.20);
}

/* RESPONSIVE */

@media(max-width:1100px){

    .floating-logo{

        left:50%;

        transform:translateX(-50%);
    }

    .floating-logo img{

        width:220px;
    }

    .hero-content{

        margin-left:0;

        margin-top:180px;

        max-width:100%;
    }

    .hero-content h1{

        font-size:42px;
    }

    .hero-content p{

        font-size:22px;
    }

    .hero-fade{

        width:100%;

        background:linear-gradient(
            to bottom,
            rgba(255,255,255,0.92),
            rgba(255,255,255,0.55)
        );
    }
}

/* ========================= */
/* SECCIONES */
/* ========================= */

.info-section{
    width:100%;
    padding:90px 8%;
}


/* ========================= */
/* LIRMI */
/* ========================= */

.lirmi-section{
    position:relative;

    width:100%;

    padding:100px 8%;

    overflow:hidden;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:60px;

    background:linear-gradient(
        135deg,
        #062b66 0%,
        #0b3d91 50%,
        #1c6ff5 100%
    );
}

/* EFECTO ILUMINACIÓN */
.lirmi-section::before{
    content:"";

    position:absolute;

    top:-150px;
    right:-150px;

    width:500px;
    height:500px;

    background:rgba(255,255,255,0.08);

    border-radius:50%;

    filter:blur(80px);

    z-index:1;
}

/* CONTENIDO */
.lirmi-section > *{
    position:relative;
    z-index:2;
}

/* LOGO EXCELENCIA */
.info-left1 img{
    width:290px;

    filter:drop-shadow(0 10px 20px rgba(0,0,0,0.25));

    transition:0.4s;
}

/* IMAGEN LIRMI */
.info-left img{
    width:500px;

    filter:drop-shadow(0 15px 30px rgba(0,0,0,0.25));

    transition:0.4s;
}

.info-left img:hover{
    transform:scale(1.03);
}

.info-left1 img:hover{
    transform:scale(1.03);
}

/* BLOQUE TEXTO */
.info-right{
    max-width:650px;

    background:rgba(255,255,255,0.12);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    padding:45px;

    border-radius:30px;

    box-shadow:0 10px 35px rgba(0,0,0,0.18);
}

/* TITULO */
.info-right h2{
    font-size:58px;

    margin-bottom:25px;

    color:white;

    line-height:1.1;
}

/* TEXTO */
.info-right p{
    font-size:24px;

    line-height:1.7;

    margin-bottom:35px;

    color:rgba(255,255,255,0.92);
}

/* BOTON */
.info-btn{
    display:inline-block;

    background:white;
    color:#0b3d91;

    text-decoration:none;

    padding:16px 38px;

    border-radius:14px;

    font-size:18px;
    font-weight:bold;

    transition:0.3s;
}

.info-btn:hover{
    transform:translateY(-5px);

    background:#f3f8ff;
}

/* RESPONSIVE */
@media(max-width:1100px){

    .lirmi-section{
        flex-direction:column;

        text-align:center;
    }

    .info-left img{
        width:300px;
    }

    .info-left1 img{
        width:180px;
    }

    .info-right{
        width:100%;
    }

    .info-right h2{
        font-size:42px;
    }

    .info-right p{
        font-size:20px;
    }
}



/* ========================= */
/* CENTRO DE ALUMNOS */
/* ========================= */

.alumnos-section{
    position:relative;
    width:100%;
    height:650px;
    overflow:hidden;
}

/* IMAGEN */

.alumnos-section::before{
    content:"";
    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:100%;

    background-image:url("centrodealumnos.jpg");
    background-size:cover;
    background-position:center;

    z-index:1;
}

/* DIFUMINADO */

.alumnos-section::after{
    content:"";
    position:absolute;

    top:0;
    right:0;

    width:25%;
    height:100%;

    background:linear-gradient(
        to left,
        white 0%,
        rgba(255,255,255,0.85) 30%,
        rgba(255,255,255,0.45) 60%,
        rgba(255,255,255,0) 100%
    );

    z-index:2;
}

/* CONTENIDO */

.alumnos-overlay{
    position:relative;

    z-index:3;

    width:100%;
    height:100%;

    display:flex;
    align-items:center;
    justify-content:flex-start;

    padding-left:50px;
}

/* BLOQUE TEXTO */

.alumnos-content{
    max-width:550px;

    color:#0b3d91;

    background:rgba(255,255,255,0.35);

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

    padding:40px;

    border-radius:30px;

    box-shadow:0 10px 35px rgba(0,0,0,0.12);
}

/* TITULO */

.alumnos-content h2{
    font-size:72px;
    line-height:1.1;

    margin-bottom:25px;

    font-weight:bold;
}

/* LINEA */

.linea{
    width:90px;
    height:5px;

    background:#d8a100;

    border-radius:20px;

    margin-bottom:30px;
}

/* TEXTO */

.alumnos-content p{
    font-size:30px;
    line-height:1.6;

    color:#1d1d1d;

    margin-bottom:35px;
}

/* BOTON */

.alumnos-btn{
    display:inline-block;

    background:#0b3d91;
    color:white;

    text-decoration:none;

    padding:16px 38px;

    border-radius:12px;

    font-size:18px;
    font-weight:bold;

    transition:0.3s;
}

.alumnos-btn:hover{
    transform:translateY(-5px);
    background:#062b66;
}

/* ========================= */
/* SELLOS */
/* ========================= */

.sellos-section{
    background:#f3f8ff;
    text-align:center;
}

.sellos-section h2{
    font-size:50px;
    color:#0b3d91;
    margin-bottom:20px;
}

.sellos-section p{
    max-width:900px;

    margin:auto;

    font-size:22px;
    line-height:1.7;

    margin-bottom:50px;
}

.sellos-container{
    display:flex;
    justify-content:center;
    gap:30px;
    flex-wrap:wrap;
}

.sello-card{
    background:white;

    width:260px;

    padding:40px 30px;

    border-radius:25px;

    box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.sello-card i{
    font-size:60px;

    color:#0b3d91;

    margin-bottom:20px;
}

.sello-card h3{
    font-size:24px;
    color:#062b66;
}

/* ========================= */
/* ESPECIALIDADES */
/* ========================= */

.especialidades-section{
    background:#062b66;
    color:white;
    text-align:center;
}

.especialidades-section h2{
    font-size:50px;
    margin-bottom:50px;
}

.especialidades-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:10px;
}

.especialidad-card,
.especialidad-card1, .especialidad-card2{
    background:rgba(255,255,255,0.08);

    padding:40px 25px;

    border-radius:25px;
}

.especialidad-card i,
.especialidad-card1 i,.especialidad-card2 i {
    font-size:55px;
    margin-bottom:20px;
}

.especialidad-card h3{
    font-size:28px;
    margin-bottom:15px;
}

.especialidad-card1 h3{
    font-size:20px;
    margin-bottom:15px;
}

.especialidad-card2 h3{
    font-size:23px;
    margin-bottom:15px;
}

.especialidad-card p,
.especialidad-card1 p, .especialidad-card2 p{
    font-size:18px;
    line-height:1.6;
}

/* ========================= */
/* NOTICIAS */
/* ========================= */

.noticias{
    padding:60px;
    background:#f3f8ff;
    text-align:center;
    margin-bottom:50px;
}

.noticias h2{
    margin-bottom:50px;
    font-size: 40px;

}

.news-container{
    display:flex;
    gap:20px;
}

.news-card{
    background:white;

    padding:35px;

    border-radius:15px;

    box-shadow:0 4px 10px rgba(0,0,0,0.1);

    flex:1;
}

/* ========================= */
/* FOOTER */
/* ========================= */

footer{
    background:#062b66;
    padding:25px;
    text-align:center;
}

footer H3{
    color: white;
    background:#062b66;
    padding:25px;
    text-align:center;
}

.footer-social{
    display:flex;
    justify-content:center;
    gap:25px;
}

.footer-social a{
    color:white;
    font-size:30px;
}

/* ========================= */
/* RESPONSIVE */
/* ========================= */

@media(max-width:1000px){

    .hero-content{
        margin-left:0;
        margin-top:180px;

        max-width:100%;
    }

    .hero-content h1{
        font-size:42px;
    }

    .hero-content p{
        font-size:22px;
    }

    .floating-logo{
        left:50%;
        transform:translateX(-50%);
        top:40px;
    }

    .floating-logo img{
        width:220px;
    }

    .alumnos-overlay{
        padding:50px;
        justify-content:center;
    }

    .alumnos-content{
        text-align:center;
    }

    .linea{
        margin:auto;
        margin-bottom:30px;
    }

    .alumnos-content h2{
        font-size:50px;
    }

    .alumnos-content p{
        font-size:22px;
    }

    .lirmi-section{
        flex-direction:column;
        text-align:center;
    }

    .info-left img{
        width:300px;
    }

    .info-left1 img{
        width:180px;
    }

    .news-container{
        flex-direction:column;
    }
}



/* ========================= */
/* NOTICIAS */
/* ========================= */

.noticias{
    padding:80px 60px;
    background:#f3f8ff;
    text-align:center;
}

.noticias h2{
    margin-bottom:50px;
    font-size:42px;
    color:#0b3d91;
}

/* CARDS */

.news-container{
    display:flex;
    gap:20px;
    margin-bottom:70px;
}

.news-card{
    background:white;
    padding:35px;
    border-radius:20px;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
    flex:1;

    transition:0.3s;
}

.news-card:hover{
    transform:translateY(-6px);
}

.news-card h3{
    font-size:28px;
    color:#0b3d91;
    margin-bottom:15px;
}

.news-card p{
    font-size:18px;
    line-height:1.6;
    color:#444;
}

/* ========================= */
/* TELECOM NOTICIAS */
/* ========================= */

.telecom-noticias-container{
    display:grid;
    grid-template-columns:1fr 1.2fr 1fr;

    gap:30px;

    align-items:center;
}

/* ========================= */
/* BANNER */
/* ========================= */

.telecom-banner{
    background:white;

    border-radius:30px;

    overflow:hidden;

    box-shadow:0 10px 25px rgba(0,0,0,0.08);

    height:100%;
    width:295px;
    height:880px;

    position:relative;
    left:0px;
    right:50px;
    top:0px;
    bottom:20px;
}

.telecom-banner img{
    width:100%;
    height:100%;

    object-fit:contain;

    display:block;
}

/* =========================================
   VIDEO DE NOTICIAS
========================================= */

.video-news-box {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;

    position: relative;

    aspect-ratio: 16 / 9;

    overflow: hidden;
    border-radius: 20px;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

.video-news-box iframe {
    width: 100%;
    height: 100%;

    display: block;

    border: none;
}
/* ========================= */
/* INFO */
/* ========================= */

.telecom-info{
    background:linear-gradient(
        135deg,
        #062b66,
        #0b3d91
    );

    color:white;

    padding:40px;

    border-radius:30px;

    text-align:left;

    box-shadow:0 10px 25px rgba(0,0,0,0.12);

    width:295px;
    height:880px;

    position:relative;
    left:0px;
    right:50px;
    top:0px;
    bottom:20px;


}

.telecom-info h3{
    font-size:42px;
    margin-bottom:20px;
}

.telecom-line{
    width:90px;
    height:5px;

    background:#d8a100;

    border-radius:20px;

    margin-bottom:30px;
}

.telecom-info p{
    font-size:19px;
    line-height:1.8;

    margin-bottom:25px;

    color:rgba(255,255,255,0.92);
}

/* BOTON */

.telecom-btn{
    display:inline-block;

    background:white;
    color:#0b3d91;

    text-decoration:none;

    padding:15px 30px;

    border-radius:12px;

    font-weight:bold;

    transition:0.3s;
}

.telecom-btn:hover{
    transform:translateY(-5px);
    background:#f3f8ff;
}

/* ========================= */
/* RESPONSIVE */
/* ========================= */

@media(max-width:1200px){

    .telecom-noticias-container{
        grid-template-columns:1fr;
    }

    .telecom-info{
        text-align:center;
    }

    .telecom-line{
        margin:auto;
        margin-bottom:30px;
    }

    .video-news-box iframe{
        height:300px;
    }
}

@media(max-width:768px){

    .news-container{
        flex-direction:column;
    }

    .noticias{
        padding:60px 25px;
    }

    .video-news-box iframe{
        height:220px;
    }

    .telecom-info h3{
        font-size:32px;
    }

    .telecom-info p{
        font-size:17px;
    }
}





/* =========================================
   SECCIÓN UBICACIÓN
========================================= */

.ubicacion-section {
    position: relative;
    padding: 90px 7%;
    background: linear-gradient(
        135deg,
        #288fe4 0%,
        #013d63 50%,
        #021431 100%
    );
    overflow: hidden;
}

.ubicacion-section::before {
    content: "";
    position: absolute;

    width: 500px;
    height: 500px;

    top: -250px;
    left: -200px;

    background: rgba(255, 255, 255, 0.05);

    border-radius: 50%;

    pointer-events: none;
}

.ubicacion-section::after {
    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    bottom: -350px;
    right: -250px;

    background: rgba(255, 255, 255, 0.04);

    border-radius: 50%;

    pointer-events: none;
}

/* =========================================
   ENCABEZADO
========================================= */

.ubicacion-header {
    text-align: center;
    margin-bottom: 55px;
    position: relative;
    z-index: 2;
}

.ubicacion-pin {
    width: 55px;
    height: 55px;

    margin: 0 auto 15px;

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

    font-size: 28px;
    color: #f7b733;
}

.ubicacion-header h2 {
    margin: 0;

    font-size: 58px;
    font-weight: 800;

    color: #ffffff;

    letter-spacing: -1.5px;
}

.ubicacion-header h2 span {
    color: #ffffff;
}

.ubicacion-header p {
    margin-top: 12px;

    font-size: 20px;
    color: rgba(255, 255, 255, 0.85);
}

.ubicacion-line {
    width: 80px;
    height: 4px;

    margin: 22px auto 0;

    background: linear-gradient(
        90deg,
        #f7c343,
        #ffffff
    );

    border-radius: 10px;
}


/* =========================================
   CONTENEDOR PRINCIPAL
========================================= */

.ubicacion-container {
    max-width: 1500px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: 1.65fr 0.85fr;

    gap: 35px;

    position: relative;
    z-index: 2;
}


/* =========================================
   COLUMNA IZQUIERDA
========================================= */

.ubicacion-left {
    display: flex;
    flex-direction: column;
    gap: 28px;
}


/* =========================================
   MAPA
========================================= */

.mapa-box {
    width: 100%;
    height: 545px;

    border-radius: 25px;

    overflow: hidden;

    background: #ffffff;

    border: 6px solid #ffffff;

    box-shadow:
        0 12px 35px rgba(16, 42, 86, 0.15);
}

.mapa-box iframe {
    width: 100%;
    height: 100%;

    border: 0;

    display: block;
}


/* =========================================
   TARJETAS DE INFORMACIÓN
========================================= */

.ubicacion-info {
    display: flex;
    flex-direction: column;

    gap: 20px;
}


.ubicacion-card {
    min-height: 112px;

    padding: 22px;

    display: flex;
    align-items: center;

    gap: 25px;

    background: #ffffff;

    border: 1px solid #e5eaf2;

    border-radius: 22px;

    box-shadow:
        0 8px 25px rgba(16, 42, 86, 0.08);

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


.ubicacion-card:hover {
    transform: translateY(-4px);

    border-color: #b9d3ff;

    box-shadow:
        0 14px 35px rgba(20, 100, 223, 0.15);
}


/* =========================================
   ICONOS
========================================= */

.ubicacion-card-icon {
    min-width: 70px;
    width: 70px;
    height: 70px;

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

    border-radius: 50%;

    background: linear-gradient(
        135deg,
        #145bd3,
        #2879ee
    );

    color: white;

    font-size: 28px;

    box-shadow:
        0 8px 20px rgba(20, 91, 211, 0.25);
}


.ubicacion-card-content {
    min-width: 0;
}

.ubicacion-card-content h3 {
    margin: 0 0 7px;

    font-size: 20px;

    font-weight: 700;

    color: #102a56;
}

.ubicacion-card-content p {
    margin: 0;

    font-size: 18px;

    line-height: 1.4;

    color: #1464df;
}


/* =========================================
   HORARIO
========================================= */

.horario-card {
    align-items: flex-start;

    padding-top: 28px;
    padding-bottom: 28px;
}


.horario-card .ubicacion-card-icon {
    flex-shrink: 0;
}


.horario-item {
    display: flex;
    flex-direction: column;

    gap: 4px;

    margin-top: 15px;
}

.horario-item strong {
    font-size: 17px;

    color: #102a56;
}

.horario-item span {
    font-size: 19px;

    color: #1464df;
}

.horario-separador {
    width: 100%;

    height: 1px;

    background: #dce4ef;

    margin: 17px 0;
}


/* =========================================
   COMO LLEGAR
========================================= */

.como-llegar {
    min-height: 110px;

    padding: 18px 25px;

    display: flex;
    align-items: center;

    gap: 20px;

    border-radius: 22px;

    background: linear-gradient(
        135deg,
        #f7faff,
        #eef5ff
    );

    border: 1px solid #cfe0ff;

    box-shadow:
        0 8px 25px rgba(20, 100, 223, 0.08);
}


.como-llegar-icon {
    width: 65px;
    height: 65px;

    min-width: 65px;

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

    border-radius: 50%;

    background: #f5b82e;

    color: white;

    font-size: 28px;

    box-shadow:
        0 8px 18px rgba(245, 184, 46, 0.25);
}


.como-llegar-texto {
    flex: 1;
}

.como-llegar-texto h3 {
    margin: 0 0 5px;

    font-size: 24px;

    color: #102a56;
}

.como-llegar-texto p {
    margin: 0;

    font-size: 16px;

    color: #65738b;
}


/* =========================================
   BOTÓN
========================================= */

.ubicacion-btn {
    min-width: 230px;

    padding: 17px 28px;

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

    gap: 14px;

    border-radius: 50px;

    background: linear-gradient(
        135deg,
        #145bd3,
        #2879ee
    );

    color: #ffffff;

    text-decoration: none;

    font-size: 18px;
    font-weight: 700;

    box-shadow:
        0 8px 20px rgba(20, 91, 211, 0.25);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.ubicacion-btn:hover {
    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(20, 91, 211, 0.35);
}


.ubicacion-btn i {
    font-size: 20px;
}


/* =========================================
   DECORACIONES DE PUNTOS
========================================= */

.ubicacion-dots {
    position: absolute;

    width: 170px;
    height: 100px;

    opacity: 0.65;

    background-image: radial-gradient(
        #6d9fe9 2px,
        transparent 2px
    );

    background-size: 19px 19px;

    z-index: 1;
}

.dots-left {
    top: 80px;
    left: 20px;
}

.dots-right {
    top: 80px;
    right: 20px;
}


/* =========================================
   RESPONSIVE - TABLETS
========================================= */

@media (max-width: 1100px) {

    .ubicacion-container {
        grid-template-columns: 1fr;
    }

    .ubicacion-info {
        display: grid;

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

    .horario-card {
        grid-column: span 2;
    }

    .como-llegar {
        flex-wrap: wrap;
    }

}


/* =========================================
   RESPONSIVE - CELULARES
========================================= */

@media (max-width: 700px) {

    .ubicacion-section {
        padding: 60px 20px;
    }

    .ubicacion-header h2 {
        font-size: 40px;
    }

    .ubicacion-header p {
        font-size: 16px;
    }

    .mapa-box {
        height: 400px;
        border-radius: 18px;
    }

    .ubicacion-info {
        display: flex;
    }

    .ubicacion-card {
        padding: 18px;

        gap: 17px;

        border-radius: 18px;
    }

    .ubicacion-card-icon {
        min-width: 58px;
        width: 58px;
        height: 58px;

        font-size: 23px;
    }

    .ubicacion-card-content h3 {
        font-size: 17px;
    }

    .ubicacion-card-content p {
        font-size: 15px;
    }

    .como-llegar {
        flex-direction: column;

        text-align: center;

        padding: 25px;
    }

    .como-llegar-texto h3 {
        font-size: 21px;
    }

    .como-llegar-texto p {
        font-size: 14px;
    }

    .ubicacion-btn {
        width: 100%;

        min-width: 0;

        box-sizing: border-box;
    }

    .ubicacion-dots {
        opacity: 0.3;
    }

}


 /* AGREGADO LOGOS */

.especialidad-card img,
.especialidad-card1 img,
.especialidad-card2 img {
    width: 100px;
    height: 100px;
    object-fit: contain;
    margin-bottom: 3px;
}







/* =========================================================
   RESPONSIVE COMPLETO - TODA LA PAGINA
   LICEO JUANITA FERNANDEZ SOLAR
========================================================= */


/* =========================================================
   REGLAS GENERALES
========================================================= */

html {
    width: 100%;
    overflow-x: hidden;
}

body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

img,
video,
iframe {
    max-width: 100%;
}

section {
    max-width: 100%;
}


/* =========================================================
   TABLETS Y PANTALLAS MEDIANAS
========================================================= */

@media (max-width: 1200px) {

    /* -------------------------
       HEADER
    ------------------------- */

    .top-bar {
        padding: 15px 25px;
        gap: 20px;
    }

    .logo-container {
        gap: 10px;
    }

    .logo-container img {
        width: 70px;
    }

    .logo-text h1 {
        font-size: 18px;
    }

    .logo-text h2 {
        font-size: 16px;
    }

    .logo-text p {
        font-size: 14px;
    }

    .menu-center ul {
        gap: 0;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .menu-center ul li a {
        padding: 8px;
        font-size: 14px;
    }


    /* -------------------------
       HERO
    ------------------------- */

    .hero-content {
        margin-left: 0;
        margin-top: 180px;
        max-width: 650px;
    }

    .hero-content h1 {
        font-size: 48px;
    }

    .hero-content p {
        font-size: 21px;
    }

    .floating-logo {
        left: 50%;
        transform: translateX(-50%);
        top: 50px;
    }

    .floating-logo img {
        width: 220px;
    }


    /* -------------------------
       LIRMI
    ------------------------- */

    .lirmi-section {
        flex-direction: column;
        text-align: center;
        padding: 80px 6%;
    }

    .info-left img {
        width: 350px;
    }

    .info-left1 img {
        width: 200px;
    }

    .info-right {
        width: 100%;
        max-width: 700px;
    }

    .info-right h2 {
        font-size: 45px;
    }

    .info-right p {
        font-size: 20px;
    }


    /* -------------------------
       CENTRO DE ALUMNOS
    ------------------------- */

    .alumnos-overlay {
        padding: 40px;
        justify-content: center;
    }

    .alumnos-content {
        max-width: 650px;
        text-align: center;
    }

    .alumnos-content h2 {
        font-size: 55px;
    }

    .alumnos-content p {
        font-size: 22px;
    }

    .linea {
        margin-left: auto;
        margin-right: auto;
    }


    /* -------------------------
       NOTICIAS
    ------------------------- */

    .news-container {
        flex-direction: column;
    }


    /* -------------------------
       TELECOM
    ------------------------- */

    .telecom-noticias-container {
        grid-template-columns: 1fr;
    }

    .telecom-banner,
    .telecom-info {
        width: 100%;
        max-width: 500px;
        height: auto;
        min-height: 400px;
        margin: 0 auto;
        left: auto;
        right: auto;
    }

    .video-news-box {
        width: 100%;
    }

    .video-news-box iframe {
        width: 100%;
        height: 450px;
    }

}


/* =========================================================
   TABLETS PEQUEÑAS
========================================================= */

@media (max-width: 900px) {

    /* -------------------------
       BARRA SUPERIOR
    ------------------------- */

    .top-info-bar {
        padding: 8px 20px;
    }

    .top-left-group {
        justify-content: center;
    }


    /* -------------------------
       HEADER
    ------------------------- */

    .top-bar {
        flex-direction: column;
        padding: 15px 20px;
    }

    .logo-container {
        justify-content: center;
        text-align: center;
    }

    .logo-container img {
        width: 75px;
    }

    .menu-center {
        width: 100%;
        justify-content: center;
    }

    .menu-center ul {
        width: 100%;
        justify-content: center;
    }

    .menu-center ul li a {
        font-size: 14px;
        padding: 8px 7px;
    }


    /* -------------------------
       HERO
    ------------------------- */

    .hero-slider {
        height: 750px;
    }

    .hero-video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hero-fade {
        width: 100%;
        height: 100%;

        background: linear-gradient(
            to bottom,
            rgba(255,255,255,0.95) 0%,
            rgba(255,255,255,0.75) 45%,
            rgba(255,255,255,0.20) 100%
        );
    }

    .floating-logo {
        top: 40px;
    }

    .floating-logo img {
        width: 180px;
    }

    .overlay {
        padding: 20px;
        align-items: flex-end;
        padding-bottom: 60px;
    }

    .hero-content {
        width: 100%;
        max-width: 700px;

        margin: 0 auto;

        padding: 30px;

        text-align: center;
    }

    .hero-content h1 {
        font-size: 40px;
    }

    .hero-content p {
        font-size: 19px;
        line-height: 1.5;
    }


    /* -------------------------
       SECCIONES GENERALES
    ------------------------- */

    .info-section {
        padding: 70px 5%;
    }


    /* -------------------------
       SELLOS
    ------------------------- */

    .sellos-section h2 {
        font-size: 40px;
    }

    .sellos-container {
        gap: 20px;
    }

    .sello-card {
        width: 240px;
    }


    /* -------------------------
       ESPECIALIDADES
    ------------------------- */

    .especialidades-section h2 {
        font-size: 40px;
    }

    .especialidades-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .especialidad-card,
    .especialidad-card1,
    .especialidad-card2 {
        padding: 30px 20px;
    }


    /* -------------------------
       UBICACION
    ------------------------- */

    .ubicacion-section {
        padding: 70px 5%;
    }

    .ubicacion-container {
        grid-template-columns: 1fr;
    }

    .mapa-box {
        height: 500px;
    }

    .ubicacion-info {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .horario-card {
        grid-column: span 2;
    }

}


/* =========================================================
   CELULARES
========================================================= */

@media (max-width: 600px) {

    /* -------------------------
       BARRA SUPERIOR
    ------------------------- */

    .top-info-bar {
        padding: 10px 15px;
    }

    .top-left-group {
        gap: 15px;
    }

    .buzon-link {
        font-size: 13px;
    }

    .right-social {
        gap: 12px;
    }

    .right-social a {
        font-size: 18px;
    }


    /* -------------------------
       HEADER
    ------------------------- */

    .top-bar {
        padding: 15px;
    }

    .logo-container {
        width: 100%;
        flex-direction: column;
        gap: 5px;
    }

    .logo-container img {
        width: 80px;
    }

    .logo-text h1 {
        font-size: 17px;
    }

    .logo-text h2 {
        font-size: 15px;
    }

    .logo-text p {
        font-size: 13px;
    }

    .menu-center {
        width: 100%;
    }

    .menu-center ul {
        flex-direction: column;
        align-items: center;
        width: 100%;
        gap: 3px;
    }

    .menu-center ul li {
        width: 100%;
        text-align: center;
    }

    .menu-center ul li a {
        display: block;
        width: 100%;
        padding: 9px;
        font-size: 15px;
    }

    /*
       En celular ocultamos inicialmente
       los submenús para evitar que el
       encabezado ocupe toda la pantalla.
    */

    .dropdown-menu {
        display: none !important;
        position: static;
        width: 100%;
        min-width: 0;
        box-shadow: none;
        border-radius: 0;
    }


    /* -------------------------
       HERO
    ------------------------- */

    .hero-slider {
        height: 720px;
    }

    .hero-video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .floating-logo {
        top: 30px;
    }

    .floating-logo img {
        width: 150px;
    }

    .overlay {
        padding: 15px;
        padding-bottom: 35px;
    }

    .hero-content {
        width: 100%;
        padding: 25px 20px;

        border-radius: 25px;

        margin: 0;
    }

    .hero-content h1 {
        font-size: 32px;
        line-height: 1.15;
    }

    .hero-content p {
        font-size: 17px;
        line-height: 1.5;
        margin-bottom: 25px;
    }

    #btnConocenos {
        width: 100%;
        padding: 15px;
    }


    /* -------------------------
       LIRMI
    ------------------------- */

    .lirmi-section {
        padding: 60px 20px;
        gap: 35px;
    }

    .info-left img {
        width: 250px;
        max-width: 80vw;
    }

    .info-left1 img {
        width: 150px;
        max-width: 60vw;
    }

    .info-right {
        width: 100%;
        padding: 30px 20px;
        border-radius: 25px;
    }

    .info-right h2 {
        font-size: 36px;
    }

    .info-right p {
        font-size: 17px;
        line-height: 1.6;
    }

    .info-btn {
        width: 100%;
        text-align: center;
    }


    /* -------------------------
       CENTRO DE ALUMNOS
    ------------------------- */

    .alumnos-section {
        height: 700px;
    }

    .alumnos-overlay {
        padding: 20px;
    }

    .alumnos-content {
        width: 100%;
        padding: 30px 20px;
        border-radius: 25px;
    }

    .alumnos-content h2 {
        font-size: 42px;
    }

    .alumnos-content p {
        font-size: 18px;
        line-height: 1.5;
    }

    .alumnos-btn {
        width: 100%;
        text-align: center;
    }


    /* -------------------------
       SELLOS
    ------------------------- */

    .sellos-section {
        padding: 60px 20px;
    }

    .sellos-section h2 {
        font-size: 34px;
    }

    .sellos-section p {
        font-size: 17px;
        line-height: 1.6;
    }

    .sellos-container {
        flex-direction: column;
        align-items: center;
    }

    .sello-card {
        width: 100%;
        max-width: 350px;
    }


    /* -------------------------
       ESPECIALIDADES
    ------------------------- */

    .especialidades-section {
        padding: 60px 20px;
    }

    .especialidades-section h2 {
        font-size: 34px;
        margin-bottom: 35px;
    }

    .especialidades-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .especialidad-card,
    .especialidad-card1,
    .especialidad-card2 {
        width: 100%;
        padding: 30px 20px;
    }

    .especialidad-card img,
    .especialidad-card1 img,
    .especialidad-card2 img {
        width: 90px;
        height: 90px;
    }

    .especialidad-card h3,
    .especialidad-card1 h3,
    .especialidad-card2 h3 {
        font-size: 22px;
    }

    .especialidad-card p,
    .especialidad-card1 p,
    .especialidad-card2 p {
        font-size: 16px;
    }


    /* -------------------------
       NOTICIAS
    ------------------------- */

    .noticias {
        padding: 60px 20px;
    }

    .noticias h2 {
        font-size: 34px;
    }

    .news-container {
        flex-direction: column;
        gap: 20px;
    }

    .news-card {
        width: 100%;
        padding: 25px 20px;
    }

    .news-card h3 {
        font-size: 24px;
    }

    .news-card p {
        font-size: 16px;
    }


    /* -------------------------
       TELECOM
    ------------------------- */

    .telecom-noticias-container {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .telecom-banner {
        width: 100%;
        height: auto;
        min-height: 300px;
        max-width: 100%;
    }

    .telecom-info {
        width: 100%;
        height: auto;
        min-height: 0;
        padding: 30px 20px;
        max-width: 100%;
    }

    .telecom-info h3 {
        font-size: 32px;
    }

    .telecom-info p {
        font-size: 17px;
        line-height: 1.6;
    }

    .video-news-box {
        width: 100%;
        padding: 10px;
    }

    .video-news-box iframe {
        width: 100%;
        height: 220px;
    }


    /* -------------------------
       UBICACION
    ------------------------- */

    .ubicacion-section {
        padding: 60px 15px;
    }

    .ubicacion-header {
        margin-bottom: 35px;
    }

    .ubicacion-pin {
        font-size: 24px;
        margin-bottom: 5px;
    }

    .ubicacion-header h2 {
        font-size: 38px;
        line-height: 1.1;
    }

    .ubicacion-header p {
        font-size: 16px;
        line-height: 1.5;
    }

    .ubicacion-container {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .mapa-box {
        width: 100%;
        height: 380px;
        border-width: 4px;
        border-radius: 18px;
    }

    .ubicacion-info {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .ubicacion-card {
        width: 100%;
        min-height: 95px;
        padding: 17px;
        gap: 15px;
        border-radius: 18px;
    }

    .ubicacion-card-icon {
        min-width: 55px;
        width: 55px;
        height: 55px;
        font-size: 22px;
    }

    .ubicacion-card-content h3 {
        font-size: 17px;
        margin-bottom: 5px;
    }

    .ubicacion-card-content p {
        font-size: 14px;
        word-break: break-word;
    }

    .horario-card {
        grid-column: auto;
        align-items: flex-start;
    }

    .horario-item strong {
        font-size: 15px;
    }

    .horario-item span {
        font-size: 16px;
    }

    .como-llegar {
        flex-direction: column;
        text-align: center;
        padding: 25px 18px;
        gap: 15px;
    }

    .como-llegar-icon {
        width: 60px;
        height: 60px;
        min-width: 60px;
    }

    .como-llegar-texto h3 {
        font-size: 21px;
    }

    .como-llegar-texto p {
        font-size: 14px;
    }

    .ubicacion-btn {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }


    /* -------------------------
       FOOTER
    ------------------------- */

    footer {
        padding: 25px 15px;
    }

    .footer-social {
        gap: 25px;
    }

    .footer-social a {
        font-size: 26px;
    }

}


/* =========================================================
   CELULARES MUY PEQUEÑOS
   320px - 400px
========================================================= */

@media (max-width: 400px) {

    .top-left-group {
        flex-direction: column;
        gap: 8px;
    }

    .hero-slider {
        height: 680px;
    }

    .floating-logo img {
        width: 125px;
    }

    .hero-content {
        padding: 22px 16px;
    }

    .hero-content h1 {
        font-size: 28px;
    }

    .hero-content p {
        font-size: 16px;
    }

    .info-right h2 {
        font-size: 32px;
    }

    .alumnos-content h2 {
        font-size: 36px;
    }

    .ubicacion-header h2 {
        font-size: 33px;
    }

    .mapa-box {
        height: 320px;
    }

    .ubicacion-card {
        padding: 14px;
    }

    .ubicacion-card-icon {
        min-width: 50px;
        width: 50px;
        height: 50px;
        font-size: 20px;
    }

}


/* =========================================================
   TELECOM NOTICIAS - DISEÑO ARMONICO
========================================================= */

.telecom-noticias-container {
    width: 100%;
    max-width: 1400px;

    margin: 0 auto;

    display: grid;

    /*
       AFICHE | VIDEO | INFORMACION
    */
    grid-template-columns: 250px minmax(500px, 1fr) 280px;

    align-items: center;

    gap: 35px;

    padding: 20px 30px;

    box-sizing: border-box;
}


/* =========================================================
   AFICHE
========================================================= */

.telecom-banner {
    width: 100%;
    max-width: 250px;

    height: 745px;

    margin: 0;

    border-radius: 24px;

    overflow: hidden;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.15);
}

.telecom-banner img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


/* =========================================================
   CONTENEDOR DEL VIDEO
========================================================= */

.video-news-box {
    width: 100%;

    max-width: 850px;

    margin: 0 auto;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    border-radius: 22px;

    background: #000;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.18);
}


/* VIDEO */

.video-news-box iframe {
    width: 100%;
    height: 100%;

    display: block;

    border: 0;
}


/* =========================================================
   INFORMACION TELECOM
========================================================= */

.telecom-info {
    width: 100%;
    max-width: 280px;

    min-height: 620px;

    height: auto;

    margin: 0;

    padding: 38px 32px;

    box-sizing: border-box;

    border-radius: 25px;

    background: linear-gradient(
        160deg,
        #073574,
        #104b9a
    );

    color: white;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.18);

    display: flex;

    flex-direction: column;

    justify-content: center;
}


/* TITULO */

.telecom-info h3 {
    margin: 0 0 20px;

    font-size: 35px;

    line-height: 1.15;

    color: #ffffff;
}


/* LINEA */

.telecom-info h3::after {
    content: "";

    display: block;

    width: 75px;
    height: 4px;

    margin-top: 20px;

    background: #f5b82e;

    border-radius: 10px;
}


/* TEXTO */

.telecom-info p {
    margin: 0 0 20px;

    font-size: 17px;

    line-height: 1.7;

    color: rgba(255, 255, 255, 0.92);
}


/* BOTON */

.telecom-info a {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: fit-content;

    padding: 13px 22px;

    margin-top: 5px;

    border-radius: 10px;

    background: #ffffff;

    color: #10458d;

    text-decoration: none;

    font-weight: 700;

    transition: all 0.3s ease;
}

.telecom-info a:hover {
    transform: translateY(-3px);

    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.18);
}



/* =========================================================
   TELECOM NOTICIAS - TABLET
========================================================= */

@media (max-width: 1100px) {

    .telecom-noticias-container {

        grid-template-columns:
            200px
            minmax(350px, 1fr);

        gap: 25px;

    }

    .telecom-banner {

        max-width: 200px;

        height: 600px;

    }

    .telecom-info {

        grid-column: 1 / -1;

        width: 100%;

        max-width: 600px;

        min-height: auto;

        margin: 0 auto;

    }

}


/* =========================================================
   TELECOM NOTICIAS - CELULAR
========================================================= */

@media (max-width: 700px) {

    .telecom-noticias-container {

        display: flex;

        flex-direction: column;

        align-items: center;

        gap: 25px;

        padding: 20px;

    }


    /* AFICHE */

    .telecom-banner {

        width: 100%;

        max-width: 330px;

        height: auto;

        aspect-ratio: 0.67;

        border-radius: 20px;

    }


    /* VIDEO */

    .video-news-box {

        width: 100%;

        max-width: 600px;

        aspect-ratio: 16 / 9;

        border-radius: 18px;

    }

    .video-news-box iframe {

        width: 100%;

        height: 100%;

    }


    /* INFORMACION */

    .telecom-info {

        width: 100%;

        max-width: 600px;

        min-height: auto;

        padding: 30px 25px;

        border-radius: 20px;

    }

    .telecom-info h3 {

        font-size: 30px;

    }

    .telecom-info p {

        font-size: 16px;

    }

}

/* ============================================================
   CORRECCION MOVIL V2
   Soluciona el problema visible en Chrome Android:
   la pagina quedaba limitada a una parte del ancho de pantalla.
   ============================================================ */

html {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

body {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

@media screen and (max-width: 700px) {

    html,
    body {
        width: 100vw !important;
        min-width: 100vw !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    /* Todos los bloques principales deben ocupar el viewport */
    .top-info-bar,
    .top-bar,
    .hero-slider,
    .lirmi-section,
    .alumnos-section,
    .sellos-section,
    .especialidades-section,
    .noticias,
    .ubicacion-section,
    footer {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Evita que un elemento hijo cree un ancho mayor que el telefono */
    .top-info-bar *,
    .top-bar *,
    .hero-slider *,
    .lirmi-section *,
    .alumnos-section *,
    .sellos-section *,
    .especialidades-section *,
    .noticias *,
    .ubicacion-section *,
    footer * {
        max-width: 100%;
        box-sizing: border-box;
    }

    /* ---------------- HEADER ---------------- */

    .top-info-bar {
        padding: 9px 12px !important;
    }

    .top-left-group {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
    }

    .top-bar {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 18px !important;
        padding: 18px 15px !important;
    }

    .logo-container {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 10px !important;
        text-align: center !important;
    }

    .logo-container img {
        width: 65px !important;
        max-width: 65px !important;
        height: auto !important;
        flex: 0 0 auto !important;
    }

    .logo-text {
        min-width: 0 !important;
        max-width: calc(100% - 80px) !important;
    }

    .logo-text h1 {
        font-size: 20px !important;
        line-height: 1.12 !important;
    }

    .logo-text h2 {
        font-size: 17px !important;
        line-height: 1.15 !important;
    }

    .logo-text p {
        font-size: 13px !important;
    }

    .menu-center {
        width: 100% !important;
        min-width: 0 !important;
        flex: none !important;
        display: block !important;
    }

    .menu-center > ul {
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
    }

    .menu-center > ul > li {
        width: 100% !important;
        min-width: 0 !important;
        text-align: center !important;
    }

    .menu-center > ul > li > a {
        display: block !important;
        width: 100% !important;
        padding: 10px 5px !important;
        font-size: 14px !important;
    }

    .dropdown-menu {
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-shadow: none !important;
    }

    /* ---------------- HERO ---------------- */

    .hero-slider {
        height: 650px !important;
        min-height: 0 !important;
    }

    .hero-video {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .floating-logo {
        width: 100% !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
    }

    .floating-logo img {
        width: 125px !important;
        max-width: 125px !important;
        height: auto !important;
    }

    .overlay {
        width: 100% !important;
        padding: 12px !important;
        box-sizing: border-box !important;
        justify-content: center !important;
        align-items: flex-end !important;
    }

    .hero-content {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 24px 17px !important;
        box-sizing: border-box !important;
    }

    .hero-content h1 {
        font-size: 29px !important;
        line-height: 1.15 !important;
    }

    .hero-content p {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    #btnConocenos {
        width: 100% !important;
    }

    /* ---------------- LIRMI ---------------- */

    .lirmi-section {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 50px 15px !important;
        gap: 30px !important;
    }

    .lirmi-section > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .info-left img {
        width: 240px !important;
        max-width: 75vw !important;
        height: auto !important;
    }

    .info-left1 img {
        width: 140px !important;
        max-width: 55vw !important;
        height: auto !important;
    }

    .info-right {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 25px 17px !important;
    }

    /* ---------------- ALUMNOS ---------------- */

    .alumnos-section {
        height: 620px !important;
        min-height: 0 !important;
    }

    .alumnos-overlay {
        width: 100% !important;
        padding: 15px !important;
        box-sizing: border-box !important;
        justify-content: center !important;
    }

    .alumnos-content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 25px 17px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    .alumnos-content h2 {
        font-size: 36px !important;
        line-height: 1.1 !important;
    }

    .alumnos-content p {
        font-size: 16px !important;
        line-height: 1.5 !important;
    }

    .alumnos-btn {
        width: 100% !important;
    }

    /* ---------------- SELLOS ---------------- */

    .sellos-section {
        padding: 50px 15px !important;
    }

    .sellos-container {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 18px !important;
    }

    .sello-card {
        width: 100% !important;
        max-width: 330px !important;
    }

    /* ---------------- ESPECIALIDADES ---------------- */

    .especialidades-section {
        padding: 50px 15px !important;
    }

    .especialidades-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .especialidad-card,
    .especialidad-card1,
    .especialidad-card2 {
        width: 100% !important;
        min-width: 0 !important;
    }

    /* ---------------- TELECOM ---------------- */

    .noticias {
        padding: 50px 12px !important;
        margin: 0 !important;
    }

    .noticias h2 {
        font-size: 30px !important;
        line-height: 1.15 !important;
        margin-bottom: 30px !important;
    }

    .telecom-noticias-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 20px !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    .telecom-banner {
        width: 100% !important;
        max-width: 300px !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 0.67 !important;
        margin: 0 auto !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        position: relative !important;
    }

    .telecom-banner img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .video-news-box {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: 16 / 9 !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    .video-news-box iframe {
        width: 100% !important;
        height: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        display: block !important;
    }

    .telecom-info {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 28px 18px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    .telecom-info h3 {
        font-size: 28px !important;
        line-height: 1.15 !important;
    }

    .telecom-line {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .telecom-info p {
        font-size: 15px !important;
        line-height: 1.6 !important;
    }

    .telecom-info a {
        max-width: 100% !important;
    }

    /* ---------------- UBICACION ---------------- */

    .ubicacion-section {
        padding: 50px 12px !important;
    }

    .ubicacion-container {
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: 1fr !important;
    }

    .ubicacion-left,
    .ubicacion-info {
        width: 100% !important;
        min-width: 0 !important;
    }

    .mapa-box {
        width: 100% !important;
        height: 300px !important;
        box-sizing: border-box !important;
    }

    .mapa-box iframe {
        width: 100% !important;
        height: 100% !important;
    }

    .ubicacion-card {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .como-llegar {
        width: 100% !important;
        box-sizing: border-box !important;
        flex-direction: column !important;
        text-align: center !important;
    }

    .ubicacion-btn {
        width: 100% !important;
        min-width: 0 !important;
    }
}

@media screen and (max-width: 400px) {

    .logo-container {
        gap: 7px !important;
    }

    .logo-container img {
        width: 58px !important;
        max-width: 58px !important;
    }

    .logo-text {
        max-width: calc(100% - 70px) !important;
    }

    .logo-text h1 {
        font-size: 17px !important;
    }

    .logo-text h2 {
        font-size: 15px !important;
    }

    .hero-slider {
        height: 610px !important;
    }

    .hero-content h1 {
        font-size: 26px !important;
    }

    .hero-content p {
        font-size: 14px !important;
    }

    .telecom-banner {
        max-width: 280px !important;
    }

    .mapa-box {
        height: 280px !important;
    }
}