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

@media (max-width:992px){

.container{
    width:92%;
}

/* HEADER */

.header .container{
    height:80px;
}

.logo img{
    width:145px;
}

.nav-links{
    gap:25px;
}

.btn-header{
    padding:13px 22px;
}

/* HERO */

.hero{
    padding:150px 0 80px;
}

.hero-grid{
    grid-template-columns:1fr;
    text-align:center;
    gap:60px;
}

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

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

.hero-buttons{
    justify-content:center;
}

.hero-image img{
    margin:auto;
    max-width:550px;
}

/* SERVICIOS */

.services-grid{
    grid-template-columns:repeat(2,1fr);
}

/* PORTAFOLIO */

.portfolio-grid{
    grid-template-columns:repeat(2,1fr);
}

/* NOSOTROS */

.about-grid{
    grid-template-columns:1fr;
    text-align:center;
}

.about h2{
    text-align:center;
}

.about-list{
    grid-template-columns:1fr;
}

/* POR QUÉ ELEGIRNOS */

.why-grid{
    grid-template-columns:repeat(2,1fr);
}

/* ESTADÍSTICAS */

.stats-grid{
    grid-template-columns:repeat(2,1fr);
}

/* FOOTER */

.footer-grid{
    grid-template-columns:1fr;
    text-align:center;
}

.footer-about img{
    margin:0 auto 20px;
}

.footer-social{
    justify-content:center;
}

}

@media (max-width:768px){

/* HEADER */

.menu-btn{
    display:block;
    color:#fff;
}

.navbar{

    position:absolute;

    top:85px;

    left:0;

    width:100%;

    background:#071327;

    display:none;

}

.navbar.active{
    display:block;
}

.nav-links{

    flex-direction:column;

    gap:25px;

    padding:35px 0;

    text-align:center;

}

.btn-header{
    display:none;
}

/* HERO */

.hero{
    padding:140px 0 70px;
}

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

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

.hero-buttons{
    flex-direction:column;
    align-items:center;
}

.btn-primary,
.btn-secondary{
    width:250px;
    text-align:center;
}

/* TÍTULOS */

.services h2,
.portfolio h2,
.about h2,
.why-us h2,
.contact h2{
    font-size:34px;
}

/* GRID */

.services-grid,
.portfolio-grid,
.why-grid,
.stats-grid{
    grid-template-columns:1fr;
}

.contact-form{
    padding:30px;
}

.whatsapp{
    width:58px;
    height:58px;
    font-size:30px;
    right:18px;
    bottom:18px;
}

}

@media (max-width:576px){

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

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

.btn-primary,
.btn-secondary{
    width:100%;
}

.service-card,
.portfolio-card,
.why-card,
.stat-card{
    padding:25px;
}

.service-card img{
    width:80px;
}

.contact-form{
    padding:25px;
}

.footer{
    padding:50px 0 20px;
}

}