body {

    overflow-x: hidden;

}



.main-img {

    width: 100%;

    height: 500px;

    box-shadow: 0px 0px 3px grey;

    margin: auto;

    position: relative;

    overflow: hidden;

}



.slide {

    width: 100%;

    height: 100%;

    position: absolute;

    transition: 1s;

}



/* Sticky Navigation */

/* Sticky Navigation */

.tour-nav {

    position: sticky;

    top: 0px;

    background: #000;

    padding: 15px 0;

    z-index: 559;

}



/* Inline List */

.tour-nav ul {

    list-style: none;

    display: flex;

    /* justify-content: center; */

    gap: 35px;

    margin: 0 25px;

    padding: 0;

}



/* Links */

.tour-nav ul li a {

    text-decoration: none !important;

    color: #D2D026;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: 1px;

    padding-bottom: 5px;

    transition: 0.3s ease;

}



/* Hover */

.tour-nav ul li a:hover {

    color: #15593B;

}



/* Active Link */

.tour-nav ul li a.active {

    color: #15593B;

    border-bottom: 2px solid #D2D026;

}



/* Mobile Responsive */

/* Mobile Responsive */

@media (max-width: 991px) {



    .tour-nav {

        position: relative;

        /* remove sticky */

        top: auto;

        padding: 10px 0;

        width: 100%;

    }



    .tour-nav ul {

        list-style: none;

        display: flex;

        flex-wrap: nowrap;

        /* 🔥 prevent wrapping */

        overflow-x: auto;

        /* horizontal scroll */

        white-space: nowrap;

        /* extra safety */

        gap: 20px;

        margin: 0 15px;

        padding: 0;

        justify-content: flex-start;

        /* better than center for scroll */



        scrollbar-width: none;

        /* Firefox */

    }



    .tour-nav ul::-webkit-scrollbar {

        display: none;

        /* Chrome/Safari */

    }



    .tour-nav ul li {

        flex: 0 0 auto;

        /* prevent shrinking */

    }



    .tour-nav ul li a {

        text-decoration: none !important;

        color: #D2D026;

        font-weight: 600;

        text-transform: uppercase;

        letter-spacing: 0.5px;

        font-size: 13px;

        padding-bottom: 3px;

        display: inline-block;

    }



    .tour-nav ul li a:hover {

        color: #15593B;

    }



    .tour-nav ul li a.active {

        color: #15593B;

        border-bottom: 2px solid #D2D026;

    }



    .goverlay {

        height: calc(110vh + 1px) !important;

    }



    .glightbox-clean .gclose {

        top: 200px !important;

    }

}





/* Section Styling */

.tour-section {

    min-height: 100vh;

    padding: 100px 40px;

    background: #000;

    color: #D2D026;

    border-bottom: 1px solid #15593B;

}



/* ===== MAIN SLIDER STYLES ===== */

/* Main wrapper - self-contained */

/* Your existing CSS remains exactly the same */



/* ===============================

   WRAPPER

=================================*/

.tour-slider-wrapper {

    width: 100%;

    display: flex;

    justify-content: center;

    align-items: center;

    padding: 0px 0;

}



/* ===============================

   SLIDER STRUCTURE

=================================*/

.cards-slider {

    width: 100%;

    display: flex;

    justify-content: center;

    overflow: hidden;

}



.slider-track-container {

    width: 380px;

    overflow: hidden;

    position: relative;

}



.slider-track {

    display: flex;

    gap: 15px;

    transition: transform 0.6s ease;

}



/* ===============================

   CARD (380 x 480)

=================================*/

.slider-card {

    flex: 0 0 350px;

    width: 380px;

    height: 100% !important;

    background: #161616;

    border-radius: 22px;

    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);

    padding: 15px 15px;

    display: flex;

    transition: 0.4s ease;

}



.slider-card:hover {

    transform: translateY(-8px);

    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.12);

}



.card-content {

    width: 100%;

    display: flex;

    flex-direction: column;

    gap: 0px;

}



/* ===============================

   PREMIUM MARQUEE OFFER

=================================*/

.offer-heading {

    font-size: 19px;

    font-weight: 700;

    text-align: center;

    padding: 12px 20px;

    margin-bottom: 15px;

    color: #0cbd6e;

    background: linear-gradient(to right, rgba(21, 89, 59, 0.08), rgba(21, 89, 59, 0.15));

    border-radius: 12px;

    letter-spacing: 0.5px;

    border: 1px solid rgba(21, 89, 59, 0.2);

    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);

    transition: 0.3s ease;

}



.offer-heading:hover {

    transform: translateY(-2px);

    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);

}



/* ===============================

   DATE

=================================*/

.tour-date {

    display: flex;

    align-items: center;

    gap: 12px;

    font-size: 16px;

    font-weight: 600;

    color: #ffffff;

}



.tour-date i {

    color: #1f7a56;

}





/* ===============================

   PRICE

=================================*/

/* .tour-price {

    background: linear-gradient(135deg, #15593B, #1f7a56);

    color: white;

     padding: 30px;

    border-radius: 20px;

    box-shadow: 0 12px 25px rgba(21, 89, 59, 0.25); 

} */



.tour-price i {

    margin-right: 6px;

    font-size: 20px;

}



.tag-pr {

    background: linear-gradient(135deg, #18593B 0%, #D3CF00 100%) !important;

    color: white !important;

    padding: 1px 10px;

    border-radius: 8px 20px 8px 20px;

    font-size: 12px;

}



.price-amount {

    font-size: 26px;

    font-weight: 800;

    margin-top: 10px;

}



.tour-price p {

    margin-top: 8px;

    font-size: 14px;

    opacity: 0.85;

}



/* ===============================

   SEATS

=================================*/

.tour-seats {

    display: flex;

    flex-direction: column;

    gap: 8px;

    background: #222;

    padding: 16px;

    border-radius: 18px;

    font-weight: 600;

    font-size: 14px;

    color: #fff;

}



.seat-info {

    display: flex;

    align-items: center;

    gap: 8px;

}



.seat-info i {

    color: #FFD700;

}



/* Progress Bar */

.seat-progress {

    width: 100%;

    height: 8px;

    background: #333;

    border-radius: 10px;

    overflow: hidden;

}



.seat-fill {

    height: 100%;

    width: 0%;

    background: linear-gradient(90deg, #D2D026, #1f7a56);

    transition: width 1.8s cubic-bezier(.22, .61, .36, 1);

    border-radius: 10px;

    box-shadow: 0 0 10px rgba(210, 208, 38, 0.6);

}



/* ===============================

   BUTTON

=================================*/

.btn-pay-now {

    padding: 12px;

    border: none;

    border-radius: 18px;

    background: linear-gradient(135deg, #D2D026, #e6e243);

    font-size: 16px;

    font-weight: 800;

    color: #2a4a1f;

    cursor: pointer;

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 10px;

    transition: 0.3s ease;

    box-shadow: 0 8px 20px rgba(210, 208, 38, 0.35);

    margin-top: 25px;

}



.btn-pay-now:hover {

    transform: translateY(-3px);

}





/* ===============================

   DOTS

=================================*/

.slider-dots {

    margin-top: 25px;

    display: flex;

    justify-content: center;

    gap: 8px;

}



.slider-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    background: #cfd8d5;

    cursor: pointer;

    transition: 0.3s ease;

}



.slider-dot.active {

    background: #15593B;

    width: 26px;

    border-radius: 12px;

}



/* ===============================

   RESPONSIVE

=================================*/

@media (max-width: 768px) {



    .slider-track-container {

        width: 300px;

    }



    .slider-card {

        flex: 0 0 300px;

        width: 300px;

        height: 100% !important;

        padding: 25px 20px;

    }



    .card-content {

        gap: 30px;

    }



    .price-amount {

        font-size: 24px;

    }



    .btn-pay-now {

        padding: 15px;

        font-size: 14px;

    }

}





/* ===== CUSTOM SLIDER (YOUTUBE) ===== */

.cust-slider {

    background: rgba(63 57 57 / 50%);

    text-align: center;

    padding: 10px;

}



.cust-slider-video {

    position: relative;

    /* padding-top: 56.25%; */

}



.cust-slider-video iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}



.cust-slider-dots {

    margin-top: 10px;

}



.cust-dot {

    display: inline-block;

    font-size: 22px;

    padding: 0 6px;

    cursor: pointer;

    color: #ffffff;

    transition: 0.3s;

}



.cust-dot:hover {

    transform: scale(1.4);

    color: #28a745;

}



.cust-dot.active {

    color: #28a745;

}



/* ===== CHECKLIST STYLES ===== */

.cust-check-list {

    list-style: none;

    padding: 0;

    margin: 0;

}



.cust-check-list li {

    display: flex;

    align-items: flex-start;

    margin-bottom: 12px;

    font-size: 16px;

    color: var(--white);

}



.cust-check-list li i {

    color: #D2D026;

    margin-right: 10px;

    margin-top: 4px;

}



/* ===== TIME SCHEDULE ===== */

.time-schedule {

    list-style: none;

    padding: 0;

    margin: 0;

    display: flex;

    gap: 20px;

    align-items: center;

}



.time-item {

    display: flex;

    align-items: center;

    gap: 15px;

    padding: 18px 20px;

    margin-bottom: 15px;

    background: #111;

    border-radius: 12px;

    transition: 0.3s ease;

}



.time-item:hover {

    background: #1a1a1a;

    transform: translateY(-3px);

}



.icon {

    font-size: 22px;

    color: #D2D026;

    min-width: 30px;

}



.time-content h5 {

    margin: 0;

    font-size: 16px;

    font-weight: 600;

    color: #ffffff;

}



.time-content p {

    margin: 4px 0 0;

    font-size: 14px;

    color: #ffffff;

}



/* ===== ITINERARY/DAY CARDS ===== */

#itinerary {

    padding: 0px 0px;

    display: flex;

    justify-content: center;

}



.cards-wrapper {

    position: relative;

    height: 260px;

    width: 100%;

    max-width: 820px;

}



.day-card {

    position: absolute;

    width: 480px;

    height: 260px;

    border-radius: 24px;

    display: flex;

    overflow: hidden;

    cursor: pointer;

    transition: all 0.35s ease;

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

}



.day-card.active {

    left: 0 !important;

    bottom: -5px !important;

    z-index: 50 !important;

    transform: translateY(-8px) scale(1.02);

}



/* Day Label */

.card-day-label {

    width: 65px;

    display: flex;

    align-items: center;

    justify-content: center;

    writing-mode: vertical-rl;

    font-weight: 700;

    font-size: 1.8rem;

    color: #fff;

    background: rgba(0, 0, 0, 0.2);

}



/* Content */

.card-list {

    flex: 1;

    padding: 20px 30px;

    overflow-y: auto;

}



.card-list ul {

    list-style: none;

    padding: 0;

    margin: 0;

}



.card-list li {

    font-size: 0.9rem;

    padding: 6px 0;

    color: #fff;

    border-bottom: 1px dashed rgba(255, 255, 255, 0.35);

}



.card-list li:last-child {

    border-bottom: none;

}



/* ===== INCLUSION/EXCLUSION LISTS ===== */

.inclusion-list {

    list-style: none;

    padding: 0;

    margin: 0;

}



.inclusion-list li {

    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-bottom: 14px;

    font-size: 15px;

    color: #ffffff;

    line-height: 1.6;

}



.inclusion-list li i {

    color: #D2D026;

    font-size: 18px;

    margin-top: 4px;

    min-width: 20px;

}



.exclusion-list {

    list-style: none;

    padding: 0;

    margin: 0;

}



.exclusion-list li {

    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-bottom: 14px;

    font-size: 15px;

    color: #ffffff;

    line-height: 1.6;

}



.exclusion-list li i {

    color: #D2D026;

    font-size: 18px;

    margin-top: 4px;

    min-width: 20px;

}



/* ===== GALLERY STYLES ===== */

.photos-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 10px;

    padding: 20px;

}



.sub-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 10px;

}



.img-box {

    overflow: hidden;

    border-radius: 8px;

}



.img-box img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

    transition: 0.4s ease;

    cursor: pointer;

}



.img-box:hover img {

    transform: scale(1.05);

}



/* Lightbox Fix */

.glightbox-container .gslide-image img {

    max-width: 100% !important;

    max-height: 90vh !important;

    object-fit: contain !important;

}



/* ===== RESPONSIVE STYLES ===== */

@media (max-width: 768px) {



    /* Day Cards Responsive */

    .cards-wrapper {

        height: auto;

        display: flex;

        flex-direction: column;

        gap: 20px;

    }



    .day-card {

        position: relative;

        width: 100%;

        height: auto;

        left: 0 !important;

        transform: none !important;

    }



    .card-day-label {

        writing-mode: horizontal-tb;

        width: 100%;

        padding: 12px;

        font-size: 1.2rem;

    }



    .card-day-label {

        width: 65px !important;

    }



    /* Gallery Responsive */

    .photos-grid {

        grid-template-columns: 1fr;

    }



    .sub-grid {

        grid-template-columns: 1fr 1fr;

    }



    .time-schedule {

        flex-direction: column;

        align-items: unset;

    }

}