@media(max-width:992px){

    .split{

        grid-template-columns:1fr;

    }

    .vm-grid{

        grid-template-columns:1fr;

    }

    .values-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:768px){

    .values-grid{

        grid-template-columns:1fr;

    }

    .section-header h2{

        font-size:36px;

    }

    .split-content h2{

        font-size:34px;

    }

}
/*======================================
GLOBAL RESPONSIVE
======================================*/

.menu-toggle{
    display:none;
}

@media (max-width:991px){

    /* Hide top bar */
    .top-bar{
        display:none;
    }

    /* Navbar */
    nav{
        top:0;
        height:80px;
    }

    nav .container{
        height:80px;
    }

    .logo img{
        width:140px;
    }

    /* Mobile menu button */
    .menu-toggle{
        display:block;
        font-size:30px;
        color:#D4AF37;
        cursor:pointer;
    }

    /* Navigation */
    .nav-links{
        position:absolute;
        top:80px;
        left:0;
        width:100%;
        background:#111;
        display:none;
        flex-direction:column;
        gap:25px;
        padding:30px 0;
        text-align:center;
    }

    .nav-links.active{
        display:flex;
    }

    .quote-btn{
        display:none;
    }

    /* Hero */

    .hero{
        padding-top:110px;
        min-height:700px;
    }

    .hero-content{
        text-align:center;
        max-width:100%;
    }

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

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

    /* Layouts */

    .about-wrapper,
    .about-grid,
    .contact-wrapper,
    .contact-grid,
    .quotation-grid,
    .about-why-grid{
        grid-template-columns:1fr;
    }

    .products-grid,
    .services-grid,
    .gallery-grid,
    .projects-grid,
    .process-grid,
    .why-grid,
    .stats-grid,
    .trusted-grid{
        grid-template-columns:repeat(2,1fr);
    }

}


/*======================================
PHONE
======================================*/

@media (max-width:768px){

    .container{
        width:94%;
    }

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

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

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

    .products-grid,
    .services-grid,
    .gallery-grid,
    .projects-grid,
    .process-grid,
    .why-grid,
    .stats-grid,
    .trusted-grid,
    .features{
        grid-template-columns:1fr;
    }

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

    .banner-content h1{
        font-size:36px;
    }

    .contact-form button{
        width:100%;
    }

}