/* =========================================
   TABLET (992px and below)
========================================= */

@media (max-width:992px){

    .navbar{
        padding:14px 20px;
    }

    .nav-links{
        display:none;
    }

.nav-links.active{

    display:flex;

    flex-direction:column;

    position:absolute;

    top:75px;

    left:60%;

    width:40%;

    padding:15px 20px;

    background:rgba(255,255,255,.97);

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    border-radius:25px;

    box-shadow:0 15px 35px rgba(0,0,0,.12);

    gap:18px;

}

    .nav-links.active a{

        color:var(--primary);

    }

    .nav-actions .btn{
        display:none;
    }

    .menu-toggle{
        display:flex;
        justify-content:center;
        align-items:center;
    }

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

    .hero h2{
        font-size:48px;
    }

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

    .booking-card{

    position:static;

    width:100%;

    max-width:420px;

    margin:50px auto 0;

}

    .stats-grid,
    .services-grid,
    .destination-grid,
    .package-grid,
    .testimonial-grid,
    .contact-container,
    .why-container{

        grid-template-columns:1fr 1fr;

    }
    .scroll-indicator{
    display:none;
}

}


/* =========================================
   MOBILE (768px and below)
========================================= */

@media (max-width:768px){

    /* =========================
       HERO
    ========================= */

    .hero{

        min-height:100vh;

        height:auto;

        margin:0;

    }

    .hero::before{

        height:100%;

    }

    .hero h2{

        font-size:38px;

    }

    .hero p{

        font-size:16px;

    }


    /* =========================
       STATS - 2 × 2 GRID
    ========================= */

    .stats-grid{

        display:grid;

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

        width:100%;

        gap:12px;

    }

    .stats-grid > *{

        min-width:0;

        max-width:100%;

    }


    /* =========================
       SERVICES - 2 × 2 GRID
    ========================= */

    .services-grid{

        display:grid;

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

        gap:14px;

        width:100%;

    }

    .services-grid > *{

        min-width:0;

    }


    /* =========================
       POPULAR DESTINATIONS SLIDER
    ========================= */

    .destination-grid{

        display:flex;

        overflow-x:auto;

        gap:16px;

        scroll-snap-type:x mandatory;

        padding-bottom:10px;

        width:100%;

        overscroll-behavior-x:contain;

        overscroll-behavior-y:auto;

    }

    .destination-card{

        flex:0 0 85%;

        min-width:0;

        scroll-snap-align:start;

    }

    /* =========================
       PACKAGE SLIDER
    ========================= */

    .package-grid{

        display:flex;

        overflow-x:auto;

        gap:16px;

        scroll-snap-type:x mandatory;

        padding-bottom:10px;

        width:100%;

    }

    .package-card{

        flex:0 0 85%;

        min-width:0;

        scroll-snap-align:start;

    }


    /* =========================
       REVIEWS SLIDER
    ========================= */

    .testimonial-grid{

        display:flex;

        overflow-x:auto;

        gap:16px;

        scroll-snap-type:x mandatory;

        padding-bottom:10px;

        width:100%;

    }

    .testimonial-card{

        flex:0 0 85%;

        min-width:0;

        scroll-snap-align:start;

    }


    /* =========================
       WHY CHOOSE US
    ========================= */

    .why-container{

        display:grid;

        grid-template-columns:1fr;

        width:100%;

    }

    .why-grid{

        display:grid;

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

        gap:14px;

    }

    .why-grid > *{

        min-width:0;

    }


    /* =========================
       CONTACT
    ========================= */

    .contact-container{

        grid-template-columns:1fr;

    }


    /* =========================
       HIDE SLIDER SCROLLBARS
    ========================= */

    .destination-grid::-webkit-scrollbar,
    .package-grid::-webkit-scrollbar,
    .testimonial-grid::-webkit-scrollbar{

        display:none;

    }


    /* =========================
       MOBILE CONTAINER
    ========================= */

    .container{

        width:92%;

    }


    /* =========================
       HIDE SCROLL INDICATOR
    ========================= */

    .scroll-indicator{

        display:none;

    }
    /* ===============================
    FIX REVIEW CARD MOVEMENT ON MOBILE
    ================================== */
    .destination-card.reveal,
    .destination-card.reveal.active,
    .package-card.reveal,
    .package-card.reveal.active,
    .testimonial-card.reveal,
    .testimonial-card.reveal.active{
        transform:none;

        opacity:1;

    }

}


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

@media (max-width:992px){

    .navbar{

        padding:10px 14px;

    }

    .logo img{

        width:170px;

        height:60px;

    }

    .menu-toggle{

        flex-shrink:0;

        width:44px;

        height:44px;

    }


    .footer-container{

        grid-template-columns:1fr 1fr;

        gap:40px;

    }

}

@media (max-width:768px){

    .footer-container{

        grid-template-columns:1fr;

        gap:35px;

    }

    .footer-bottom .container{

        flex-direction:column;

        text-align:center;

    }

}