/* =========================
   RESPONSIVE
========================= */

@media(max-width:1200px){

    .container{

        width:94%;

    }

}

/* =========================
   TABLET
========================= */

@media(max-width:992px){

    .hero h1{

        font-size:48px;

    }

    .about-grid,
    .contact-grid{

        grid-template-columns:1fr;

    }

    .stats-grid{

        grid-template-columns:repeat(2,1fr);

    }

    .process-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

/* =========================
   MOBILE MENU
========================= */

@media(max-width:768px){

    .nav{

        position:absolute;

        top:80px;

        left:0;

        width:100%;

        background:white;

        flex-direction:column;

        padding:25px;

        display:none;

        box-shadow:0 10px 30px rgba(0,0,0,0.08);

    }

    .nav.active{

        display:flex;

    }

    .menu-toggle{

        display:block;

    }

    .hero{

        height:auto;

        padding:140px 0 100px;

    }

    .hero h1{

        font-size:38px;

        line-height:1.2;

    }

    .hero-buttons{

        flex-direction:column;

        gap:15px;

    }

    .section-header h2{

        font-size:30px;

    }

    .about-content h2,
    .contact-form h2{

        font-size:30px;

    }

    .gallery-grid{

        columns:1;

    }

    .process-grid,
    .stats-grid{

        grid-template-columns:1fr;

    }

    .contact-form,
    .contact-info{

        padding:25px;

    }

    #cookieBanner{

        flex-direction:column;

        gap:15px;

        text-align:center;

    }

}

/* =========================
   SMALL MOBILE
========================= */

@media(max-width:480px){

    .hero h1{

        font-size:30px;

    }

    .hero p{

        font-size:15px;

    }

    .btn{

        width:100%;

        text-align:center;

    }

    .section-header h2{

        font-size:26px;

    }

    .contact-form h2{

        font-size:26px;

    }

    .whatsapp-float{

        width:55px;

        height:55px;

        font-size:24px;

    }

}

@media(max-width:768px){

    .footer-grid{

        grid-template-columns:1fr;

        text-align:center;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

    }

    .footer-legal{

        justify-content:center;

        flex-wrap:wrap;

    }

}

.footer-logo{

    width:220px;

}