/*
========================================
main.css
Colegio Madrid de Veracruz
========================================
*/

html{
    scroll-behavior:smooth;
}

/* RESET */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* CONTENIDO */

main{
    min-height:auto;
}

.portada-principal{
    width:100%;
    margin:0;
    padding:0;
}

.portada-principal img{
    width:100%;
    display:block;
}

/* CERTIFICACIONES */

.certificaciones{
    background:#1d70b8;
    padding:50px 15px;
    text-align:center;
}

.certificaciones-contenedor{
    width:98%;
    max-width:1000px;
    margin:0 auto;
}

.certificaciones h2{
    color:#ffffff;
    font:600 45px/45px "Open Sans",sans-serif;
    margin-bottom:45px;
}

.logo-cambridge{
    width:100%;
    max-width:500px;
    margin:0 auto;
}

/* AVENTURA */

.aventura{
    background:#1d70b8;
    padding:22px 20px;
}

.aventura-contenedor{
    width:98%;
    max-width:1200px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:40px;
}

.aventura-texto{
    color:#ffffff;
    font:700 30px/36px "Open Sans",sans-serif;
    text-align:center;
}

.aventura-boton{
    display:inline-block;
    min-width:160px;
    text-align:center;
    background:#034c8c;
    color:#ffffff;
    padding:12px 35px;
    border-radius:30px;
    font:400 20px/20px "Open Sans",sans-serif;
    transition:.25s ease;
}

.aventura-boton:hover{
    background:#02386c;
}

/* INSTALACIONES */

.videos-instalaciones{
    padding:60px 20px;
}

.videos-contenedor{
    width:98%;
    max-width:1100px;
    margin:0 auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:30px;
}

.video-card{
    width:400px;
    aspect-ratio:16/9;
    position:relative;
    overflow:hidden;
    border-radius:18px;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
    background:#ffffff;
}

.video-card:last-child{
    width:400px;
}

.video-card img{
    width:100%;
    display:block;
    transition:transform .6s ease;
}

.video-card:hover img{
    transform:scale(1.05);
}

.video-portada{
    cursor:pointer;
}

.video-real{
    display:block;
    /*display:none;*/
    aspect-ratio:16/9;
}

.video-portada,
.video-real{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* RESPONSIVE */

@media (max-width: 900px){

    .certificaciones{
        padding:45px 23px;
    }

    .certificaciones h2{
        font-size:40px;
        margin-bottom:30px;
    }
    
    .videos-contenedor{
        gap:20px;
    }
    
    .video-card,
    .video-card:last-child{
        width:70%;
    }

    .aventura-contenedor{
        flex-direction:column;
        gap:20px;
    }
    
    .aventura-texto{
        font-size:24px;
        line-height:30px;
    }

    .aventura-boton{
        min-width:140px;
    }
    
}


@media (max-width:600px){

    .certificaciones h2{
        font-size:20px;
        margin-bottom:10px;
    }
    
    .certificaciones{
        padding:25px 10px;
    }
    
    .logo-cambridge{
        max-width:85%;
    }
    
    .video-card,
    .video-card:last-child{
        width:80%;
    }

}