/*=========================================================
        Sri Langta Baba Aviation
        Responsive CSS
=========================================================*/


/*==============================
        Large Laptop
===============================*/

@media (max-width:1200px){

    .container{
        width:95%;
    }

    .hero h1{
        font-size:58px;
    }

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

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

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

}


/*==============================
        Tablet
===============================*/

@media (max-width:991px){

    .header{
        padding:15px 0;
    }

    .mobile-menu{
        display:block;
    }

    .navbar{
        position:absolute;
        top:100%;
        left:0;
        width:100%;
        background:#081B3A;
        display:none;
        padding:20px 0;
    }

    .navbar.active{
        display:block;
    }

    .navbar ul{
        flex-direction:column;
        text-align:center;
        gap:18px;
    }

    .header-btn{
        display:none;
    }

    .hero{
        text-align:center;
    }

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

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

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

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

    .why-us .container{
        grid-template-columns:1fr;
    }

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

    .fleet-grid{
        grid-template-columns:1fr;
    }

    .features{
        grid-template-columns:1fr;
    }

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

    .testimonial-wrapper{
        grid-template-columns:1fr;
    }

    .news-grid{
        grid-template-columns:1fr;
    }

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

}


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

@media (max-width:576px){

    .hero{
        min-height:90vh;
    }

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

    .hero p{
        font-size:15px;
    }


    /* ==========================
       MOBILE HERO BUTTONS
    =========================== */

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


    /* ==========================
       MOBILE BUTTON FIX
       Buttons will NOT become
       full width
    =========================== */

    .btn{
        width:auto;
        min-width:0;
        max-width:100%;

        padding:11px 20px;

        font-size:14px;
        line-height:1;

        text-align:center;
        white-space:nowrap;
    }


    .section-title h2{
        font-size:30px;
    }

    .about-right h2{
        font-size:30px;
    }

    .why-us h2{
        font-size:30px;
    }

    .service-grid{
        grid-template-columns:1fr;
    }

    .counter .container{
        grid-template-columns:1fr;
    }

    .counter-box h2{
        font-size:42px;
    }

    .footer-bottom{
        font-size:14px;
        line-height:1.7;
    }

    .logo img{
        width:150px;
    }

    .back-to-top{
        width:45px;
        height:45px;
        right:15px;
        bottom:15px;
    }

    .whatsapp{
        width:50px;
        height:50px;
        left:15px;
        bottom:15px;
        font-size:24px;
    }

}