/* ===========================
   Mobile Responsive
=========================== */

@media (max-width:768px){

    section{
        padding:70px 0;
    }

    /* Navbar */

    .navbar{
        padding:12px 0;
    }

    .logo{
        height:50px;
    }

    .navbar-collapse{
        background:#fff;
        margin-top:15px;
        padding:20px;
        border-radius:12px;
        box-shadow:0 10px 25px rgba(0,0,0,.08);
    }

    .navbar-nav{
        text-align:center;
    }

    .nav-link{
        margin:10px 0;
    }

    .quote-btn{
        display:block;
        width:200px;
        margin:20px auto 0;
        text-align:center;
    }

    /* Hero */

    .hero{
        min-height:auto;
        padding:120px 0 70px;
    }

    .hero h1{
        font-size:38px;
        line-height: 1.2;
    }

    .hero p{
        font-size:16px;
        line-height: 1.7;
    }

    .hero-btns{
        display:flex;
        flex-direction:column;
        gap:15px;
        align-items:center;
    }

    .btn1,
    .btn2{
        display:block;
        width:200px;
        margin:0;
        text-align:center;
    }

    /* About */

    .about-image{
        margin-right:0;
        margin-bottom:30px;
    }

    .experience-box{
        position:static;
        margin-top:20px;
    }

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

    /* Products */

    .product-card img{
        height:220px;
    }

    /* Gallery */

    .gallery-card img{
        height:250px;
    }

    .video-card{
        width:100%;
    }

    .video-card video{
        height:350px;
    }

    /* Contact */

    .contact-box{
        flex-direction:column;
        text-align:center;
    }

    .contact-form{
        margin-top:30px;
    }

    /* Footer */

    .footer{
        text-align:center;
    }

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

}