
     .with-bullets {
         list-style: disc !important;
         padding: 15px 0 0 30px !important;
     }

     .content-box ul, 
     .content-box li, 
     .content-box label {
        color: white !important;
    }

    .modal-content ol, 
    .modal-content ul, 
    .modal-content li, 
    .modal-content label {
        color: #333 !important;
    }

    .tab-content-pane ol, 
    .tab-content-pane ul, 
    .tab-content-pane li, 
    .tab-content-pane label {
        color: white !important;
    }

    .inner-modal-table ol,
    .inner-modal-table ul,
    .inner-modal-table li,
    .inner-modal-table label{
        color: #333 !important;
    }


    table {
        color: #333 !important;
    }


   /**==================================HERO CAROUSEL STYLE========================================================== */
     #heroCarousel {
         /* height: 600px; */
         /* height: auto; */
         /* position: relative; */
         margin: 0 0 35px 0;
         /* animation: bounceIn 0.9s ease forwards; */

     }

     .hero-img {
         height: 100vh;
         object-fit: cover;
         /* makes all images same size */
     }

     p.hero-text {
         background: #3e3c3c1c;
         border-radius: 10px;
         padding: 10px;
     }

     .carousel-item .heor-titl,
     .carousel-item .hero-text,
     .carousel-item .hero-btn {
         opacity: 0;
         transform: translateY(20px);

     }

     /* Animate when active */
     .carousel-item.active .heor-titl {
         animation: fadeUp 1s ease forwards;
     }

     .carousel-item.active .hero-text {
         animation: fadeUp 1s ease 0.3s forwards;
     }

     .carousel-item.active .hero-btn {
         animation: fadeUp 1s ease 0.6s forwards;
     }

     .hero-overlay {
         position: relative;
         z-index: 2;
         width: 100%;
         height: 100%;
         display: flex;
         align-items: center;
         justify-content: center;
         background: rgba(0, 0, 0, 0.35);
         /* optional dark overlay */
     }

     /* LEFT GRADIENT PANEL */
     .hero-overlay {
         position: absolute;
         top: 0;
         left: 0;
         height: 100%;
         width: 100%;
         display: flex;
         align-items: center;
         justify-content: center;
         /* padding-left: 5rem; */
     }

     .hero-content {
         margin: auto;
     }

     #modal3 ul {
        list-style: disc !important;
        padding-left: 20px !important;
    }

    #modal3 li {
        color: #000000c9 !important;
    }


   /**============================================================================================ */
     /**     Treks    */
     .trek-info {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
         gap: 20px;
         /* text-align: center; */
     }

     .quick-info-bar {
         max-width: 100vw;
     }

     .info-item-with-icon-text {
         display: flex;
         align-items: center;
         gap: 10px;
         padding: 8px 12px;
         border-radius: 6px;
         min-height: 45px;
         /* compact height */
         flex-wrap: nowrap;
     }

     .info-text {
         display: flex;
         flex-direction: column;
         /* line-height: 1.2; */
         text-align: left;
     }

     .info-item-title {
         margin: 0;
         font-size: 18px;
         font-weight: 600;
     }

     .info-item-desc {
         margin: 2px 0 0;
         font-size: 13px;
         color: #666;
     }

     .info-item-with-icon-text i {
         font-size: 32px;
         color: #fff;
         flex-shrink: 0;
         text-shadow: 0 2px 6px rgb(0 0 0 / 63%);       /*      0 2px 6px rgba(0, 0, 0.22);     */

     }

     @media (max-width: 991px) {
         .quick-info-bar-section .content-box {
             padding: 15 !important;
             border-radius: 0px !important;
         }

         .quick-info-bar {
             border-radius: 0px !important;
         }

         .trek-info {
             /* grid-template-columns: repeat(auto-fit, minmax(100px, 2fr)); */
             grid-template-columns: 1fr 1fr;
             gap: 10px !important;

         }

         .trek-canvus .content-box {
             padding: 20px !important;
         }

         .info-item-with-icon-text i {
             font-size: 28px;
             text-align: center;
         }

         .info-text {
             align-items: flex-start;
         }

         .info-item-title {
             font-size: 14px;
         }

         .info-item-desc {
             font-size: 13px;
         }
     }



     /* RESPONSIVE: MOBILE SINGLE COLUMN */
     @media (max-width: 768px) {
         .trek-button {
             width: auto;
         }
     }

     .accordion-title-desc {
         display: flex;
         flex-direction: column;
         text-align: left;
     }

     .accordion-title {
         font-size: 16px;
         font-weight: 600;
         line-height: 1.2;
     }

     .accordion-desc {
         font-size: 12px;
         font-weight: 400;
         color: #fff;
         margin-top: 2px;
     }

     .button-text {
         display: flex;
         flex-direction: column;
         align-items: flex-start;
         /* heading + desc aligned left */
     }

     .btn-heading {
         font-size: 16px;
         font-weight: 600;
         line-height: 1.2;
     }

     .btn-desc {
         font-size: 12px;
         font-weight: 400;
         color: rgba(255, 255, 255, 0.7);
         margin-top: 2px;
     }
     
     /* TREK BUTTONS */
     .trek-accordion {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
         gap: 10px;
     }


     .trek-button {
         position: relative;
         color: #fff;
         padding: 14px 20px;
         border-radius: 8px;
         border: 1px solid rgb(255 255 255 / 79%);
         cursor: pointer;
         overflow: hidden;
         display: flex;
         justify-content: space-between;
         align-items: center;
         transition: background 0.3s;
         width: auto;
     }

     .trek-button:hover {
         background: #1565c0;
     }

     /* Ripple circle */
     .trek-button .ripple {
         position: absolute;
         border-radius: 50%;
         background: rgba(255, 255, 255, 0.3);
         transform: scale(0);
         animation: rippleEffect 1s infinite;
         pointer-events: none;
     }

     @keyframes rippleEffect {
         0% {
             transform: scale(0);
             opacity: 1;
         }

         50% {
             transform: scale(1.2);
             opacity: 0.6;
         }

         100% {
             transform: scale(2);
             opacity: 0;
         }
     }

     /* MODAL BACKGROUND */
     .modal {
         display: none;
         /* hidden by default */
         position: fixed;
         inset: 0;
         z-index: 1000;

         background-color: rgba(0, 0, 0, 0.6);

         justify-content: center;
         align-items: flex-start;

         padding: 40px 16px;
         overflow-y: auto;
     }



     .modal-content {
         background: #fdfdfd;
         padding: 25px 30px;

         width: 100%;
         max-width: 650px;

         /* 👇 THIS enables scrolling */
         max-height: calc(100vh - 80px);
         overflow-y: auto;

         border-radius: 12px;
         box-shadow: 0 10px 35px rgba(0, 0, 0, 0.2);

         position: relative;
         font-family: Arial, sans-serif;
         line-height: 1.6;
     }


     .modal-heading {
         font-size: 22px;
         font-weight: 700;
         margin-bottom: 10px;
         color: #1e3a8a;
         /* subtle blue for headings */
     }

     .modal-subheading {
         font-size: 14px;
         font-weight: 500;
         color: #555 !important;
         margin-bottom: 15px;
     }
     .modal-subheading i {
        font-size: 20px;
        color: #1e3a8a;
     }

     .modal-text {
         font-size: 15px;
         color: #333 !important;
         margin-bottom: 15px;
     }
     
    .modal-text ol,
    .modal-text ul,
    .modal-text li,
    .modal-text label {
        font-size: 15px;
        color: #333 !important;
        margin-bottom: 15px;
    }

     .with-bullets {
        font-size: 15px;
         /* color: #333 !important; */
         margin-bottom: 15px;
    }

    .with-index {
        font-size: 15px;
         color: #333 ;
         margin-bottom: 15px;
         list-style-type: decimal ;
         padding-left: 10px;
    }

    .with-index ol, 
    .with-index ul, 
    .with-index label {
        font-size: 15px;
         /* color: #333 ; */
         margin-bottom: 15px;
         /* list-style-type: decimal !important; */
         padding-left: 10px;

    }

    .inner-modal-table  {
        font-size: 15px;
         /* color: #333 ; */
         margin-bottom: 15px;
    }

     /* Close button */
     .modal .close {
         position: absolute;
         top: 15px;
         right: 20px;
         font-size: 26px;
         font-weight: bold;
         color: #333;
         cursor: pointer;
         transition: color 0.2s;
     }

     .modal .close:hover {
         color: #d33;
     }


     @keyframes popUp {
         from {
             transform: scale(0.7);
             opacity: 0;
         }

         to {
             transform: scale(1);
             opacity: 1;
         }
     }

     /* RESPONSIVE: MOBILE FIX */
     @media (max-width: 768px) {
         .trek-accordion {
             grid-template-columns: 1fr;
             justify-items: center;
         }

         .trek-button {
             width: 100%;
             max-width: 500px;
             justify-content: center;
         }
     }

                 .modal-header {
                     flex-shrink: 0;
                     background: #fff;
                     padding-bottom: 10px;
                     border-bottom: 1px solid #eee;
                     z-index: 20;
                 }

                 /* DAY TABS */
                 .day-tabs {
                     display: flex;
                     gap: 8px;
                     overflow-x: auto;
                     overflow-y: auto;
                     white-space: nowrap;
                     padding-bottom: 8px;
                     margin-bottom: 20px;
                     position: sticky;
                     top: 0;
                     background: #fff;
                     z-index: 20;
                 }

                 .day-tab {
                     flex-shrink: 0;
                     padding: 8px 14px;
                     border-radius: 20px;
                     border: 1px solid #1e3a8a;
                     background: #fff;
                     color: #1e3a8a;
                     cursor: pointer;
                 }

                 .day-tab.active {
                     background: #1e3a8a;
                     color: white;
                 }

                 /* DAY CONTENT */
                 .day-content {
                     display: none;
                 }

                 .day-content.active {
                     display: block;
                 }

                 /* NAVIGATION BUTTONS */
                 .day-navigation {
                     display: flex;
                     justify-content: space-between;
                     margin-top: 25px;
                 }

                 .nav-btn {
                     padding: 10px 18px;
                     border-radius: 8px;
                     background: #1e3a8a;
                     color: white;
                     border: none;
                     cursor: pointer;
                 }

                 .nav-btn:disabled {
                     visibility: hidden;
                 }

                 /* MOBILE */
                 @media (max-width: 600px) {
                     .day-navigation {
                         flex-direction: column;
                         gap: 10px;
                     }
                 }


                 /* Image gallery section  */
                 .day-gallery {
                     display: grid;
                     grid-template-columns: 2fr 1fr;
                     gap: 10px;
                     margin: 15px 0 25px;
                 }

                 .img-large {
                     width: 100%;
                     height: 260px;
                     object-fit: cover;
                     border-radius: 10px;
                     cursor: pointer;
                 }

                 .img-stack {
                     display: grid;
                     gap: 10px;
                 }

                 .img-stack img {
                     width: 100%;
                     height: 125px;
                     object-fit: cover;
                     border-radius: 10px;
                     cursor: pointer;
                 }

                 /* MOBILE */
                 @media (max-width: 768px) {
                     .day-gallery {
                         grid-template-columns: 1fr;
                     }

                     .img-large,
                     .img-stack img {
                         height: auto;
                     }
                 }

                 .inner-modal-incon-text {
                    align-items: left;
                 }
                 .inner-modal-incon-text-size strong {
                    font-size: 20px;;
                 }
                 .inner-modal-ititle-desc {
                    display: grid;
                    grid-template-columns: 200px 1fr;   /*  repeat(auto-fit, minmax(200px, 1fr));   */
                    gap: 5px;
                    margin-bottom: 5px;
                 }
                 .inner-modal-ititle-desc i {
                    font-size: 65px;
                    color: #1e3a8a;
                 }



     .popular-locations {
         padding: 15px;
     } 
     .image-card {
         position: relative;
         border-radius: 16px;
         overflow: hidden;
     } 

     /* Image */
     .image-card img {
         width: 100%;
         height: 260px;
         object-fit: cover;
     }
/* Prevent vertical stretching */
.splide,
.splide__track,
.splide__list {
  height: auto !important;
}

/* Slide should wrap content only */
/* .splide__slide {
  height: auto !important;
  display: flex;
  align-items: stretch;
} */


/* Pagination container */
.splide__pagination {
  position: relative;
  margin-top: 20px;
}

/* All dots */
.splide__pagination__page {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: 0 6px;
  background: linear-gradient(145deg, #555, #2a2a2a36);
  opacity: 0.7;
  transition: all 0.3s ease;
}

/* Active dot */
.splide__pagination__page.is-active {
  background: #0d6efd; /* Bootstrap blue */
  opacity: 1;
  transform: scale(1.2);
}