/* css of nav and hero-section  */

     :root {
         --font-heading: 'Playfair Display', serif;
         --font-body: 'Poppins', sans-serif;
         --reach-font-display: 'Playfair Display', serif;
         --reach-font-body: 'Poppins', sans-serif;
         --reach-dark: #0f172a;
         --reach-gray: #64748b;
         --reach-light-gray: #f1f5f9;
         --reach-border: #e2e8f0;

         /* hotel */

         --nest-gold: #d8a13b;
         --nest-gold-light: #d4b87a;
         --nest-dark: #013274;
         --nest-darker: #013274;
         --nest-card: #f6f6f6;
         --nest-card-hover: #1a1a1a;
         --nest-text: #050505;
         --nest-muted: #013274;
         --nest-border: #222222;
         --nest-font-display: 'Playfair Display', serif;
         --nest-font-body: 'Inter', sans-serif;


         /* transport  */


         --amc-primary: #d8a13b;
         --amc-primary-dark: #d8a13b;
         --amc-dark: #013274;
         --amc-darker: #ffff;
         --amc-gray: #05647e;
         --amc-light: #013274;
         --amc-white: #ffffff;
         --amc-border: #e2e8f0;
         --amc-text: rgb(3, 2, 2);
         --amc-font: 'Inter', sans-serif;


         /* booking */

         --primary-dark: #1a1a2e;
         --accent: #2d2d44;
         --text-muted: #6c757d;


         /* Tour Details */

         --trip-ink: #121212;
         --trip-muted: #d4d4d4;
         --trip-blue: #079bd7;


         /* Popular place  */

         --primary: #1e40af;
         --primary-light: #3b82f6;
         --text-dark: #1e293b;
         --text-muted: #64748b;

     }

     * {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
     }

     body {
         font-family: var(--font-body);
         overflow-x: hidden;
         background: #0f172a;
     }

     /* ===== NAVBAR ===== */


     /* ==============================
   NAVBAR ALIGNMENT
============================== */

     .main-navbar {
         width: 100%;
         height: 84px;
         position: fixed;
         top: 0;
         left: 0;
         z-index: 1000;
     }

     .navbar-inner {
         width: min(1320px, calc(100% - 48px));
         height: 100%;
         margin: 0 auto;

         display: flex;
         align-items: center;
         justify-content: space-between;
         gap: 30px;
     }

     /* ==============================
   NAVBAR LOGO
============================== */

     .nav-logo {
         width: 150px;
         height: 58px;
         flex: 0 0 150px;

         display: flex;
         align-items: center;
         justify-content: flex-start;
         overflow: hidden;
     }

     .nav-logo img {
         display: block;
         width: 100%;
         height: 100%;
         object-fit: contain;
         object-position: left center;
     }

     /* ==============================
   DESKTOP LINKS
============================== */

     .nav-links {
         display: flex;
         align-items: center;
         justify-content: center;
         gap: 30px;

         margin: 0;
         padding: 0;
         list-style: none;
     }

     .nav-links li {
         display: flex;
         align-items: center;
     }

     .nav-links a {
         display: inline-flex;
         align-items: center;
         min-height: 40px;
         color: #ffffff;
         text-decoration: none;
     }

     /* ==============================
   BOOK NOW BUTTON + ICON
============================== */

     .nav-cta {
         display: inline-flex;
         align-items: center;
         justify-content: center;
         gap: 9px;
         white-space: nowrap;
     }

     .nav-cta i {
         display: inline-flex;
         align-items: center;
         justify-content: center;

         font-size: 12px;
         line-height: 1;
         transition: transform 0.3s ease;
     }

     .nav-cta:hover i {
         transform: translateX(4px);
     }

     /* ==============================
   MOBILE TOGGLE ICON
============================== */

     .nav-toggle {
         width: 44px;
         height: 44px;
         padding: 0;
         border: 0;
         background: transparent;
         cursor: pointer;

         display: none;
         flex-direction: column;
         align-items: center;
         justify-content: center;
         gap: 6px;
     }

     .nav-toggle span {
         display: block;
         width: 26px;
         height: 2px;
         border-radius: 10px;
         background: #ffffff;
         transition: 0.3s ease;
     }

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

     @media (max-width: 991.98px) {
         .main-navbar {
             height: 74px;
         }

         .navbar-inner {
             width: calc(100% - 30px);
         }

         .nav-logo {
             width: 150px;
             height: 58px;
             flex-basis: 150px;
         }

         .nav-links,
         .nav-cta.desktop {
             display: none;
         }

         .nav-toggle {
             display: flex;
         }
     }

     @media (max-width: 575.98px) {
         .nav-logo {
             width: 130px;
             height: 52px;
             flex-basis: 130px;
         }
     }


     .nav-links a,
     .mobile-nav a {
         color: #ffffff;
         transition: color 0.3s ease;
     }

     /* Hover effect */
     .nav-links a:hover,
     .mobile-nav a:hover {
         color: #ff8a00;
     }

     /* Keep selected page orange */
     .nav-links a.active,
     .mobile-nav a.active {
         color: #ff8a00 !important;
     }



     .nav-links li a,
     .mobile-nav>a:not(.nav-cta) {
         color: #ffffff;
         text-decoration: none;
         transition: color 0.3s ease;
     }


     .nav-links li a:hover,
     .mobile-nav>a:not(.nav-cta):hover {
         color: #ff8a00;
     }

     .nav-links li a.active,
     .mobile-nav>a.active:not(.nav-cta) {
         color: #ff8a00 !important;
     }

     .main-navbar {
         position: fixed;
         top: 0;
         left: 0;
         width: 100%;
         z-index: 1000;
         padding: 20px 0;
         transition: all 0.4s ease;

     }

     .main-navbar.scrolled {
         background: #013274;
         backdrop-filter: blur(20px);
         -webkit-backdrop-filter: blur(20px);
         box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
         padding: 12px 0;
         border-bottom: 1px solid rgba(255, 255, 255, 0.05);
     }

     .navbar-inner {
         display: flex;
         align-items: center;
         justify-content: space-between;
         padding: 0 60px;
         max-width: 1600px;
         margin: 0 auto;

     }

     .nav-logo {
         font-family: var(--font-heading);
         font-style: italic;
         font-size: 1.6rem;
         font-weight: 600;
         color: white;
         text-decoration: none;
         display: flex;
         align-items: center;
         gap: 10px;
         transition: all 0.3s ease;
     }

     .nav-logo:hover {
         color: rgba(255, 255, 255, 0.9);
         transform: scale(1.02);
     }

     .nav-logo i {
         font-size: 1.2rem;
         color: rgba(255, 255, 255, 0.8);
     }

     .nav-links {
         display: flex;
         align-items: center;
         gap: 40px;
         list-style: none;
         margin: 0;
         padding: 0;

     }

     .nav-links a {
         color: rgba(255, 255, 255, 0.75);
         text-decoration: none;
         font-size: 0.9rem;
         font-weight: 500;
         letter-spacing: 0.3px;
         position: relative;
         transition: all 0.3s ease;
         padding: 5px 0;
     }

     .nav-links a::after {
         content: '';
         position: absolute;
         bottom: 0;
         left: 0;
         width: 0;
         height: 2px;
         background: white;
         border-radius: 2px;
         transition: width 0.3s ease;
     }

     .nav-links a:hover {
         color: white;
     }

     .nav-links a:hover::after {
         width: 100%;
     }

     .nav-cta {
         display: inline-flex;
         align-items: center;
         gap: 8px;
         background: rgba(255, 255, 255, 0.15);
         backdrop-filter: blur(10px);
         border: 1px solid rgba(255, 255, 255, 0.25);
         color: white;
         padding: 10px 24px;
         border-radius: 50px;
         font-weight: 500;
         font-size: 0.85rem;
         text-decoration: none;
         transition: all 0.3s ease;
         font-family: var(--font-body);
     }

     .nav-cta:hover {
         background: rgba(255, 255, 255, 0.25);
         color: white;
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
     }

     /* Mobile Menu Toggle */
     .nav-toggle {
         display: none;
         flex-direction: column;
         gap: 5px;
         background: none;
         border: none;
         cursor: pointer;
         padding: 5px;
         z-index: 1001;
     }

     .nav-toggle span {
         display: block;
         width: 25px;
         height: 2px;
         background: white;
         border-radius: 2px;
         transition: all 0.3s ease;
     }

     .nav-toggle.active span:nth-child(1) {
         transform: rotate(45deg) translate(5px, 5px);
     }

     .nav-toggle.active span:nth-child(2) {
         opacity: 0;
     }

     .nav-toggle.active span:nth-child(3) {
         transform: rotate(-45deg) translate(5px, -5px);
     }

     /* Mobile Nav Overlay */
     .mobile-nav {
         position: fixed;
         top: 0;
         left: 0;
         width: 100%;
         height: 100vh;
         background: rgba(15, 23, 42, 0.98);
         backdrop-filter: blur(30px);
         z-index: 999;
         display: flex;
         flex-direction: column;
         align-items: center;
         justify-content: center;
         gap: 30px;
         opacity: 0;
         pointer-events: none;
         transition: all 0.4s ease;
     }

     .mobile-nav.active {
         opacity: 1;
         pointer-events: all;
     }

     .mobile-nav a {
         color: white;
         text-decoration: none;
         font-family: var(--font-heading);
         font-style: italic;
         font-size: 2rem;
         font-weight: 500;
         transition: all 0.3s ease;
         opacity: 0;
         transform: translateY(20px);
     }

     .mobile-nav.active a {
         opacity: 1;
         transform: translateY(0);
     }

     .mobile-nav a:nth-child(1) {
         transition-delay: 0.1s;
     }

     .mobile-nav a:nth-child(2) {
         transition-delay: 0.2s;
     }

     .mobile-nav a:nth-child(3) {
         transition-delay: 0.3s;
     }

     .mobile-nav a:nth-child(4) {
         transition-delay: 0.4s;
     }

     .mobile-nav a:nth-child(5) {
         transition-delay: 0.5s;
     }

     .mobile-nav a:hover {
         color: rgba(255, 255, 255, 0.7);
     }

     .mobile-nav .nav-cta {
         margin-top: 20px;
         padding: 14px 32px;
         font-size: 1rem;
     }

     /* Responsive Navbar */
     @media (max-width: 991px) {
         .navbar-inner {
             padding: 0 30px;
         }

         .nav-links {
             display: none;
         }

         .nav-cta.desktop {
             display: none;
         }

         .nav-toggle {
             display: flex;
         }
     }

     @media (max-width: 576px) {
         .navbar-inner {
             padding: 0 20px;
         }

         .nav-logo {
             font-size: 1.3rem;
         }
     }

     /* ===== HERO SECTION (existing) ===== */
     .hero-section {
         position: relative;
         width: 100%;
         min-height: 100vh;
         overflow: hidden;
         display: flex;
         align-items: center;
         padding-top: 80px;
     }

     .hero-bg {
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         z-index: 1;
     }

     .hero-bg img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: opacity 0.8s ease-in-out, transform 6s ease;
     }

     .hero-bg::after {
         content: '';
         position: absolute;
         top: 0;
         left: 0;
         right: 0;
         bottom: 0;
         background: linear-gradient(90deg,
                 rgba(15, 23, 42, 0.75) 0%,
                 rgba(15, 23, 42, 0.4) 50%,
                 rgba(15, 23, 42, 0.2) 100%);
         z-index: 2;
     }

     .hero-content {
         position: relative;
         z-index: 10;
         width: 100%;
         padding: 80px 0;
     }

     .left-content {
         padding-left: 60px;
         max-width: 600px;
     }

     .badge-new {
         display: inline-flex;
         align-items: center;
         gap: 10px;
         margin-bottom: 24px;
     }

     .badge-new span:first-child {
         background: white;
         color: #1e293b;
         padding: 6px 14px;
         border-radius: 50px;
         font-size: 0.75rem;
         font-weight: 700;
         letter-spacing: 0.5px;
     }

     .badge-new span:last-child {
         color: rgba(255, 255, 255, 0.9);
         font-size: 0.9rem;
         font-weight: 500;
     }

     .hero-title {
         font-family: var(--font-heading);
         font-style: italic;
         font-weight: 600;
         font-size: clamp(2rem, 4vw, 3.2rem);
         color: white;
         line-height: 1.2;
         margin-bottom: 20px;
         transition: opacity 0.4s ease;
     }

     .hero-desc {
         color: rgba(255, 255, 255, 0.75);
         font-size: 0.95rem;
         line-height: 1.8;
         max-width: 480px;
         margin-bottom: 30px;
     }

     .btn-explore {
         display: inline-flex;
         align-items: center;
         gap: 10px;
         background: rgba(255, 255, 255, 0.15);
         backdrop-filter: blur(10px);
         border: 1px solid rgba(255, 255, 255, 0.25);
         color: white;
         padding: 14px 28px;
         border-radius: 50px;
         font-weight: 500;
         font-size: 0.9rem;
         text-decoration: none;
         transition: all 0.3s ease;
     }

     .btn-explore:hover {
         background: rgba(255, 255, 255, 0.25);
         color: white;
         transform: translateY(-2px);
     }

     .btn-explore i {
         transition: transform 0.3s ease;
     }

     .btn-explore:hover i {
         transform: translate(3px, -3px);
     }

     .thumbnails-col {
         position: relative;
         display: flex;
         flex-direction: column;
         align-items: flex-end;
         padding-right: 60px;
         min-height: 500px;
         justify-content: space-between;
     }

     .thumb-item {
         display: flex;
         align-items: center;
         gap: 16px;
         cursor: pointer;
         transition: all 0.3s ease;
         opacity: 0.7;
     }

     .thumb-item:hover {
         opacity: 1;
     }

     .thumb-item.active {
         opacity: 1;
     }

     .thumb-item:nth-child(1) {
         margin-right: 0;
     }

     .thumb-item:nth-child(2) {
         margin-right: 40px;
     }

     .thumb-item:nth-child(3) {
         margin-right: 80px;
     }

     .thumb-item:nth-child(4) {
         margin-right: 40px;
     }

     .thumb-item:nth-child(5) {
         margin-right: 0;
     }

     .thumb-item:hover {
         transform: translateX(-5px);
     }

     .thumb-info {
         text-align: right;
         transition: all 0.3s ease;
     }

     .thumb-info h5 {
         font-family: var(--font-heading);
         font-style: italic;
         color: white;
         font-size: 0.95rem;
         margin: 0;
         font-weight: 600;
     }

     .thumb-info p {
         color: rgba(255, 255, 255, 0.6);
         font-size: 0.75rem;
         margin: 2px 0 0;
     }

     .thumb-img {
         width: 70px;
         height: 70px;
         border-radius: 50%;
         overflow: hidden;
         border: 3px solid rgba(255, 255, 255, 0.3);
         transition: all 0.3s ease;
         flex-shrink: 0;
     }

     .thumb-item:hover .thumb-img,
     .thumb-item.active .thumb-img {
         border-color: white;
         box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
         transform: scale(1.1);
     }

     .thumb-img img {
         width: 100%;
         height: 100%;
         object-fit: cover;
     }

     .pagination-dots {
         display: flex;
         flex-direction: column;
         gap: 10px;
         position: absolute;
         right: 20px;
         top: 50%;
         transform: translateY(-50%);
         z-index: 10;
     }

     .dot {
         width: 8px;
         height: 8px;
         border-radius: 50%;
         background: rgba(255, 255, 255, 0.3);
         cursor: pointer;
         transition: all 0.3s ease;
     }

     .dot.active {
         background: white;
         transform: scale(1.3);
     }

     .dot:hover {
         background: rgba(255, 255, 255, 0.7);
     }

     .bottom-bar {
         position: absolute;
         bottom: 40px;
         left: 60px;
         right: 40px;
         z-index: 10;
         display: flex;
         align-items: center;
         justify-content: space-between;
     }

     .btn-visit {
         display: inline-flex;
         align-items: center;
         gap: 10px;
         background: rgba(255, 255, 255, 0.2);
         backdrop-filter: blur(10px);
         border: 1px solid rgba(255, 255, 255, 0.2);
         color: white;
         padding: 16px 32px;
         border-radius: 16px;
         font-weight: 600;
         font-size: 1.1rem;
         text-decoration: none;
         transition: all 0.3s ease;
     }

     .btn-visit:hover {
         background: rgba(255, 255, 255, 0.3);
         color: white;
         transform: translateY(-2px);
     }

     @media (max-width: 991px) {
         .left-content {
             padding-left: 30px;
             padding-right: 30px;
         }

         .thumbnails-col {
             flex-direction: row;
             flex-wrap: wrap;
             justify-content: center;
             padding-right: 0;
             margin-top: 40px;
             min-height: auto;
             gap: 20px;
         }

         .thumb-item {
             flex-direction: column;
             text-align: center;
             margin-right: 0 !important;
         }

         .thumb-info {
             text-align: center;
         }

         .thumb-info h5 {
             font-size: 0.85rem;
         }

         .pagination-dots {
             flex-direction: row;
             right: 50%;
             transform: translateX(50%);
             top: auto;
             bottom: 100px;
         }

         .bottom-bar {
             left: 30px;
             right: 30px;
             bottom: 30px;
         }
     }

     @media (max-width: 576px) {
         .hero-title {
             font-size: 1.8rem;
         }

         .left-content {
             padding-left: 20px;
             padding-right: 20px;
         }

         .thumb-img {
             width: 55px;
             height: 55px;
         }

         .btn-visit {
             padding: 12px 20px;
             font-size: 0.95rem;
         }

         .bottom-bar {
             left: 20px;
             right: 20px;
         }
     }


     /* End css of nav and hero-section  */



     /* css of Destinations */


     .vista-showcase {
         position: relative;
         min-height: 100vh;
         display: flex;
         align-items: flex-end;
         overflow: hidden;
         isolation: isolate;
         color: #fff;
     }

     .vista-backdrop {
         position: absolute;
         inset: 0;
         z-index: -3;
         background: #101c1c;
         overflow: hidden;
     }

     .vista-backdrop img {
         width: 100%;
         height: 100%;
         display: block;
         object-fit: cover;
         opacity: 1;
         transform: scale(1.01);
         transition: opacity 0.45s ease, transform 1s ease;
     }

     .vista-backdrop.changing img {
         opacity: 0;
         transform: scale(1.06);
     }

     .vista-showcase::before {
         content: "";
         position: absolute;
         inset: 0;
         z-index: -2;
         background:
             linear-gradient(90deg, rgba(5, 14, 15, 0.92) 0%, rgba(5, 14, 15, 0.62) 43%, rgba(5, 14, 15, 0.25) 75%),
             linear-gradient(0deg, rgba(4, 12, 13, 0.92) 0%, transparent 45%);
         pointer-events: none;
     }

     .vista-wrap {
         width: 100%;
         padding: 130px 4vw 115px;
     }

     .vista-main {
         max-width: 610px;
     }

     .vista-main.animate {
         animation: vistaText 0.62s ease both;
     }

     @keyframes vistaText {
         from {
             opacity: 0;
             transform: translateY(22px);
         }

         to {
             opacity: 1;
             transform: translateY(0);
         }
     }

     .vista-loc {
         margin-bottom: 16px;
         font-size: 0.78rem;
         font-weight: 600;
         letter-spacing: 0.2em;
         text-transform: uppercase;
     }

     .vista-loc::before {
         content: "";
         display: inline-block;
         width: 42px;
         height: 2px;
         margin-right: 12px;
         vertical-align: middle;
         background: #f0b36b;
     }

     .vista-headline {
         margin: 0 0 22px;
         font-family: "Playfair Display", serif;
         font-size: clamp(3.4rem, 7vw, 7.5rem);
         font-weight: 700;
         line-height: 0.84;
         letter-spacing: -0.045em;
     }

     .vista-summary {
         max-width: 540px;
         margin-bottom: 30px;
         color: rgba(255, 255, 255, 0.78);
         font-size: 0.95rem;
         line-height: 1.8;
     }

     .vista-pill {
         display: inline-flex;
         align-items: center;
         gap: 10px;
         padding: 13px 22px;
         border: 1px solid rgba(255, 255, 255, 0.55);
         border-radius: 100px;
         color: #fff;
         text-decoration: none;
         font-size: 0.84rem;
         font-weight: 500;
         transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
     }

     .vista-pill:hover {
         color: #15201f;
         background: #fff;
         transform: translateY(-2px);
     }

     .vista-deck {
         position: relative;
         --vista-gap: 20px;
         --vista-visible-cards: 3;
         display: flex;
         align-items: center;
         gap: var(--vista-gap);
         width: 100%;
         padding: 35px 12px;
         overflow-x: auto;
         overflow-y: hidden;
         scroll-behavior: smooth;
         scroll-snap-type: x proximity;
         overscroll-behavior-x: contain;
         scrollbar-width: none;
     }

     .vista-deck::-webkit-scrollbar {
         display: none;
     }

     .vista-card {
         position: relative;
         flex: 0 0 calc((100% - (var(--vista-gap) * (var(--vista-visible-cards) - 1))) / var(--vista-visible-cards));
         aspect-ratio: 1 / 1;
         height: auto;
         overflow: hidden;
         border: 2px solid transparent;
         border-radius: 20px;
         cursor: pointer;
         scroll-snap-align: center;
         opacity: 0.56;
         filter: brightness(0.67);
         transform: scale(0.9);
         transition: opacity 0.5s ease, filter 0.5s ease, transform 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
     }

     .vista-card::after {
         content: "";
         position: absolute;
         inset: 0;
         border-radius: inherit;
         background: linear-gradient(0deg, rgba(0, 0, 0, 0.34), transparent 50%);
         pointer-events: none;
     }

     .vista-card img {
         width: 100%;
         height: 100%;
         display: block;
         object-fit: cover;
         transform: scale(1.1);
         transition: transform 0.8s ease;
         pointer-events: none;
     }

     .vista-card:hover {
         opacity: 0.82;
         filter: brightness(0.88);
         transform: scale(0.94) translateY(-4px);
     }

     .vista-card.active,
     .vista-card[aria-selected="true"] {
         opacity: 1;
         filter: brightness(1);
         transform: scale(1) translateY(-8px);
         border-color: #f5c176;
         box-shadow:
             0 24px 55px rgba(0, 0, 0, 0.5),
             0 0 0 5px rgba(245, 193, 118, 0.22),
             inset 0 0 0 2px rgba(255, 255, 255, 0.9);
         z-index: 3;
     }

     .vista-card.active img,
     .vista-card[aria-selected="true"] img {
         transform: scale(1);
     }

     .vista-card:focus-visible {
         outline: 3px solid #f0b36b;
         outline-offset: 5px;
     }

     .vista-footer {
         position: absolute;
         right: 4vw;
         bottom: 40px;
         left: 4vw;
         display: flex;
         align-items: center;
         gap: 22px;
     }

     .vista-track {
         flex: 1;
         height: 2px;
         overflow: hidden;
         background: rgba(255, 255, 255, 0.28);
     }

     .vista-track-fill {
         height: 100%;
         background: #fff;
         transition: width 0.5s ease;
     }

     .vista-count {
         min-width: 70px;
         font-size: 0.75rem;
         letter-spacing: 0.12em;
         text-align: right;
     }

     @media (max-width: 991.98px) {
         .vista-showcase {
             min-height: auto;
         }

         .vista-wrap {
             padding-top: 100px;
             padding-bottom: 110px;
         }

         .vista-headline {
             font-size: clamp(3.5rem, 12vw, 6rem);
         }

         .vista-card {
             height: auto;
         }
     }

     @media (max-width: 575.98px) {
         .vista-wrap {
             padding: 75px 15px 105px;
         }

         .vista-headline {
             font-size: clamp(3.25rem, 18vw, 5.2rem);
         }

         .vista-deck {
             --vista-gap: 15px;
             --vista-visible-cards: 2;
             padding-block: 18px;
         }

         .vista-card {
             height: auto;
             border-radius: 16px;
         }

         .vista-footer {
             right: 15px;
             bottom: 30px;
             left: 15px;
         }
     }

     @media (prefers-reduced-motion: reduce) {

         *,
         *::before,
         *::after {
             scroll-behavior: auto !important;
             animation-duration: 0.01ms !important;
             transition-duration: 0.01ms !important;
         }
     }



     /* End css of Destinations */




     /* css of Packages */


     .Packages {
         font-family: 'Poppins', sans-serif;
         background: #f8fafc;
         padding: 60px 0;
     }

     .sec-hd {
         display: flex;
         align-items: center;
         justify-content: space-between;
         margin-bottom: 35px;
         flex-wrap: wrap;
         gap: 15px;
     }

     .sec-ttl {
         font-weight: 700;
         font-size: clamp(1.4rem, 3vw, 1.8rem);
         color: var(--txt-dk);
         display: flex;
         align-items: center;
         gap: 10px;
         margin: 0;
     }

     .wv-ln {
         display: inline-block;
         width: 40px;
         height: 8px;
         position: relative;
     }

     .wv-ln::before {
         content: '';
         position: absolute;
         top: 50%;
         left: 0;
         width: 100%;
         height: 3px;
         background: linear-gradient(90deg, var(--acc-gr), #34d399);
         border-radius: 2px;
         transform: translateY(-50%);
     }

     .wv-ln::after {
         content: '';
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 8'%3E%3Cpath d='M0 4 Q5 0, 10 4 T20 4 T30 4 T40 4' stroke='%2310b981' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center;
         background-size: contain;
     }

     .btn-all {
         display: inline-flex;
         align-items: center;
         gap: 6px;
         color: var(--txt-md);
         font-weight: 500;
         font-size: 0.9rem;
         text-decoration: none;
         transition: all 0.3s ease;
     }

     .btn-all:hover {
         color: var(--txt-dk);
     }

     .btn-all i {
         color: var(--acc-gr);
         transition: transform 0.3s ease;
     }

     .btn-all:hover i {
         transform: translateX(4px);
     }

     .pkg-c {
         background: white;
         border-radius: 16px;
         overflow: hidden;
         box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
         transition: all 0.35s ease;
         cursor: pointer;
         height: 100%;
     }

     .pkg-c:hover {
         transform: translateY(-6px);
         box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
     }

     .pkg-img {
         position: relative;
         height: 180px;
         overflow: hidden;
     }

     .pkg-img img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: transform 0.5s ease;
     }

     .pkg-c:hover .pkg-img img {
         transform: scale(1.06);
     }

     .disc {
         position: absolute;
         top: 12px;
         right: 12px;
         background: var(--trvl-text-orange);
         color: white;
         padding: 5px 12px;
         border-radius: 50px;
         font-size: 0.7rem;
         font-weight: 700;
         letter-spacing: 0.3px;
         box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
         z-index: 2;
     }

     .pkg-bd {
         padding: 18px 20px 20px;
     }

     .pkg-nm {
         font-weight: 700;
         font-size: 1rem;
         color: var(--txt-dk);
         margin-bottom: 10px;
     }

     .pkg-mt {
         display: flex;
         align-items: center;
         justify-content: space-between;
         flex-wrap: wrap;
         gap: 8px;
     }

     .pkg-dur {
         display: flex;
         align-items: center;
         gap: 6px;
         color: var(--txt-md);
         font-size: 0.8rem;
         font-weight: 500;
     }

     .pkg-dur i {
         color: var(--acc-gr);
         font-size: 0.85rem;
     }

     .pkg-pr {
         display: flex;
         align-items: center;
         gap: 8px;
     }

     .cur-pr {
         font-weight: 800;
         font-size: 1.05rem;
         color: var(--txt-dk);
     }

     .old-pr {
         font-size: 0.75rem;
         color: #94a3b8;
         text-decoration: line-through;
         font-weight: 500;
     }

     @media (max-width: 767px) {
         .pkg-img {
             height: 200px;
         }
     }

     @media (max-width: 575px) {
         .pkg-img {
             height: 220px;
         }

         .pkg-nm {
             font-size: 1.1rem;
         }

         .cur-pr {
             font-size: 1.15rem;
         }
     }




     /* End css of Packages */



     /* css of Contact */





     /* =====================================================
   MODERN CONTACT SECTION
===================================================== */

     .contacts {
         --reach-primary: #e39b2d;
         --reach-primary-light: #ffc96b;
         --reach-secondary: #203f43;
         --reach-dark: #102c2f;
         --reach-text: #36585b;
         --reach-muted: #71878a;
         --reach-border: rgba(16, 44, 47, 0.13);
         --reach-white: #ffffff;
         --reach-soft: #f4f8f7;
         --reach-font-body: "Poppins", sans-serif;
         --reach-font-display: "Playfair Display", serif;

         position: relative;
         font-family: var(--reach-font-body);
         color: var(--reach-dark);
         overflow: hidden;
     }

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

     .reach-contact {
         position: relative;
         padding: 110px 0 90px;
         background:
             radial-gradient(circle at 8% 12%,
                 rgba(255, 205, 119, 0.35),
                 transparent 25%),
             radial-gradient(circle at 92% 75%,
                 rgba(32, 63, 67, 0.13),
                 transparent 27%),
             linear-gradient(135deg, #fffaf0 0%, #f4eee2 48%, #edf5f3 100%);
         isolation: isolate;
     }

     .reach-contact::before,
     .reach-contact::after {
         content: "";
         position: absolute;
         border-radius: 50%;
         pointer-events: none;
         z-index: -1;
     }

     .reach-contact::before {
         width: 430px;
         height: 430px;
         top: -210px;
         right: -150px;
         border: 70px solid rgba(227, 155, 45, 0.09);
     }

     .reach-contact::after {
         width: 260px;
         height: 260px;
         left: -120px;
         bottom: 180px;
         background: rgba(32, 63, 67, 0.05);
     }

     /* =====================================================
   TOP HEADING
===================================================== */

     .reach-topbar {
         display: flex;
         align-items: flex-end;
         justify-content: space-between;
         gap: 35px;
         margin-bottom: 55px;
     }

     .reach-label {
         display: inline-flex;
         align-items: center;
         gap: 10px;
         margin-bottom: 14px;
         color: var(--reach-primary);
         font-size: 0.75rem;
         font-weight: 700;
         text-transform: uppercase;
         letter-spacing: 2.5px;
     }

     .reach-label::before {
         content: "";
         width: 34px;
         height: 2px;
         border-radius: 10px;
         background: var(--reach-primary);
     }

     .reach-heading {
         position: relative;
         margin: 0;
         color: var(--reach-dark);
         font-family: var(--reach-font-display);
         font-size: clamp(2.8rem, 5vw, 5rem);
         font-weight: 700;
         line-height: 0.95;
         letter-spacing: -2px;
     }

     .reach-subtext {
         max-width: 390px;
         margin: 0 0 5px;
         padding-left: 20px;
         border-left: 3px solid var(--reach-primary);
         color: var(--reach-text);
         font-size: 0.94rem;
         line-height: 1.85;
     }

     /* =====================================================
   FORM CONTAINER
===================================================== */

     .reach-form-wrap {
         position: relative;
         height: 100%;
         padding: 45px;
         border: 1px solid rgba(255, 255, 255, 0.85);
         border-radius: 30px;
         background: rgba(255, 255, 255, 0.78);
         box-shadow:
             0 30px 80px rgba(16, 44, 47, 0.12),
             inset 0 1px 0 rgba(255, 255, 255, 0.9);
         backdrop-filter: blur(20px);
         -webkit-backdrop-filter: blur(20px);
         overflow: hidden;
     }

     .reach-form-wrap::before {
         content: "";
         position: absolute;
         width: 190px;
         height: 190px;
         top: -100px;
         right: -80px;
         border-radius: 50%;
         background: linear-gradient(135deg,
                 rgba(227, 155, 45, 0.18),
                 rgba(255, 201, 107, 0.04));
         pointer-events: none;
     }

     .reach-field {
         position: relative;
         margin-bottom: 7px;
     }

     .reach-field label {
         display: block;
         margin: 0 0 9px 3px;
         color: var(--reach-dark);
         font-size: 0.73rem;
         font-weight: 700;
         text-transform: uppercase;
         letter-spacing: 1px;
     }

     /* =====================================================
   INPUTS
===================================================== */

     .reach-input,
     .reach-select,
     .reach-textarea {
         width: 100%;
         padding: 16px 18px;
         border: 1px solid var(--reach-border);
         border-radius: 13px;
         background: rgba(255, 255, 255, 0.85);
         color: var(--reach-dark);
         font-family: var(--reach-font-body);
         font-size: 0.9rem;
         outline: none;
         box-shadow: 0 5px 18px rgba(16, 44, 47, 0.03);
         transition:
             border-color 0.3s ease,
             box-shadow 0.3s ease,
             transform 0.3s ease,
             background 0.3s ease;
     }

     .reach-input {
         height: 54px;
     }

     .reach-input::placeholder,
     .reach-textarea::placeholder {
         color: #9aa9aa;
     }

     .reach-input:hover,
     .reach-select:hover,
     .reach-textarea:hover {
         border-color: rgba(227, 155, 45, 0.55);
     }

     .reach-input:focus,
     .reach-select:focus,
     .reach-textarea:focus {
         border-color: var(--reach-primary);
         background: #ffffff;
         box-shadow:
             0 0 0 4px rgba(227, 155, 45, 0.13),
             0 12px 25px rgba(16, 44, 47, 0.07);
         transform: translateY(-1px);
     }

     .reach-select {
         height: 54px;
         padding-right: 48px;
         appearance: none;
         background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23102c2f' d='M6 8.5 1.5 4h9z'/%3E%3C/svg%3E");
         background-repeat: no-repeat;
         background-position: right 18px center;
         cursor: pointer;
     }

     .reach-textarea {
         min-height: 125px;
         resize: vertical;
     }

     /* =====================================================
   SUBMIT BUTTON
===================================================== */

     .reach-btn {
         position: relative;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         gap: 18px;
         margin-top: 22px;
         padding: 10px 11px 10px 26px;
         border: none;
         border-radius: 100px;
         background: linear-gradient(135deg,
                 var(--reach-dark),
                 var(--reach-secondary));
         color: #ffffff;
         font-family: var(--reach-font-body);
         font-size: 0.9rem;
         font-weight: 600;
         letter-spacing: 0.2px;
         box-shadow: 0 15px 30px rgba(16, 44, 47, 0.25);
         cursor: pointer;
         overflow: hidden;
         transition:
             transform 0.3s ease,
             box-shadow 0.3s ease;
     }

     .reach-btn::before {
         content: "";
         position: absolute;
         width: 60px;
         height: 100%;
         top: 0;
         left: -80px;
         background: rgba(255, 255, 255, 0.17);
         transform: skewX(-20deg);
         transition: left 0.55s ease;
     }

     .reach-btn:hover {
         color: #ffffff;
         transform: translateY(-4px);
         box-shadow: 0 20px 38px rgba(16, 44, 47, 0.32);
     }

     .reach-btn:hover::before {
         left: 120%;
     }

     .reach-btn i {
         position: relative;
         width: 42px;
         height: 42px;
         border-radius: 50%;
         background: linear-gradient(135deg,
                 var(--reach-primary-light),
                 var(--reach-primary));
         color: var(--reach-dark);
         display: inline-flex;
         align-items: center;
         justify-content: center;
         font-size: 0.8rem;
         transition: transform 0.35s ease;
     }

     .reach-btn:hover i {
         transform: translateX(3px) rotate(-35deg);
     }

     /* =====================================================
   IMAGE CARD
===================================================== */

     .reach-visual {
         position: relative;
         height: 100%;
         min-height: 650px;
         padding: 10px;
         border: 1px solid rgba(255, 255, 255, 0.8);
         border-radius: 30px;
         background: rgba(255, 255, 255, 0.35);
         box-shadow: 0 30px 70px rgba(16, 44, 47, 0.16);
         overflow: hidden;
     }

     .reach-visual::before {
         content: "";
         position: absolute;
         inset: 10px;
         z-index: 1;
         border-radius: 22px;
         background: linear-gradient(180deg,
                 rgba(16, 44, 47, 0.05) 35%,
                 rgba(16, 44, 47, 0.75) 100%);
         pointer-events: none;
     }

     .reach-visual::after {
         content: "Travel • Explore • Experience";
         position: absolute;
         left: 38px;
         bottom: 35px;
         z-index: 3;
         max-width: 260px;
         color: #ffffff;
         font-family: var(--reach-font-display);
         font-size: clamp(1.7rem, 3vw, 2.45rem);
         font-weight: 600;
         line-height: 1.15;
         text-shadow: 0 4px 18px rgba(0, 0, 0, 0.3);
     }

     .reach-visual img {
         width: 100%;
         height: 100%;
         border-radius: 22px;
         object-fit: cover;
         transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
     }

     .reach-visual:hover img {
         transform: scale(1.06);
     }

     .reach-badge {
         position: absolute;
         top: 30px;
         right: 30px;
         z-index: 4;
         display: inline-flex;
         align-items: center;
         gap: 8px;
         padding: 10px 18px;
         border: 1px solid rgba(255, 255, 255, 0.5);
         border-radius: 50px;
         background: rgba(255, 255, 255, 0.88);
         color: var(--reach-dark);
         font-size: 0.76rem;
         font-weight: 700;
         letter-spacing: 0.5px;
         box-shadow: 0 10px 25px rgba(0, 0, 0, 0.13);
         backdrop-filter: blur(12px);
     }

     .reach-badge::before {
         content: "";
         width: 8px;
         height: 8px;
         border-radius: 50%;
         background: var(--reach-primary);
         box-shadow: 0 0 0 4px rgba(227, 155, 45, 0.2);
     }

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

     .reach-infobar {
         position: relative;
         margin-top: 45px;
         padding: 15px;
         border: 1px solid rgba(255, 255, 255, 0.8);
         border-radius: 25px;
         background: rgba(255, 255, 255, 0.7);
         box-shadow: 0 20px 50px rgba(16, 44, 47, 0.09);
         backdrop-filter: blur(18px);
     }

     .reach-infoitem {
         position: relative;
         display: grid;
         grid-template-columns: 56px 1fr;
         grid-template-areas:
             "icon title"
             "icon detail";
         column-gap: 16px;
         align-items: center;
         min-height: 110px;
         padding: 22px;
         text-align: left;
         border-radius: 18px;
         transition:
             background 0.3s ease,
             transform 0.3s ease;
     }

     .reach-infobar>div:not(:last-child) .reach-infoitem::after {
         content: "";
         position: absolute;
         top: 20%;
         right: -12px;
         width: 1px;
         height: 60%;
         background: var(--reach-border);
     }

     .reach-infoitem:hover {
         background: #ffffff;
         transform: translateY(-4px);
     }

     .reach-infoicon {
         grid-area: icon;
         width: 56px;
         height: 56px;
         margin: 0;
         border: none;
         border-radius: 17px;
         background: rgba(227, 155, 45, 0.14);
         color: var(--reach-primary);
         display: inline-flex;
         align-items: center;
         justify-content: center;
         font-size: 1.1rem;
         transition:
             background 0.35s ease,
             color 0.35s ease,
             transform 0.35s ease;
     }

     .reach-infoitem:hover .reach-infoicon {
         border-color: transparent;
         background: var(--reach-dark);
         color: #ffffff;
         transform: rotate(-8deg) scale(1.05);
     }

     .reach-infotitle {
         grid-area: title;
         align-self: end;
         margin: 0 0 5px;
         color: var(--reach-dark);
         font-size: 0.94rem;
         font-weight: 700;
     }

     .reach-infodetail {
         grid-area: detail;
         align-self: start;
         margin: 0;
         color: var(--reach-muted);
         font-size: 0.79rem;
         line-height: 1.55;
     }

     /* =====================================================
   BOTTOM PROMO
===================================================== */

     .reach-promo {
         position: relative;
         margin-top: 45px;
         padding: 0;
         border: 0;
         border-radius: 30px;
         background:
             radial-gradient(circle at 85% 0%,
                 rgba(255, 201, 107, 0.18),
                 transparent 32%),
             linear-gradient(135deg, #102c2f, #1d4a4e);
         box-shadow: 0 25px 60px rgba(16, 44, 47, 0.23);
         overflow: hidden;
     }

     .reach-promo::before {
         content: "";
         position: absolute;
         width: 220px;
         height: 220px;
         left: -90px;
         bottom: -140px;
         border: 35px solid rgba(255, 255, 255, 0.04);
         border-radius: 50%;
     }

     .reach-promo-inner {
         position: relative;
         z-index: 2;
         display: flex;
         align-items: center;
         justify-content: space-between;
         gap: 40px;
         padding: 45px 50px;
     }

     .reach-promo-text {
         max-width: 530px;
     }

     .reach-promo-label {
         display: inline-block;
         margin-bottom: 12px;
         color: var(--reach-primary-light);
         font-size: 0.72rem;
         font-weight: 700;
         text-transform: uppercase;
         letter-spacing: 2.5px;
     }

     .reach-promo-heading {
         margin: 0 0 14px;
         color: #ffffff;
         font-family: var(--reach-font-display);
         font-size: clamp(1.8rem, 3vw, 2.8rem);
         font-weight: 600;
         line-height: 1.18;
     }

     .reach-promo-heading i {
         color: var(--reach-primary-light);
     }

     .reach-promo-heading a {
         position: relative;
         color: var(--reach-primary-light);
         text-decoration: none;
         white-space: nowrap;
     }

     .reach-promo-heading a::after {
         content: "";
         position: absolute;
         right: 0;
         bottom: -3px;
         left: 0;
         height: 1px;
         background: currentColor;
         transform-origin: left;
         transition: transform 0.3s ease;
     }

     .reach-promo-heading a:hover {
         color: #ffffff;
         opacity: 1;
     }

     .reach-promo-heading a:hover::after {
         transform: scaleX(0.55);
     }

     .reach-promo-desc {
         max-width: 460px;
         margin: 0;
         color: rgba(255, 255, 255, 0.68);
         font-size: 0.87rem;
         line-height: 1.75;
     }

     .reach-promo-imgs {
         display: flex;
         align-items: center;
         flex-shrink: 0;
     }

     .reach-promo-img {
         width: 145px;
         height: 175px;
         border: 5px solid rgba(255, 255, 255, 0.14);
         border-radius: 20px;
         overflow: hidden;
         box-shadow: 0 18px 35px rgba(0, 0, 0, 0.25);
         transform: rotate(-5deg);
         transition:
             transform 0.4s ease,
             z-index 0.4s ease;
     }

     .reach-promo-img+.reach-promo-img {
         margin-left: -35px;
         transform: rotate(6deg) translateY(10px);
     }

     .reach-promo-img:hover {
         z-index: 5;
         transform: rotate(0deg) translateY(-8px) scale(1.04);
     }

     .reach-promo-img+.reach-promo-img:hover {
         transform: rotate(0deg) translateY(-8px) scale(1.04);
     }

     .reach-promo-img img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: transform 0.6s ease;
     }

     .reach-promo-img:hover img {
         transform: scale(1.1);
     }

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

     @media (max-width: 991.98px) {
         .reach-contact {
             padding: 80px 0 65px;
         }

         .reach-topbar {
             align-items: flex-start;
         }

         .reach-heading {
             font-size: 3.3rem;
         }

         .reach-form-wrap {
             padding: 35px;
         }

         .reach-visual {
             min-height: 480px;
             margin-top: 5px;
         }

         .reach-infobar>div:not(:last-child) .reach-infoitem::after {
             display: none;
         }

         .reach-infoitem {
             grid-template-columns: 48px 1fr;
             padding: 15px 10px;
         }

         .reach-infoicon {
             width: 48px;
             height: 48px;
         }

         .reach-promo-inner {
             padding: 40px;
         }

         .reach-promo-img {
             width: 120px;
             height: 150px;
         }
     }

     @media (max-width: 767.98px) {
         .reach-contact {
             padding: 65px 0 50px;
         }

         .reach-topbar {
             display: block;
             margin-bottom: 35px;
         }

         .reach-heading {
             font-size: 2.8rem;
             letter-spacing: -1px;
         }

         .reach-subtext {
             max-width: 100%;
             margin-top: 25px;
         }

         .reach-form-wrap {
             padding: 28px 22px;
             border-radius: 24px;
         }

         .reach-visual {
             min-height: 430px;
             border-radius: 24px;
         }

         .reach-infobar {
             padding: 10px;
         }

         .reach-infobar>div:not(:last-child) {
             border-bottom: 1px solid var(--reach-border);
         }

         .reach-infoitem {
             padding: 20px 15px;
         }

         .reach-promo-inner {
             flex-direction: column;
             align-items: flex-start;
             padding: 35px 25px;
         }

         .reach-promo-imgs {
             justify-content: center;
             width: 100%;
             padding-top: 5px;
         }

         .reach-promo-img {
             width: 145px;
             height: 170px;
         }
     }

     @media (max-width: 575.98px) {
         .reach-contact {
             padding: 50px 0 40px;
         }

         .reach-heading {
             font-size: 2.35rem;
         }

         .reach-subtext {
             padding-left: 14px;
             font-size: 0.85rem;
         }

         .reach-form-wrap {
             padding: 24px 17px;
         }

         .reach-input,
         .reach-select,
         .reach-textarea {
             font-size: 0.84rem;
         }

         .reach-btn {
             width: 100%;
             justify-content: space-between;
             padding-left: 23px;
         }

         .reach-visual {
             min-height: 360px;
         }

         .reach-visual::after {
             left: 28px;
             bottom: 27px;
             max-width: 220px;
             font-size: 1.8rem;
         }

         .reach-badge {
             top: 25px;
             right: 25px;
         }

         .reach-promo {
             border-radius: 24px;
         }

         .reach-promo-inner {
             padding: 32px 20px;
         }

         .reach-promo-heading {
             font-size: 1.8rem;
         }

         .reach-promo-img {
             width: 125px;
             height: 150px;
         }
     }

     /* =====================================================
   REDUCED MOTION ACCESSIBILITY
===================================================== */

     @media (prefers-reduced-motion: reduce) {

         .reach-contact *,
         .reach-contact *::before,
         .reach-contact *::after {
             scroll-behavior: auto !important;
             transition-duration: 0.01ms !important;
         }
     }


     /* =====================================================
   CONTACT DESIGN FOR WHITE NAVBAR
===================================================== */

     .reach-contact {
         position: relative;
         padding: 160px 0 90px;
         background:
             linear-gradient(180deg,
                 #071e35 0,
                 #0b2b49 410px,
                 #eef4f5 410px,
                 #f8faf9 100%);
         overflow: hidden;
         isolation: isolate;
     }

     /* Decorative light behind contact heading */
     .reach-contact::before {
         content: "";
         position: absolute;
         top: -230px;
         right: -130px;
         width: 570px;
         height: 570px;
         border: 1px solid rgba(255, 255, 255, 0.08);
         border-radius: 50%;
         background: radial-gradient(circle,
                 rgba(227, 155, 45, 0.16),
                 transparent 68%);
         z-index: -1;
     }

     .reach-contact::after {
         content: "";
         position: absolute;
         top: 70px;
         left: -170px;
         width: 390px;
         height: 390px;
         border: 70px solid rgba(255, 255, 255, 0.025);
         border-radius: 50%;
         background: transparent;
         z-index: -1;
     }

     /* =====================================================
   CONTACT TOP HEADING
===================================================== */

     .reach-topbar {
         position: relative;
         z-index: 2;
         align-items: flex-end;
         margin-bottom: 55px;
     }

     .reach-label {
         color: #f0b24d;
     }

     .reach-label::before {
         background: #f0b24d;
     }

     .reach-heading {
         color: #ffffff;
         text-shadow: 0 8px 28px rgba(0, 0, 0, 0.2);
     }

     .reach-subtext {
         color: rgba(255, 255, 255, 0.73);
         border-left-color: #f0b24d;
     }

     /* =====================================================
   FLOATING FORM AND IMAGE ROW
===================================================== */

     .reach-contact>.container>.row.g-4 {
         position: relative;
         z-index: 3;
     }

     .reach-form-wrap {
         background: rgba(255, 255, 255, 0.97);
         border: 1px solid rgba(255, 255, 255, 0.8);
         box-shadow:
             0 35px 80px rgba(7, 30, 53, 0.17),
             0 8px 25px rgba(7, 30, 53, 0.08);
     }

     .reach-form-wrap::after {
         content: "PLAN YOUR DREAM JOURNEY";
         position: absolute;
         top: 18px;
         right: 25px;
         color: rgba(7, 30, 53, 0.035);
         font-size: clamp(1.5rem, 3vw, 3rem);
         font-weight: 800;
         letter-spacing: 2px;
         pointer-events: none;
     }

     /* Input focus matching navbar */
     .reach-input:focus,
     .reach-select:focus,
     .reach-textarea:focus {
         border-color: #0b2b49;
         box-shadow:
             0 0 0 4px rgba(11, 43, 73, 0.09),
             0 12px 25px rgba(7, 30, 53, 0.07);
     }

     /* Button matching navbar */
     .reach-btn {
         background: linear-gradient(135deg, #071e35, #0d4165);
         color: #ffffff;
         box-shadow: 0 15px 30px rgba(7, 30, 53, 0.25);
     }

     .reach-btn:hover {
         background: linear-gradient(135deg, #0d4165, #071e35);
         color: #ffffff;
     }

     .reach-btn i {
         background: linear-gradient(135deg, #ffd681, #e39b2d);
         color: #071e35;
     }

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

     .reach-visual {
         border-color: rgba(255, 255, 255, 0.55);
         box-shadow: 0 35px 80px rgba(7, 30, 53, 0.22);
     }

     .reach-visual::before {
         background: linear-gradient(180deg,
                 rgba(7, 30, 53, 0.04) 25%,
                 rgba(7, 30, 53, 0.9) 100%);
     }

     /* =====================================================
   INFORMATION BAR
===================================================== */

     .reach-infobar {
         background: #ffffff;
         border: 1px solid rgba(7, 30, 53, 0.08);
         box-shadow: 0 25px 60px rgba(7, 30, 53, 0.1);
     }

     .reach-infoicon {
         background: rgba(227, 155, 45, 0.14);
         color: #d88b17;
     }

     .reach-infoitem:hover .reach-infoicon {
         background: #0b2b49;
         color: #ffffff;
     }

     /* Make phone and email details darker */
     .reach-infodetail {
         color: #61727f;
     }

     /* =====================================================
   BOTTOM PROMOTION
===================================================== */

     .reach-promo {
         background:
             radial-gradient(circle at 90% 10%,
                 rgba(227, 155, 45, 0.18),
                 transparent 35%),
             linear-gradient(135deg, #071e35 0%, #0b2b49 55%, #0c3b55 100%);
         box-shadow: 0 30px 70px rgba(7, 30, 53, 0.22);
     }

     /* =====================================================
   NAVBAR STYLE
   Change #mainNavbar if your navbar has a different ID
===================================================== */

     #mainNavbar {
         background: linear-gradient(180deg,
                 rgba(7, 30, 53, 0.65),
                 rgba(7, 30, 53, 0));
         transition:
             background 0.35s ease,
             box-shadow 0.35s ease,
             padding 0.35s ease,
             backdrop-filter 0.35s ease;
     }

     /* White navbar links before scrolling */
     #mainNavbar .nav-link,
     #mainNavbar .navbar-brand,
     #mainNavbar .nav-links a {
         color: #ffffff;
     }

     /* Navbar after scrolling */
     #mainNavbar.scrolled {
         background: rgba(7, 30, 53, 0.96);
         box-shadow: 0 10px 35px rgba(0, 0, 0, 0.2);
         backdrop-filter: blur(16px);
         -webkit-backdrop-filter: blur(16px);
     }

     /* Link underline */
     #mainNavbar .nav-link,
     #mainNavbar .nav-links a {
         position: relative;
         transition: color 0.3s ease;
     }

     #mainNavbar .nav-link::after,
     #mainNavbar .nav-links a::after {
         content: "";
         position: absolute;
         right: 50%;
         bottom: -6px;
         left: 50%;
         height: 2px;
         border-radius: 10px;
         background: #f0b24d;
         transition:
             right 0.3s ease,
             left 0.3s ease;
     }

     #mainNavbar .nav-link:hover,
     #mainNavbar .nav-link.active,
     #mainNavbar .nav-links a:hover,
     #mainNavbar .nav-links a.active {
         color: #f5bd5f;
     }

     #mainNavbar .nav-link:hover::after,
     #mainNavbar .nav-link.active::after,
     #mainNavbar .nav-links a:hover::after,
     #mainNavbar .nav-links a.active::after {
         right: 18%;
         left: 18%;
     }

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

     @media (max-width: 991.98px) {
         .reach-contact {
             padding-top: 135px;
             background:
                 linear-gradient(180deg,
                     #071e35 0,
                     #0b2b49 480px,
                     #eef4f5 480px,
                     #f8faf9 100%);
         }

         /* Mobile menu needs a solid background */
         #mainNavbar .mobile-nav,
         #mainNavbar .navbar-collapse {
             background: #071e35;
         }
     }

     @media (max-width: 767.98px) {
         .reach-contact {
             padding-top: 120px;
             background:
                 linear-gradient(180deg,
                     #071e35 0,
                     #0b2b49 520px,
                     #eef4f5 520px,
                     #f8faf9 100%);
         }

         .reach-topbar {
             margin-bottom: 40px;
         }

         .reach-subtext {
             color: rgba(255, 255, 255, 0.75);
         }
     }

     @media (max-width: 575.98px) {
         .reach-contact {
             padding-top: 105px;
             background:
                 linear-gradient(180deg,
                     #071e35 0,
                     #0b2b49 500px,
                     #eef4f5 500px,
                     #f8faf9 100%);
         }

         .reach-contact::before {
             width: 400px;
             height: 400px;
             top: -160px;
             right: -200px;
         }
     }


     /* End css of Contact */



     /* css of ody-flow */



     .ody-flow {
         font-family: var(--ody-font-body);
         background: var(--ody-light);
     }



     /* ========== ODYSSEY FLOW SECTION ========== */
     .ody-flow {
         position: relative;
         padding: 100px 0 0;
         background: linear-gradient(to bottom, #e8e4df 0%, #d5cfc7 60%, #c4bdb3 100%);
         overflow: hidden;
         min-height: 100vh;
     }

     /* Bottom landscape background */
     .ody-landscape {
         position: absolute;
         bottom: 0;
         left: 0;
         right: 0;
         height: 45%;
         z-index: 1;
         pointer-events: none;
     }

     .ody-landscape img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         object-position: bottom;
     }

     .ody-landscape::after {
         content: '';
         position: absolute;
         bottom: 0;
         left: 0;
         right: 0;
         height: 60%;
         background: linear-gradient(to top, rgba(212, 207, 199, 0.95) 0%, transparent 100%);
     }

     /* SVG Connecting Line */
     .ody-connector {
         position: absolute;
         top: 120px;
         left: 50%;
         transform: translateX(-50%);
         width: 100%;
         max-width: 900px;
         height: calc(100% - 200px);
         z-index: 2;
         pointer-events: none;
     }

     .ody-connector svg {
         width: 100%;
         height: 100%;
     }

     .ody-connector path {
         fill: none;
         stroke: #4a4a4a;
         stroke-width: 1.5;
         stroke-dasharray: 6, 6;
         opacity: 0.5;
     }

     .ody-node {
         fill: #4a4a4a;
         stroke: #e8e4df;
         stroke-width: 3;
     }

     /* Content Container */
     .ody-wrap {
         position: relative;
         z-index: 5;
     }

     /* ---- Journey Block ---- */
     .ody-block {
         margin-bottom: 80px;
         align-items: center;
     }

     .ody-block:last-child {
         margin-bottom: 200px;
     }

     /* Image Shapes with organic clip-paths */
     .ody-img-shell {
         position: relative;
         filter: drop-shadow(0 15px 35px rgba(0, 0, 0, 0.2));
     }

     .ody-img-shell img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         display: block;
     }

     /* Shape 1 - Top left, mountain climber */
     .ody-shape-1 {
         width: 100%;
         max-width: 420px;
         height: 320px;
         margin-left: auto;
         margin-right: 40px;
     }

     .ody-shape-1 img {
         clip-path: polygon(5% 0%, 85% 2%, 95% 15%, 100% 45%, 92% 70%,
                 88% 85%, 75% 95%, 45% 100%, 20% 92%,
                 5% 80%, 0% 55%, 2% 25%);
         border-radius: 20px;
     }

     /* Shape 2 - Middle right, campfire */
     .ody-shape-2 {
         width: 100%;
         max-width: 400px;
         height: 280px;
         margin-left: 40px;
     }

     .ody-shape-2 img {
         clip-path: ellipse(48% 46% at 50% 50%);
         border-radius: 50%;
     }

     /* Shape 3 - Bottom left, snow hikers */
     .ody-shape-3 {
         width: 100%;
         max-width: 440px;
         height: 300px;
         margin-left: auto;
         margin-right: 20px;
     }

     .ody-shape-3 img {
         clip-path: polygon(10% 5%, 60% 0%, 90% 10%, 100% 40%,
                 95% 70%, 85% 90%, 50% 100%, 15% 90%,
                 0% 60%, 5% 30%);
         border-radius: 20px;
     }

     /* Text Content */
     .ody-text {
         padding: 20px 30px;
     }

     .ody-text-right {
         padding-left: 50px;
     }

     .ody-text-left {
         padding-right: 50px;
         text-align: right;
     }

     .ody-text-left .ody-link {
         justify-content: flex-end;
     }

     .ody-title {
         font-family: var(--ody-font-display);
         font-size: clamp(1.3rem, 2.5vw, 1.7rem);
         font-weight: 700;
         color: var(--ody-dark);
         text-transform: uppercase;
         letter-spacing: 1.5px;
         margin-bottom: 16px;
         line-height: 1.3;
     }

     .ody-desc {
         font-size: 0.85rem;
         color: rgb(3, 2, 2);
         line-height: 1.8;
         margin-bottom: 20px;
         max-width: 380px;
     }

     .ody-text-left .ody-desc {
         margin-left: auto;
     }

     .ody-link {
         display: inline-flex;
         align-items: center;
         gap: 8px;
         font-size: 0.8rem;
         font-weight: 600;
         color: var(--ody-dark);
         text-transform: uppercase;
         letter-spacing: 1.5px;
         text-decoration: none;
         transition: all 0.3s ease;
         border-bottom: 1px solid transparent;
         padding-bottom: 2px;
     }

     .ody-link:hover {
         color: var(--ody-accent);
         border-bottom-color: var(--ody-accent);
     }

     .ody-link i {
         font-size: 0.7rem;
         transition: transform 0.3s ease;
     }

     .ody-link:hover i {
         transform: translateX(4px);
     }

     /* ========== RESPONSIVE ========== */
     @media (max-width: 991px) {
         .ody-flow {
             padding: 60px 0 0;
         }

         .ody-connector {
             display: none;
         }

         .ody-block {
             margin-bottom: 50px;
         }

         .ody-block:last-child {
             margin-bottom: 150px;
         }

         .ody-shape-1,
         .ody-shape-2,
         .ody-shape-3 {
             margin: 0 auto 30px;
             max-width: 100%;
             height: 280px;
         }

         .ody-text {
             text-align: center;
             padding: 0 20px;
         }

         .ody-text-right,
         .ody-text-left {
             padding: 0 20px;
             text-align: center;
         }

         .ody-text-left .ody-link,
         .ody-text-right .ody-link {
             justify-content: center;
         }

         .ody-desc {
             margin: 0 auto 20px;
         }

         .ody-text-left .ody-desc {
             margin-left: auto;
             margin-right: auto;
         }
     }

     @media (max-width: 576px) {

         .ody-shape-1,
         .ody-shape-2,
         .ody-shape-3 {
             height: 220px;
         }

         .ody-title {
             font-size: 1.2rem;
         }

         .ody-block:last-child {
             margin-bottom: 120px;
         }
     }



     /* End css of ody-flow */




     /*  css of About */

     :root {
         --trvl-primary: #5a9e7f;
         --trvl-primary-dark: #4a8b6e;
         --trvl-text-dark: #2c3e50;
         --trvl-text-muted: #6c757d;
         --trvl-text-orange: orange;
         --trvl-bg-light: #f8f9fa;
         --trvl-white: #ffffff;
         --trvl-overlay: rgba(15, 14, 14, 0.5);
     }


     .trvl {
         display: inline-flex;
         align-items: center;
         justify-content: center;
         padding: 13px 30px;
         color: #ffffff;
         background: linear-gradient(135deg, #ff6b35, #ff3d00);
         border: 2px solid transparent;
         border-radius: 50px;
         font-size: 15px;
         font-weight: 600;
         letter-spacing: 0.5px;
         text-decoration: none;
         box-shadow: 0 8px 22px rgba(255, 61, 0, 0.3);
         transition: all 0.35s ease;
     }

     .trvl:hover {
         color: orange;
         background: transparent;
         border-color: #ff4b1f;
         transform: translateY(-3px);
         box-shadow: 0 12px 28px rgba(255, 61, 0, 0.25);
     }

     .trvl:active {
         transform: translateY(-1px);
     }


     .about {
         font-family: 'Poppins', sans-serif;
         color: var(--trvl-text-dark);
         overflow-x: hidden;
     }



     .trvl-breadcrumb-wrap {
         min-height: 300px;
         display: flex;
         align-items: center;
     }

     .trvl-page-title {
         font-family: 'Playfair Display', serif;
         font-size: 48px;
         font-weight: 600;
     }


     /* Tablet */
     @media (max-width: 991px) {
         .trvl-breadcrumb-wrap {
             min-height: 260px;
         }

         .trvl-page-title {
             font-size: 40px;
         }
     }


     /* Mobile */
     @media (max-width: 767px) {
         .trvl-breadcrumb-wrap {
             min-height: 220px;
         }

         .trvl-page-title {
             font-size: 34px;
             margin-bottom: 15px !important;
         }
     }


     /* Small Mobile */
     @media (max-width: 480px) {
         .trvl-breadcrumb-wrap {
             min-height: 200px;
         }

         .trvl-page-title {
             font-size: 30px;
         }
     }





     /* =========================================
   Breadcrumb Background
========================================= */

     .trvl-breadcrumb-wrap {
         position: relative;
         min-height: 300px;

         display: flex;
         align-items: center;

         /* background-image:
             linear-gradient(rgba(0, 0, 0, 0.45),
                 rgba(0, 0, 0, 0.45)),
             url("https://res.cloudinary.com/worldpackers/image/upload/c_limit,f_auto,q_auto,w_1140/nikbcskxpgu4pcqpmipy"); */

         background-size: cover;
         background-position: center;
         background-repeat: no-repeat;

         overflow: hidden;
     }

     /* Content above background */
     .trvl-breadcrumb-wrap .container {
         position: relative;
         z-index: 2;
     }

     /* Page title */
     .trvl-page-title {
         color: #fff;
         font-family: 'Playfair Display', serif;
         font-size: 48px;
         font-weight: 600;
         margin: 0;
     }

     /* Breadcrumb */
     .trvl-breadcrumb-list {
         display: flex;
         align-items: center;
         gap: 12px;

         list-style: none;
         padding: 0;
         margin: 0;
     }

     .trvl-breadcrumb-list li {
         color: #fff;
         font-family: 'Poppins', sans-serif;
         font-size: 15px;
     }

     .trvl-breadcrumb-list li+li::before {
         content: "/";
         margin-right: 12px;
         color: rgba(255, 255, 255, 0.7);
     }

     .trvl-breadcrumb-list li a {
         color: #fff;
         text-decoration: none;
         transition: 0.3s ease;
     }

     .trvl-breadcrumb-list li a:hover {
         color: #ddd;
     }

     .trvl-breadcrumb-list li.active {
         color: rgba(255, 255, 255, 0.75);
     }


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

     @media (max-width: 991px) {

         .trvl-breadcrumb-wrap {
             min-height: 260px;
         }

         .trvl-page-title {
             font-size: 40px;
         }

     }


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

     @media (max-width: 767px) {

         .trvl-breadcrumb-wrap {
             min-height: 230px;
             padding: 60px 0;
             text-align: center;

             background-position: center center;
         }

         .trvl-page-title {
             font-size: 34px;
             margin-bottom: 15px;
         }

         .trvl-breadcrumb-list {
             justify-content: center !important;
             flex-wrap: wrap;
             gap: 8px;
         }

         .trvl-breadcrumb-list li {
             font-size: 14px;
         }

         .trvl-breadcrumb-list li+li::before {
             margin-right: 8px;
         }

     }


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

     @media (max-width: 480px) {

         .trvl-breadcrumb-wrap {
             min-height: 200px;
             padding: 50px 15px;
         }

         .trvl-page-title {
             font-size: 30px;
         }

         .trvl-breadcrumb-list li {
             font-size: 13px;
         }

     }


     .trvl-section {
         padding: 80px 0;
         position: relative;
     }

     .trvl-breadcrumb-wrap {
         padding: 20px 0;
         background: var(--trvl-bg-light);
     }

     .trvl-breadcrumb-list {
         list-style: none;
         padding: 0;
         margin: 0;
         display: flex;
         align-items: center;
         gap: 10px;
         font-size: 14px;
     }

     .trvl-breadcrumb-list li a {
         color: var(--trvl-text-muted);
         text-decoration: none;
         transition: color 0.3s;
     }

     .trvl-breadcrumb-list li a:hover {
         color: var(--trvl-primary);
     }

     .trvl-breadcrumb-list li.active {
         color: var(--trvl-primary);
     }

     .trvl-breadcrumb-list li:not(:last-child)::after {
         margin-left: 10px;
         color: var(--trvl-text-muted);
         font-size: 12px;
     }

     .trvl-page-title {
         font-family: 'Playfair Display', serif;
         font-size: 42px;
         font-weight: 600;
         color: var(--trvl-text-dark);
         margin-bottom: 10px;
     }

     .trvl-deco-img-wrap {
         position: absolute;
         top: 0;
         right: 0;
         width: 350px;
         height: 220px;
         overflow: hidden;
         border-radius: 0 0 0 150px;
         z-index: 1;
     }

     .trvl-deco-img-wrap img {
         width: 100%;
         height: 100%;
         object-fit: cover;
     }

     .trvl-about-main {
         padding-top: 60px;
     }

     .trvl-img-card-wrap {
         position: relative;
     }

     .trvl-main-img {
         width: 100%;
         height: 450px;
         object-fit: cover;
         border-radius: 8px;
         box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
     }

     .trvl-quote-card {
         position: absolute;
         top: 30px;
         right: -30px;
         background: var(--trvl-white);
         padding: 25px;
         border-radius: 8px;
         box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
         max-width: 220px;
         z-index: 10;
     }

     .trvl-quote-card p {
         font-size: 14px;
         color: var(--trvl-text-dark);
         font-style: italic;
         margin-bottom: 15px;
         line-height: 1.6;
     }

     .trvl-quote-author {
         display: flex;
         align-items: center;
         gap: 10px;
     }

     .trvl-quote-author img {
         width: 40px;
         height: 40px;
         border-radius: 50%;
         object-fit: cover;
     }

     .trvl-quote-author-info h6 {
         font-size: 13px;
         margin: 0;
         font-weight: 600;
     }

     .trvl-quote-author-info span {
         font-size: 12px;
         color: var(--trvl-text-muted);
     }

     .trvl-content-box {
         padding-left: 40px;
     }

     .trvl-label {
         font-size: 12px;
         text-transform: uppercase;
         letter-spacing: 2px;
         color: var(--trvl-text-muted);
         margin-bottom: 15px;
         display: block;
     }

     .trvl-heading {
         font-family: 'Playfair Display', serif;
         font-size: 32px;
         font-weight: 600;
         color: var(--trvl-text-dark);
         margin-bottom: 20px;
         line-height: 1.3;
     }

     .trvl-desc {
         font-size: 15px;
         color: var(--trvl-text-muted);
         line-height: 1.8;
         margin-bottom: 20px;
     }

     .trvl-author-box {
         display: flex;
         align-items: center;
         gap: 15px;
         margin-bottom: 25px;
         padding: 15px;
         background: var(--trvl-bg-light);
         border-radius: 8px;
     }

     .trvl-author-box img {
         width: 50px;
         height: 50px;
         border-radius: 50%;
         object-fit: cover;
     }

     .trvl-author-info h5 {
         font-size: 15px;
         margin: 0;
         font-weight: 600;
     }

     .trvl-author-info p {
         font-size: 13px;
         color: var(--trvl-text-muted);
         margin: 0;
     }

     .trvl-btn-primary {
         background: var(--trvl-primary);
         color: var(--trvl-white);
         padding: 12px 30px;
         border-radius: 4px;
         text-decoration: none;
         font-size: 13px;
         font-weight: 500;
         text-transform: uppercase;
         letter-spacing: 1px;
         display: inline-block;
         transition: all 0.3s;
         border: none;
     }

     .trvl-btn-primary:hover {
         background: var(--trvl-primary-dark);
         color: var(--trvl-white);
         transform: translateY(-2px);
         box-shadow: 0 5px 20px rgba(90, 158, 127, 0.3);
     }

     .trvl-stats-row {
         padding: 60px 0;
         background: var(--trvl-bg-light);
         margin-top: 60px;
     }

     .trvl-stat-item {
         text-align: center;
     }

     .trvl-stat-num {
         font-family: 'Playfair Display', serif;
         font-size: 36px;
         font-weight: 700;
         color: var(--trvl-text-orange);
         margin-bottom: 5px;
     }

     .trvl-stat-label {
         font-size: 14px;
         color: var(--trvl-text-muted);
     }

     .trvl-banner-wrap {
         position: relative;
         height: 400px;
         background: url('https://english.onlinekhabar.com/wp-content/uploads/2016/08/A-view-from-the-Badimalika-Temple-Region-Bajura-District-of-Far-western-Nepal..jpg') center/cover no-repeat;
         display: flex;
         align-items: center;
         justify-content: center;
         text-align: center;
     }

     .trvl-banner-overlay {
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background: var(--trvl-overlay);
     }

     .trvl-banner-content {
         position: relative;
         z-index: 2;
         color: var(--trvl-white);
         max-width: 700px;
         padding: 0 20px;
     }

     .trvl-banner-label {
         font-size: 12px;
         text-transform: uppercase;
         letter-spacing: 3px;
         margin-bottom: 15px;
         display: block;
         opacity: 0.9;
     }

     .trvl-banner-heading {
         font-family: 'Playfair Display', serif;
         font-size: 36px;
         font-weight: 600;
         margin-bottom: 20px;
         line-height: 1.3;
     }

     .trvl-banner-desc {
         font-size: 15px;
         opacity: 0.9;
         margin-bottom: 30px;
         line-height: 1.7;
     }

     .trvl-btn-outline {
         background: transparent;
         color: var(--trvl-white);
         padding: 12px 30px;
         border-radius: 4px;
         text-decoration: none;
         font-size: 13px;
         font-weight: 500;
         text-transform: uppercase;
         letter-spacing: 1px;
         display: inline-block;
         border: 2px solid var(--trvl-white);
         transition: all 0.3s;
     }

     .trvl-btn-outline:hover {
         background: var(--trvl-text-orange);
         color: var(--nest-darker);
     }

     .trvl-features-wrap {
         background: var(--trvl-bg-light);
         padding: 0 0 60px 0;
     }

     .trvl-feature-card {
         background: var(--trvl-white);
         padding: 30px;
         border-radius: 8px;
         box-shadow: 0 2px 15px rgba(0, 0, 0, 0.05);
         display: flex;
         align-items: flex-start;
         gap: 20px;
         height: 100%;
         transition: all 0.3s;
     }

     .trvl-feature-card:hover {
         transform: translateY(-5px);
         box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     }

     .trvl-feature-icon {
         width: 50px;
         height: 50px;
         background: var(--trvl-primary);
         color: var(--trvl-white);
         border-radius: 8px;
         display: flex;
         align-items: center;
         justify-content: center;
         font-size: 22px;
         flex-shrink: 0;
     }

     .trvl-feature-info h4 {
         font-size: 16px;
         font-weight: 600;
         margin-bottom: 8px;
     }

     .trvl-feature-info p {
         font-size: 14px;
         color: var(--trvl-text-muted);
         margin: 0;
         line-height: 1.6;
     }

     .trvl-team-wrap {
         padding: 80px 0;
         background: var(--trvl-white);
     }

     .trvl-section-header {
         text-align: center;
         margin-bottom: 50px;
     }

     .trvl-section-label {
         font-size: 12px;
         text-transform: uppercase;
         letter-spacing: 2px;
         color: var(--trvl-text-muted);
         margin-bottom: 10px;
         display: block;
     }

     .trvl-section-title {
         font-family: 'Playfair Display', serif;
         font-size: 32px;
         font-weight: 600;
         color: var(--trvl-text-dark);
     }

     .trvl-team-card {
         text-align: center;
     }

     .trvl-team-img-wrap {
         position: relative;
         overflow: hidden;
         border-radius: 8px;
         margin-bottom: 20px;
     }

     .trvl-team-img {
         width: 100%;
         height: 320px;
         object-fit: cover;
         transition: transform 0.5s;
     }

     .trvl-team-card:hover .trvl-team-img {
         transform: scale(1.05);
     }

     .trvl-team-social {
         display: flex;
         justify-content: center;
         gap: 12px;
         margin-top: 12px;
     }

     .trvl-team-social a {
         width: 32px;
         height: 32px;
         border-radius: 50%;
         background: var(--trvl-bg-light);
         color: var(--trvl-text-muted);
         display: flex;
         align-items: center;
         justify-content: center;
         text-decoration: none;
         font-size: 14px;
         transition: all 0.3s;
     }

     .trvl-team-social a:hover {
         background: var(--trvl-text-orange);
         color: var(--trvl-white);
         transform: translateY(-2px);
     }

     .trvl-team-name {
         font-size: 18px;
         font-weight: 600;
         margin-bottom: 5px;
     }

     .trvl-team-role {
         font-size: 14px;
         color: var(--trvl-text-muted);
         margin-bottom: 0;
     }

     @media (max-width: 991px) {
         .trvl-deco-img-wrap {
             width: 250px;
             height: 150px;
         }

         .trvl-content-box {
             padding-left: 0;
             margin-top: 40px;
         }

         .trvl-quote-card {
             right: 10px;
             top: 10px;
         }

         .trvl-banner-heading {
             font-size: 28px;
         }
     }

     @media (max-width: 767px) {
         .trvl-page-title {
             font-size: 32px;
         }

         .trvl-heading {
             font-size: 26px;
         }

         .trvl-deco-img-wrap {
             display: none;
         }

         .trvl-quote-card {
             position: relative;
             right: 0;
             top: 0;
             margin-top: 20px;
             max-width: 100%;
         }

         .trvl-stat-item {
             margin-bottom: 30px;
         }

         .trvl-feature-card {
             margin-bottom: 20px;
         }
     }



     /* End css of About*/




     /* css of Services*/


     /* ================================
   SERVICE CARDS
================================ */

     .trvl-feature-card {
         height: 100%;
         padding: 30px 25px;
         background: #fff;
         border-radius: 18px;
         border: 1px solid #eee;

         display: flex;
         align-items: flex-start;
         gap: 20px;

         transition: all 0.3s ease;
     }

     .trvl-feature-card:hover {
         transform: translateY(-8px);
         box-shadow: 0 15px 40px rgba(0, 0, 0, 0.10);
     }

     .trvl-feature-icon {
         min-width: 60px;
         height: 60px;

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

         border-radius: 50%;

         background: #f1f5ff;
         color: #1d4ed8;

         font-size: 25px;
     }

     .trvl-feature-info h4 {
         margin-bottom: 10px;

         font-family: 'Playfair Display', serif;
         font-size: 21px;
         font-weight: 600;
     }

     .trvl-feature-info p {
         margin: 0;

         color: #777;
         font-size: 14px;
         line-height: 1.7;
     }


     /* ================================
   HIDDEN SERVICES
================================ */

     .more-service {
         display: none;
     }


     /* ================================
   SEE MORE BUTTON
================================ */

     .trvl-see-more-btn {
         border: none;
         background: #111;
         color: #fff;

         padding: 13px 28px;

         border-radius: 50px;

         font-family: 'Poppins', sans-serif;
         font-size: 14px;
         font-weight: 500;

         cursor: pointer;

         transition: all 0.3s ease;
     }

     .trvl-see-more-btn:hover {
         background: #333;
         transform: translateY(-2px);
     }

     .trvl-see-more-btn i {
         margin-left: 8px;
     }


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

     @media (max-width: 767px) {

         .trvl-feature-card {
             padding: 25px 20px;
         }

         .trvl-feature-icon {
             min-width: 52px;
             height: 52px;
             font-size: 21px;
         }

         .trvl-feature-info h4 {
             font-size: 19px;
         }

         .trvl-feature-info p {
             font-size: 13px;
         }

     }


     /* Service Card */
     .trvl-feature-card {
         height: 100%;
         padding: 30px 25px;
         background: #fff;
         border-radius: 18px;
         border: 1px solid #eee;

         display: flex;
         align-items: flex-start;
         gap: 20px;

         transition: all 0.3s ease;
     }

     /* Card Hover */
     .trvl-feature-card:hover {
         transform: translateY(-8px);
         box-shadow: 0 15px 40px rgba(0, 0, 0, 0.10);
     }


     /* Service Icon */
     .trvl-feature-icon {
         min-width: 60px;
         height: 60px;

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

         border-radius: 50%;

         background: #f1f5ff;
         color: #1d4ed8;

         font-size: 25px;

         transition: all 0.3s ease;
     }


     /* Icon changes to GREEN when card is hovered */
     .trvl-feature-card:hover .trvl-feature-icon {
         background: #198754;
         color: #fff;

         transform: rotate(8deg) scale(1.08);
     }


     /* End css of Services*/






     /* Animation of the ody-flow */




     /* Image Hover Effect */
     .ody-img-shell {
         overflow: hidden;
         transition: transform 0.4s ease, box-shadow 0.4s ease;
     }

     .ody-img-shell img {
         width: 100%;
         display: block;
         transition: transform 0.6s ease;
     }

     /* Hover */
     .ody-img-shell:hover {
         transform: translateY(-8px);
         box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
     }

     .ody-img-shell:hover img {
         transform: scale(1.08);
     }

     .ody-img-shell:hover {
         box-shadow: none;
         transform: translateY(-5px);
     }

     /* ==========================================
   ODYSSEY CONNECTOR - DRAW TOP TO BOTTOM
========================================== */

     .ody-connector path {
         fill: none !important;
         stroke: #4a4a4a !important;
         stroke-width: 2px !important;

         /* Dashed line */
         stroke-dasharray: 6 8 !important;

         /* Hide the path initially */
         stroke-dashoffset: 1000;

         opacity: 0.5 !important;

         animation: odyDrawLine 4s linear forwards;
     }


     /* Draw the curved line from top to bottom */
     @keyframes odyDrawLine {
         from {
             stroke-dashoffset: 1000;
         }

         to {
             stroke-dashoffset: 0;
         }
     }


     /* Keep connector visible on desktop */
     @media (min-width: 992px) {
         .ody-connector {
             display: block !important;
         }
     }



     /* End Animation of the ody-flow */


     /* Css of Gellery */




     /* =====================================================
           TRAVEL BOOK
        ===================================================== */

     .travel-book {
         width: 100%;
         height: 100vh;
         background: #d8d3cb;
         overflow: hidden;
         font-family: "Poppins", sans-serif;
     }


     .travel-book-stage {
         width: 100%;
         height: 100vh;

         position: relative;

         display: flex;
         align-items: center;
         justify-content: center;
     }


     /* =====================================================
           BOOK COVER
        ===================================================== */

     .travel-cover {
         width: min(620px, 75vw);
         height: min(760px, 82vh);

         position: absolute;

         z-index: 20;

         background:
             linear-gradient(135deg,
                 #202020,
                 #111);

         color: #fff;

         box-shadow:
             25px 30px 70px rgba(0, 0, 0, .30);

         transform-origin: left center;

         transition:
             transform 1.4s cubic-bezier(.77, 0, .18, 1),
             opacity 1s ease;
     }


     /* COVER OPEN */

     .travel-cover.cover-open {
         transform:
             perspective(2000px) rotateY(-115deg);

         opacity: 0;

         pointer-events: none;
     }


     /* =====================================================
           COVER INNER
        ===================================================== */

     .cover-inner {
         width: 100%;
         height: 100%;

         padding: 55px;

         border: 1px solid rgba(255, 255, 255, .15);

         display: flex;
         flex-direction: column;
         justify-content: space-between;
     }


     .cover-top {
         font-size: 11px;

         letter-spacing: 5px;

         opacity: .7;
     }


     .cover-center {
         text-align: center;
     }


     .cover-center span {
         font-size: 10px;

         letter-spacing: 6px;

         opacity: .65;
     }


     .cover-center h1 {
         font-family: "Playfair Display", Georgia, serif;

         font-size: clamp(60px, 9vw, 120px);

         font-weight: 400;

         line-height: .85;

         margin: 20px 0;

         letter-spacing: -5px;
     }


     .cover-bottom {
         display: flex;

         justify-content: space-between;

         font-size: 9px;

         letter-spacing: 2px;

         line-height: 1.7;

         opacity: .6;
     }


     /* =====================================================
           OPEN BOOK
        ===================================================== */

     .travel-open-book {
         width: min(1400px, 92vw);
         height: min(760px, 78vh);

         position: relative;

         display: flex;

         opacity: 0;

         transform:
             scale(.94) translateY(30px);

         transition:
             opacity 1s ease .5s,
             transform 1s ease .5s;

         box-shadow:
             0 30px 80px rgba(0, 0, 0, .20);
     }


     .travel-open-book.book-visible {
         opacity: 1;

         transform:
             scale(1) translateY(0);
     }


     /* =====================================================
           PAGES
        ===================================================== */

     .travel-page {
         width: 50%;
         height: 100%;

         position: relative;

         overflow: hidden;
     }


     .travel-page-left {
         background: #f5f1e9;
     }


     .travel-page-right {
         background: #ebe7df;
     }


     /* =====================================================
           LEFT PAGE
        ===================================================== */

     .page-content {
         height: 100%;

         padding: 35px 65px;

         display: flex;

         flex-direction: column;

         justify-content: space-between;
     }


     .page-top {
         display: flex;

         justify-content: space-between;

         align-items: center;
     }


     .chapter-number,
     .page-number {
         font-size: 9px;

         letter-spacing: 3px;

         color: #777;
     }


     .traveler-story {
         max-width: 560px;
     }


     .story-label {
         font-size: 10px;

         letter-spacing: 5px;

         color: #888;
     }


     .traveler-story h1 {
         font-family: "Playfair Display", Georgia, serif;

         font-size: clamp(50px, 5vw, 85px);

         line-height: .9;

         font-weight: 400;

         text-transform: uppercase;

         margin: 20px 0 30px;

         color: #191919;
     }


     .story-line {
         width: 70px;

         height: 1px;

         background: #555;

         margin-bottom: 25px;
     }


     .traveler-story p {
         max-width: 500px;

         font-size: 14px;

         line-height: 1.9;

         color: #666;

         margin-bottom: 18px;
     }


     .page-bottom {
         display: flex;

         justify-content: space-between;

         border-top: 1px solid #d4d0c8;

         padding-top: 15px;

         font-size: 9px;

         letter-spacing: 3px;

         color: #888;
     }


     /* =====================================================
           CENTER BOOK SPINE
        ===================================================== */

     .book-spine {
         position: absolute;

         top: 0;
         bottom: 0;

         left: 50%;

         width: 5px;

         transform: translateX(-50%);

         z-index: 10;

         background:
             linear-gradient(to right,
                 rgba(0, 0, 0, .08),
                 rgba(255, 255, 255, .7),
                 rgba(0, 0, 0, .10));

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


     /* =====================================================
           RIGHT IMAGE
        ===================================================== */

     .trip-photo {
         width: 100%;
         height: 100%;

         position: relative;

         overflow: hidden;
     }


     .trip-photo img {
         width: 100%;
         height: 100%;

         object-fit: cover;

         display: block;

         transform: scale(1.08);

         transition:
             transform 1.5s ease,
             opacity .7s ease;
     }


     .travel-open-book.book-visible .trip-photo img {
         transform: scale(1);
     }


     /* IMAGE OVERLAY */

     .photo-overlay {
         position: absolute;

         bottom: 35px;
         left: 35px;

         color: white;

         font-size: 10px;

         letter-spacing: 4px;

         text-shadow:
             0 2px 10px rgba(0, 0, 0, .4);
     }


     .photo-number {
         position: absolute;

         right: 25px;
         top: 25px;

         color: white;

         font-size: 10px;

         letter-spacing: 3px;

         z-index: 3;
     }


     /* =====================================================
           PAGE CHANGE ANIMATION
        ===================================================== */

     .travel-open-book.page-turn .travel-page-left {
         animation:
             storyPage .8s ease;
     }


     .travel-open-book.page-turn .travel-page-right {
         animation:
             imagePage .8s ease;
     }


     @keyframes storyPage {

         0% {
             transform: translateX(0);
             opacity: 1;
         }

         50% {
             transform: translateX(-35px);
             opacity: 0;
         }

         100% {
             transform: translateX(0);
             opacity: 1;
         }
     }


     @keyframes imagePage {

         0% {
             transform: translateX(0);
             opacity: 1;
         }

         50% {
             transform: translateX(35px);
             opacity: 0;
         }

         100% {
             transform: translateX(0);
             opacity: 1;
         }
     }


     /* =====================================================
           NAVIGATION
        ===================================================== */

     .book-navigation {
         position: absolute;

         bottom: 30px;

         left: 50%;

         transform: translateX(-50%);

         width: min(1400px, 92vw);

         display: flex;

         justify-content: space-between;

         align-items: center;

         z-index: 30;
     }


     .book-nav-btn {
         width: 45px;
         height: 45px;

         border: 1px solid rgba(0, 0, 0, .3);

         background: transparent;

         border-radius: 50%;

         font-size: 18px;

         transition: .3s ease;

         cursor: pointer;

         display: flex;

         align-items: center;

         justify-content: center;
     }


     .book-nav-btn:hover {
         background: #111;

         color: #fff;

         transform: scale(1.05);
     }


     .book-nav-btn:active {
         transform: scale(.95);
     }


     /* =====================================================
           PROGRESS
        ===================================================== */

     .book-progress {
         display: flex;

         align-items: center;

         gap: 18px;

         font-size: 9px;

         letter-spacing: 3px;

         color: #666;
     }


     .progress-line {
         width: 100px;

         height: 1px;

         background: #bbb;

         position: relative;
     }


     .progress-line span {
         position: absolute;

         top: 0;
         left: 0;

         width: 0;

         height: 1px;

         background: #111;

         transition: width .5s ease;
     }


     /* =====================================================
           SCROLL HINT
        ===================================================== */

     .book-scroll-hint {
         position: absolute;

         bottom: 10px;

         right: 35px;

         font-size: 9px;

         letter-spacing: 3px;

         color: #090909;

         display: flex;

         align-items: center;

         gap: 10px;
     }


     .book-scroll-hint span {
         width: 25px;

         height: 1px;

         background: #777;
     }


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

     @media (max-width: 991px) {

         .travel-book {
             height: auto;

             min-height: 100vh;

             overflow: auto;
         }


         .travel-book-stage {
             height: auto;

             min-height: 100vh;

             padding: 40px 15px 100px;
         }


         .travel-cover {
             width: 90vw;

             height: 650px;
         }


         .travel-open-book {
             width: 94vw;

             height: auto;

             min-height: 750px;

             flex-direction: column;
         }


         .travel-page {
             width: 100%;
         }


         .travel-page-left {
             min-height: 550px;
         }


         .travel-page-right {
             min-height: 450px;
         }


         .book-spine {
             display: none;
         }


         .page-content {
             padding: 40px 30px;
         }


         .traveler-story h1 {
             font-size: 52px;
         }


         .book-navigation {
             bottom: 25px;
         }


         .book-scroll-hint {
             display: none;
         }

     }


     /* =====================================================
           SMALL MOBILE
        ===================================================== */

     @media (max-width: 575px) {

         .travel-cover {
             height: 580px;
         }


         .cover-inner {
             padding: 35px;
         }


         .cover-center h1 {
             font-size: 65px;
         }


         .traveler-story h1 {
             font-size: 43px;
         }


         .traveler-story p {
             font-size: 13px;
         }


         .book-progress {
             gap: 8px;

             font-size: 8px;
         }


         .progress-line {
             width: 60px;
         }


         .book-nav-btn {
             width: 40px;

             height: 40px;
         }

     }



     /* Css of Transport  */


     .transport {
         font-family: var(--amc-font);
         background: var(--amc-white);
         color: var(--amc-dark);
         overflow-x: hidden;
     }


     /* ===== HERO ===== */
     .amc-hero {
         position: relative;
         min-height: 700px;
         display: flex;
         align-items: center;
         background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
         overflow: hidden;
     }

     .amc-hero::before {
         content: '';
         position: absolute;
         inset: 0;
         background: url('https://images.unsplash.com/photo-1555215695-3004980adade?w=1920&q=80') center/cover no-repeat;
         opacity: 0.4;
     }

     .amc-hero::after {
         content: '';
         position: absolute;
         inset: 0;
         /* background: linear-gradient(90deg, rgba(15, 23, 42, 0.95) 0%, rgba(15, 23, 42, 0.7) 40%, rgba(15, 23, 42, 0.3) 70%, rgba(15, 23, 42, 0.1) 100%); */
     }

     .amc-hero-wrap {
         position: relative;
         z-index: 2;
         width: 100%;
         padding: 100px 0 180px;
     }

     .amc-hero-label {
         color: orange;
         font-size: 0.8rem;
         font-weight: 600;
         letter-spacing: 3px;
         text-transform: uppercase;
         margin-bottom: 16px;
     }

     .amc-hero-title {
         font-size: clamp(2.5rem, 5vw, 4.5rem);
         font-weight: 900;
         color: var(--amc-white);
         line-height: 1.1;
         margin-bottom: 20px;
         letter-spacing: -1px;
     }

     .amc-hero-title em {
         color: var(--amc-primary);
         font-style: normal;
     }

     .amc-hero-desc {
         color: rgba(255, 255, 255, 0.7);
         font-size: 1rem;
         max-width: 450px;
         margin-bottom: 30px;
         line-height: 1.7;
     }

     .amc-hero-actions {
         display: flex;
         gap: 15px;
         flex-wrap: wrap;
     }

     .amc-btn-primary {
         background: var(--amc-primary);
         color: var(--amc-white);
         padding: 14px 32px;
         border-radius: 6px;
         font-weight: 700;
         font-size: 0.85rem;
         text-decoration: none;
         transition: all 0.3s;
         border: 2px solid var(--amc-primary);
         display: inline-flex;
         align-items: center;
         gap: 8px;
         text-transform: uppercase;
         letter-spacing: 0.5px;
     }

     .amc-btn-primary:hover {
         background: var(--amc-primary-dark);
         border-color: var(--amc-primary-dark);
         color: var(--amc-white);
         transform: translateY(-2px);
         box-shadow: 0 10px 30px rgba(220, 38, 38, 0.3);
     }

     .amc-btn-outline {
         background: transparent;
         color: var(--amc-white);
         padding: 14px 32px;
         border-radius: 6px;
         font-weight: 700;
         font-size: 0.85rem;
         text-decoration: none;
         transition: all 0.3s;
         border: 2px solid rgba(255, 255, 255, 0.3);
         display: inline-flex;
         align-items: center;
         gap: 8px;
         text-transform: uppercase;
         letter-spacing: 0.5px;
     }

     .amc-btn-outline:hover {
         background: var(--amc-white);
         color: var(--amc-dark);
         border-color: var(--amc-white);
         transform: translateY(-2px);
     }

     /* Hero Car Image */
     .amc-hero-car {
         position: relative;
         z-index: 3;
         display: flex;
         align-items: center;
         justify-content: center;
         height: 100%;
     }

     .amc-hero-car img {
         max-width: 100%;
         height: auto;
         filter: drop-shadow(0 20px 60px rgba(0, 0, 0, 0.5));
         transform: scale(1.1);
         animation: amcCarFloat 4s ease-in-out infinite;
     }

     @keyframes amcCarFloat {

         0%,
         100% {
             transform: scale(1.1) translateY(0);
         }

         50% {
             transform: scale(1.1) translateY(-10px);
         }
     }

     /* ===== SEARCH BAR ===== */
     .amc-searchbar {
         position: absolute;
         bottom: -60px;
         left: 0;
         right: 0;
         z-index: 10;

     }

     /* Reduce space between the two inventory sections */
     .amc-inventory {
         padding: 50px 0;
     }

     .amc-inventory+.amc-inventory {
         padding-top: 10px;
     }

     /* Parent section containing the search bar */
     .amc-hero {
         overflow: visible !important;
     }

     .amc-searchbox {
         position: relative;
         background-color: #ffffff;
         padding: 25px;
         border-radius: 12px;
         box-shadow: 0 14px 18px -12px rgba(0, 0, 0, 0.45);
     }

     .parent-section {
         overflow: visible;
     }

     .amc-searchbox {
         background: var(--amc-darker);
         border-radius: 12px;
         padding: 25px 30px;
         box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
     }

     .amc-search-label {
         color: var(--amc-text);
         font-size: 0.75rem;
         font-weight: 600;
         text-transform: uppercase;
         letter-spacing: 1px;
         margin-bottom: 8px;
         display: block;
     }

     .amc-searchfield {
         width: 100%;
         padding: 12px 16px;
         border-radius: 8px;
         border: 1px solid rgba(255, 255, 255, 0.1);
         background: rgba(255, 255, 255, 0.05);
         color: var(--amc-text);
         font-size: 0.9rem;
         outline: none;
         transition: all 0.3s;
     }

     .amc-searchfield:focus {
         border-color: var(--amc-primary);
         background: rgba(255, 255, 255, 0.08);
     }

     .amc-searchfield option {
         background: var(--amc-dark);
         color: var(--amc-white);
     }

     .amc-searchbtn {
         width: 100%;
         height: 100%;
         min-height: 48px;
         padding: 20px;
         background: var(--amc-primary);
         color: var(--amc-white);
         border: none;
         border-radius: 8px;
         font-weight: 700;
         font-size: 0.85rem;
         text-transform: uppercase;
         letter-spacing: 1px;
         transition: all 0.3s;
     }

     .amc-searchbtn:hover {
         background: var(--amc-primary-dark);
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(220, 38, 38, 0.3);
     }

     .amc-advanced {
         color: rgba(255, 255, 255, 0.5);
         font-size: 0.75rem;
         text-decoration: none;
         transition: color 0.3s;
     }

     .amc-advanced:hover {
         color: var(--amc-white);
     }

     /* ===== INVENTORY ===== */
     .amc-inventory {
         padding: 120px 0 80px;
         background: var(--amc-white);
     }

     .amc-sectionhead {
         text-align: center;
         margin-bottom: 40px;
     }

     .amc-sectiontitle {
         font-size: clamp(1.5rem, 3vw, 2.2rem);
         font-weight: 800;
         color: var(--amc-dark);
         margin-bottom: 25px;
         position: relative;
         display: inline-block;
     }

     .amc-sectiontitle::before,
     .amc-sectiontitle::after {
         content: '';
         position: absolute;
         top: 50%;
         width: 50px;
         height: 2px;
         background: var(--amc-primary);
     }

     .amc-sectiontitle::before {
         right: calc(100% + 20px);
     }

     .amc-sectiontitle::after {
         left: calc(100% + 20px);
     }

     .amc-filterlist {
         display: flex;
         justify-content: center;
         gap: 8px;
         flex-wrap: wrap;
         list-style: none;
         padding: 0;
         margin: 0;
     }

     .amc-filterlist li button {
         padding: 10px 24px;
         border-radius: 50px;
         border: 1px solid var(--amc-border);
         background: var(--amc-white);
         color: var(--amc-gray);
         font-weight: 600;
         font-size: 0.8rem;
         text-transform: uppercase;
         letter-spacing: 0.5px;
         transition: all 0.3s;
         cursor: pointer;
     }

     .amc-filterlist li button.active,
     .amc-filterlist li button:hover {
         background: var(--amc-dark);
         color: var(--amc-white);
         border-color: var(--amc-dark);
     }

     .amc-vehiclegrid {
         margin-top: 40px;
     }

     /* Compact vehicle card */
     .amc-vehicleitem {
         display: flex;
     }

     .amc-vehiclecard {
         width: 100%;
         max-width: 280px;
         margin: 0 auto;
         display: flex;
         flex-direction: column;
         background: #ffffff;
         border: 1px solid #eeeeee;
         border-radius: 10px;
         overflow: hidden;
         box-shadow: 0 10px 18px -12px rgba(0, 0, 0, 0.45);
         transition: transform 0.3s ease, box-shadow 0.3s ease;
     }

     .amc-vehiclecard:hover {
         transform: translateY(-5px);
         box-shadow: 0 15px 24px -12px rgba(0, 0, 0, 0.5);
     }

     /* Smaller image */
     .amc-vehicleimgwrap {
         position: relative;
         width: 100%;
         height: 155px;
         overflow: hidden;
     }

     .amc-vehicleimgwrap img {
         width: 100%;
         height: 100%;
         display: block;
         object-fit: cover;
         transition: transform 0.4s ease;
     }

     .amc-vehiclecard:hover .amc-vehicleimgwrap img {
         transform: scale(1.05);
     }

     /* Smaller year badge */
     .amc-vehiclebadge {
         position: absolute;
         top: 10px;
         left: 10px;
         padding: 4px 9px;
         color: #ffffff;
         background: orange;
         border-radius: 5px;
         font-size: 0.67rem;
         font-weight: 700;
     }

     /* Compact content */
     .amc-vehicleinfo {
         flex: 1;
         display: flex;
         flex-direction: column;
         padding: 14px;
     }

     .amc-vehiclemeta {
         display: flex;
         flex-wrap: wrap;
         gap: 9px;
         margin-bottom: 8px;
         color: #013274;
         font-size: 0.68rem;
     }

     .amc-vehiclemeta span {
         display: inline-flex;
         align-items: center;
         gap: 4px;
     }

     .amc-vehiclename {
         margin: 0 0 7px;
         color: #171717;
         font-size: 1rem;
         font-weight: 700;
         line-height: 1.3;
     }

     .amc-vehicleprice {
         margin-bottom: 8px;
         color: orange;
         font-size: 1.1rem;
         font-weight: 800;
     }

     /* Trip duration */
     .amc-vehicleduration {
         display: flex;
         align-items: center;
         gap: 5px;
         margin-bottom: 11px;
         color: #013274;
         font-size: 0.75rem;
     }

     .amc-vehicleduration i {
         color: #dc3545;
     }

     /* Details link */
     .amc-vehiclelink {
         display: flex;
         align-items: center;
         justify-content: space-between;
         margin-top: auto;
         padding-top: 10px;
         border-top: 1px solid #eeeeee;
         color: #013274;
         font-size: 0.72rem;
         font-weight: 700;
         text-decoration: none;
         transition: color 0.3s ease;
     }

     .amc-vehiclelink:hover {
         color: #dc3545;
     }

     /* ===== FEATURES ===== */


     /* Features section heading */
     .amc-sectionheading {
         max-width: 700px;
         margin: 0 auto 45px;
     }

     .amc-sectionsubtitle {
         display: inline-block;
         margin-bottom: 8px;
         color: #f58220;
         font-size: 0.78rem;
         font-weight: 800;
         letter-spacing: 2px;
     }

     .amc-sectiontitle {
         margin-bottom: 12px;
         color: #ffffff;
         font-size: clamp(1.8rem, 4vw, 2.6rem);
         font-weight: 800;
         line-height: 1.2;
     }

     .amc-sectiondescription {
         margin: 0;
         color: #013274;
         font-size: 1rem;
         line-height: 1.7;
     }

     @media (max-width: 576px) {
         .amc-sectionheading {
             margin-bottom: 30px;
         }

         .amc-sectiondescription {
             font-size: 0.9rem;
         }
     }


     .amc-features {
         padding: 60px 0;
         background: var(--amc-light);
     }

     .amc-featurebox {
         text-align: center;
         padding: 30px 20px;
         transition: all 0.3s;
     }

     .amc-featurebox:hover {
         transform: translateY(-5px);
     }

     .amc-featureicon {
         width: 60px;
         height: 60px;
         background: var(--amc-white);
         border-radius: 50%;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         font-size: 1.5rem;
         color: var(--amc-primary);
         margin-bottom: 20px;
         box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
         transition: all 0.3s;
     }

     .amc-featurebox:hover .amc-featureicon {
         background: var(--amc-primary);
         color: var(--amc-white);
         transform: rotate(8deg) scale(1.1);
     }

     .amc-featuretitle {
         font-size: 1.1rem;
         font-weight: 700;
         color: var(--amc-dark);
         margin-bottom: 10px;
     }

     .amc-featuredesc {
         font-size: 0.85rem;
         /* color: var(--amc-gray); */
         color: white;
         line-height: 1.7;
         max-width: 280px;
         margin: 0 auto;
     }

     /* ===== PROMO BANNERS ===== */
     .amc-promos {
         padding: 0 0 80px;
         background: var(--amc-white);
     }

     .amc-promocard {
         position: relative;
         border-radius: 16px;
         overflow: hidden;
         min-height: 280px;
         display: flex;
         align-items: center;
         padding: 40px;
     }

     .amc-promocard img {
         position: absolute;
         inset: 0;
         width: 100%;
         height: 100%;
         object-fit: cover;
         z-index: 1;
     }

     .amc-promocard::after {
         content: '';
         position: absolute;
         inset: 0;
         background: linear-gradient(90deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0.2) 100%);
         z-index: 2;
     }

     .amc-promocontent {
         position: relative;
         z-index: 3;
         max-width: 320px;
     }

     .amc-promotitle {
         font-size: 1.6rem;
         font-weight: 800;
         color: var(--amc-white);
         line-height: 1.2;
         margin-bottom: 15px;
         text-transform: uppercase;
     }

     .amc-promodesc {
         color: rgba(255, 255, 255, 0.7);
         font-size: 0.85rem;
         line-height: 1.7;
         margin-bottom: 20px;
     }

     .amc-promobtn {
         display: inline-flex;
         align-items: center;
         gap: 8px;
         background: var(--amc-primary);
         color: var(--amc-white);
         padding: 12px 28px;
         border-radius: 6px;
         font-weight: 700;
         font-size: 0.8rem;
         text-decoration: none;
         text-transform: uppercase;
         letter-spacing: 0.5px;
         transition: all 0.3s;
         border: none;
     }

     .amc-promobtn:hover {
         background: var(--amc-primary-dark);
         color: var(--amc-white);
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(220, 38, 38, 0.3);
     }

     /* ===== BRANDS ===== */
     .amc-brands {
         padding: 60px 0;
         background: var(--amc-white);
         text-align: center;
     }

     .amc-brandstitle {
         font-size: 0.85rem;
         font-weight: 700;
         color: var(--amc-gray);
         text-transform: uppercase;
         letter-spacing: 3px;
         margin-bottom: 30px;
     }

     .amc-brandgrid {
         display: flex;
         justify-content: center;
         align-items: center;
         gap: 50px;
         flex-wrap: wrap;
     }

     .amc-branditem {
         opacity: 0.5;
         transition: all 0.3s;
         filter: grayscale(100%);
     }

     .amc-branditem:hover {
         opacity: 1;
         filter: grayscale(0%);
         transform: scale(1.1);
     }

     .amc-branditem img {
         height: 40px;
         width: auto;
         object-fit: contain;
     }

     /* ===== RESPONSIVE ===== */
     @media (max-width: 991px) {
         .amc-hero-wrap {
             padding: 80px 0 200px;
         }

         .amc-hero-car {
             margin-top: 40px;
         }

         .amc-hero-car img {
             max-width: 80%;
             transform: scale(1);
         }

         @keyframes amcCarFloat {

             0%,
             100% {
                 transform: scale(1) translateY(0);
             }

             50% {
                 transform: scale(1) translateY(-10px);
             }
         }

         .amc-searchbox {
             padding: 20px;
         }

         .amc-sectiontitle::before,
         .amc-sectiontitle::after {
             display: none;
         }
     }

     @media (max-width: 767px) {
         .amc-hero-title {
             font-size: 2.2rem;
         }

         .amc-promocard {
             min-height: 240px;
             padding: 30px;
         }

         .amc-promotitle {
             font-size: 1.3rem;
         }
     }

     /* ===== ANIMATIONS ===== */
     .amc-fadeup {
         opacity: 0;
         transform: translateY(30px);
         transition: all 0.6s ease;
     }

     .amc-fadeup.visible {
         opacity: 1;
         transform: translateY(0);
     }


     /* End Css of Transport  */



     /* =====================================================
   HOTEL / TRAVEL PAGE CSS
===================================================== */

     /* ===== MAIN PAGE ===== */

     .hotel {
         font-family: var(--nest-font-body);
         background: var(--nest-dark);
         color: var(--nest-text);
         overflow-x: hidden;
     }


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

     .nest-hero {
         position: relative;
         min-height: 100vh;
         display: flex;
         align-items: flex-end;
         background: var(--nest-darker);
         overflow: hidden;
     }

     .nest-hero-bg {
         position: absolute;
         inset: 0;
         z-index: 1;
     }

     .nest-hero-bg img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         opacity: 0.7;
     }

     .nest-hero-bg::after {
         content: '';
         position: absolute;
         inset: 0;
         background: linear-gradient(180deg,
                 rgba(5, 5, 5, 0.3) 0%,
                 rgba(5, 5, 5, 0.1) 30%,
                 rgba(5, 5, 5, 0.6) 70%,
                 rgba(5, 5, 5, 0.95) 100%);
     }

     .nest-hero-wrap {
         position: relative;
         z-index: 2;
         width: 100%;
         padding: 120px 0 100px;
     }

     .nest-hero-label {
         color: var(--nest-gold);
         font-size: 0.75rem;
         font-weight: 600;
         letter-spacing: 4px;
         text-transform: uppercase;
         margin-bottom: 20px;
         display: flex;
         align-items: center;
         gap: 15px;
     }

     .nest-hero-label::before {
         content: '';
         width: 40px;
         height: 1px;
         background: var(--nest-gold);
     }

     .nest-hero-title {
         font-family: var(--nest-font-display);
         font-size: clamp(2.5rem, 5vw, 4.5rem);
         font-weight: 500;
         color: #000;
         line-height: 1.1;
         margin-bottom: 20px;
         letter-spacing: 1px;
     }

     .nest-hero-title span {
         color: var(--nest-gold);
     }

     .nest-hero-desc {
         color: #fff;
         font-size: 0.95rem;
         max-width: 420px;
         margin-bottom: 35px;
         line-height: 1.8;
     }


     /* =====================================================
   SEARCH BAR
===================================================== */

     .nest-searchbar {
         position: relative;
         z-index: 10;
         margin-top: -35px;
     }

     .nest-searchbox {
         background: #fff;
         border: 1px solid #e8e8e8;
         border-radius: 14px;
         padding: 18px 22px;
         box-shadow: 0 12px 35px rgba(0, 0, 0, 0.12);
     }


     /* SEARCH GROUP */

     .nest-searchgroup {
         position: relative;
         padding: 0 15px;
     }

     .nest-searchgroup i {
         position: absolute;
         left: 15px;
         top: 30px;
         color: var(--nest-gold);
         font-size: 0.9rem;
     }


     /* SEARCH LABEL */

     .nest-searchlabel {
         color: #777;
         font-size: 0.58rem;
         font-weight: 700;
         text-transform: uppercase;
         letter-spacing: 1.2px;
         margin-bottom: 4px;
         display: block;
         padding-left: 25px;
     }


     /* SEARCH FIELD */

     .nest-searchfield {
         width: 100%;
         height: 38px;
         padding: 5px 5px 5px 25px;
         border: none;
         border-bottom: 1px solid #ddd;
         background: transparent;
         color: #333;
         font-size: 0.78rem;
         outline: none;
         transition: all 0.3s ease;
         appearance: none;
         cursor: pointer;
     }

     .nest-searchfield:focus {
         border-bottom-color: var(--nest-gold);
     }

     .nest-searchfield option {
         background: #fff;
         color: #333;
     }


     /* SEARCH DIVIDER */

     .nest-searchdivider {
         width: 1px;
         height: 45px;
         background: #e5e5e5;
         margin: 0 auto;
     }


     /* SEARCH BUTTON */

     .nest-searchbtn {
         width: 100%;
         height: 45px;
         background: var(--nest-gold);
         color: var(--nest-darker);
         border: none;
         border-radius: 9px;
         font-weight: 700;
         font-size: 0.68rem;
         text-transform: uppercase;
         letter-spacing: 1.5px;
         transition: all 0.3s ease;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         gap: 7px;
         cursor: pointer;
     }

     .nest-searchbtn:hover {
         background: var(--nest-gold-light);
         transform: translateY(-2px);
         box-shadow: 0 6px 18px rgba(201, 169, 110, 0.25);
     }


     /* =====================================================
   PROPERTIES / TRAVEL PACKAGES
===================================================== */

     .nest-properties {
         padding: 75px 0 55px;
         background: #fff;
     }


     /* SECTION HEADER */

     .nest-sectionhead {
         text-align: center;
         margin-bottom: 35px;
     }

     .nest-sectionlabel {
         color: var(--nest-gold);
         font-size: 0.65rem;
         font-weight: 600;
         letter-spacing: 3px;
         text-transform: uppercase;
         margin-bottom: 8px;
         display: block;
     }

     .nest-sectiontitle {
         font-family: var(--nest-font-display);
         font-size: clamp(1.6rem, 3vw, 2.2rem);
         font-weight: 500;
         color: var(--nest-text);
         letter-spacing: 1px;
         margin-bottom: 0;
     }


     /* =====================================================
   PROPERTY / PACKAGE CARD
===================================================== */

     .nest-propertycard {
         background: var(--nest-card);
         border-radius: 12px;
         overflow: hidden;
         border: 1px solid var(--nest-border);
         transition: all 0.3s ease;
         height: 100%;
         cursor: pointer;
     }

     .nest-propertycard:hover {
         transform: translateY(-6px);
         border-color: rgba(201, 169, 110, 0.4);
         box-shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
     }


     /* =====================================================
   CARD IMAGE
===================================================== */

     .nest-propertyimgwrap {
         position: relative;
         height: 180px;
         overflow: hidden;
     }

     .nest-propertyimgwrap img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         display: block;
         transition: transform 0.5s ease;
     }

     .nest-propertycard:hover .nest-propertyimgwrap img {
         transform: scale(1.05);
     }


     /* =====================================================
   CARD BADGE
===================================================== */

     .nest-propertybadge {
         position: absolute;
         top: 12px;
         right: 12px;
         background: var(--nest-gold);
         color: var(--nest-darker);
         padding: 5px 10px;
         border-radius: 5px;
         font-size: 0.58rem;
         font-weight: 700;
         letter-spacing: 1px;
         text-transform: uppercase;
     }


     /* =====================================================
   CARD CONTENT
===================================================== */

     .nest-propertyinfo {
         padding: 16px;
     }


     /* LOCATION */

     .nest-propertyloc {
         color: var(--nest-gold);
         font-size: 0.68rem;
         font-weight: 500;
         margin-bottom: 5px;
         display: flex;
         align-items: center;
         gap: 5px;
     }

     .nest-propertyloc i {
         font-size: 0.75rem;
     }


     /* PACKAGE NAME */

     .nest-propertyname {
         font-family: var(--nest-font-display);
         font-size: 1rem;
         font-weight: 600;
         color: var(--nest-text);
         margin-bottom: 7px;
         letter-spacing: 0.3px;
         line-height: 1.3;
     }


     /* DESCRIPTION */

     .nest-propertydesc {
         color: var(--nest-muted);
         font-size: 0.72rem;
         line-height: 1.55;
         margin-bottom: 12px;

         display: -webkit-box;
         -webkit-line-clamp: 2;
         -webkit-box-orient: vertical;
         overflow: hidden;
     }


     /* =====================================================
   CARD PRICE
===================================================== */

     .nest-propertyprice {
         font-size: 1.05rem;
         font-weight: 700;
         color: var(--nest-gold);
         margin-bottom: 12px;
         letter-spacing: 0.3px;
     }

     .nest-propertyprice small {
         display: block;
         color: var(--nest-muted);
         font-size: 0.58rem;
         font-weight: 400;
         margin-bottom: 2px;
     }

     .nest-propertyprice strong {
         display: block;
         font-size: 1.05rem;
         font-weight: 700;
         color: var(--nest-gold);
     }


     /* =====================================================
   CARD META
===================================================== */

     .nest-propertymeta {
         display: flex;
         gap: 12px;
         padding-top: 11px;
         border-top: 1px solid var(--nest-border);
         flex-wrap: wrap;
     }

     .nest-metaitem {
         display: flex;
         align-items: center;
         gap: 4px;
         color: var(--nest-muted);
         font-size: 0.68rem;
         white-space: nowrap;
     }

     .nest-metaitem i {
         color: var(--nest-gold);
         font-size: 0.75rem;
     }


     /* =====================================================
   PACKAGE BUTTON
===================================================== */

     .nest-propertybtn {
         width: 100%;
         display: flex;
         align-items: center;
         justify-content: center;
         gap: 7px;

         margin-top: 14px;
         padding: 9px 12px;

         border-radius: 7px;
         background: var(--nest-darker);
         color: #fff;

         text-decoration: none;
         font-size: 0.67rem;
         font-weight: 600;
         letter-spacing: 0.5px;

         transition: all 0.3s ease;
     }

     .nest-propertybtn:hover {
         background: var(--nest-gold);
         color: var(--nest-darker);
     }

     .nest-propertybtn i {
         transition: transform 0.3s ease;
     }

     .nest-propertybtn:hover i {
         transform: translateX(4px);
     }


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

     .nest-whyus {
         padding: 70px 0 85px;
         background: #fff;
     }

     .nest-whygrid {
         margin-top: 40px;
     }

     .nest-whybox {
         text-align: center;
         padding: 25px 15px;
         transition: all 0.3s ease;
     }

     .nest-whybox:hover {
         transform: translateY(-5px);
     }


     /* WHY ICON */

     .nest-whyicon {
         width: 65px;
         height: 65px;
         border: 1px solid var(--nest-border);
         border-radius: 50%;

         display: inline-flex;
         align-items: center;
         justify-content: center;

         font-size: 1.45rem;
         color: var(--nest-gold);

         margin-bottom: 20px;

         transition: all 0.4s ease;
         position: relative;
     }

     .nest-whyicon::before {
         content: '';
         position: absolute;
         inset: -1px;
         border-radius: 50%;
         border: 1px solid transparent;
         transition: all 0.4s ease;
     }

     .nest-whybox:hover .nest-whyicon {
         background: rgba(201, 169, 110, 0.1);
         border-color: var(--nest-gold);
         transform: scale(1.05);
     }


     /* WHY TITLE */

     .nest-whytitle {
         font-family: var(--nest-font-display);
         font-size: 1rem;
         font-weight: 500;
         color: var(--nest-text);
         margin-bottom: 9px;
         letter-spacing: 0.5px;
     }


     /* WHY DESCRIPTION */

     .nest-whydesc {
         font-size: 0.75rem;
         color: var(--nest-muted);
         line-height: 1.7;
         max-width: 260px;
         margin: 0 auto;
     }


     /* =====================================================
   ANIMATIONS
===================================================== */

     .nest-fadeup {
         opacity: 0;
         transform: translateY(30px);
         transition: all 0.7s ease;
     }

     .nest-fadeup.visible {
         opacity: 1;
         transform: translateY(0);
     }


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

     @media (max-width: 1199px) {

         .nest-propertymeta {
             gap: 8px;
         }

         .nest-metaitem {
             font-size: 0.64rem;
         }

         .nest-propertyinfo {
             padding: 14px;
         }
     }


     /* =====================================================
   TABLET
===================================================== */

     @media (max-width: 991px) {

         .nest-hero-wrap {
             padding: 100px 0 80px;
         }

         .nest-searchbox {
             padding: 16px;
         }

         .nest-searchgroup {
             padding: 8px 0;
         }

         .nest-searchdivider {
             display: none;
         }

         .nest-searchbtn {
             margin-top: 10px;
             height: 45px;
         }

         .nest-propertyimgwrap {
             height: 190px;
         }

         .nest-propertymeta {
             gap: 10px;
         }
     }


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

     @media (max-width: 767px) {

         .nest-hero {
             min-height: 85vh;
         }

         .nest-hero-wrap {
             padding: 100px 0 70px;
         }

         .nest-hero-title {
             font-size: 2.2rem;
         }

         .nest-hero-desc {
             font-size: 0.85rem;
             max-width: 100%;
             line-height: 1.7;
         }

         .nest-searchbar {
             margin-top: -20px;
         }

         .nest-searchbox {
             padding: 15px;
             border-radius: 12px;
         }

         .nest-propertyimgwrap {
             height: 190px;
         }

         .nest-propertyinfo {
             padding: 15px;
         }

         .nest-properties {
             padding: 60px 0 45px;
         }

         .nest-sectionhead {
             margin-bottom: 30px;
         }

         .nest-sectiontitle {
             font-size: 1.7rem;
         }

         .nest-whyus {
             padding: 60px 0 70px;
         }

         .nest-whygrid {
             margin-top: 25px;
         }
     }


     /* =====================================================
   SMALL MOBILE
===================================================== */

     @media (max-width: 480px) {

         .nest-hero-title {
             font-size: 2rem;
         }

         .nest-hero-label {
             font-size: 0.65rem;
             letter-spacing: 2.5px;
         }

         .nest-hero-label::before {
             width: 25px;
         }

         .nest-propertyimgwrap {
             height: 180px;
         }

         .nest-propertyname {
             font-size: 0.95rem;
         }

         .nest-propertydesc {
             font-size: 0.7rem;
         }

         .nest-propertyprice {
             font-size: 1rem;
         }

         .nest-propertymeta {
             gap: 8px;
         }

         .nest-metaitem {
             font-size: 0.62rem;
         }

         .nest-propertybtn {
             padding: 8px 10px;
             font-size: 0.63rem;
         }
     }


     /* =====================================================
   END HOTEL / TRAVEL PAGE CSS
===================================================== */





     /* Css of Footer  */


     /* === FOOTER IDs === */
     #jsp-footer-main {
         background-color: #000000;
         color: #ffffff;
         font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
     }

     #jsp-footer-top {
         background: #013274;
         border-top: 4px solid #E97E51;
         padding-top: 3.5rem;
         padding-bottom: 3rem;
     }

     #jsp-footer-bottom {
         background-color: #0a0a0a;
         border-top: 1px solid #222;
         padding-top: 1.2rem;
         padding-bottom: 1.2rem;
     }

     #jsp-footer-brand-text {
         font-size: 1.5rem;
         font-weight: 800;
         letter-spacing: 1px;
     }

     #jsp-footer-slogan {
         font-style: italic;
         color: #adb5bd;
         font-size: 0.95rem;
     }

     #jsp-footer-location {
         color: #dc3545;
         font-weight: 600;
     }

     /* === FOOTER Classes === */
     .jsp-footer-heading {
         color: #ffffff;
         font-size: 1.1rem;
         font-weight: 700;
         text-transform: uppercase;
         letter-spacing: 1.5px;
         margin-bottom: 1.5rem;
         position: relative;
         padding-bottom: 0.75rem;
     }

     .jsp-footer-heading::after {
         content: '';
         position: absolute;
         bottom: 0;
         left: 0;
         width: 50px;
         height: 3px;
         background-color: orange;
         border-radius: 2px;
     }

     .jsp-footer-link {
         color: #b0b0b0;
         text-decoration: none;
         display: flex;
         align-items: center;
         gap: 0.6rem;
         padding: 0.4rem 0;
         transition: all 0.3s ease;
         font-size: 0.92rem;
     }

     .jsp-footer-link:hover {
         color: orange;
         padding-left: 0.5rem;
     }

     .jsp-footer-link i {
         color: orange;
         font-size: 0.85rem;
     }

     .jsp-contact-row {
         display: flex;
         align-items: flex-start;
         gap: 0.8rem;
         margin-bottom: 1rem;
         color: #b0b0b0;
         font-size: 0.92rem;
     }

     .jsp-contact-icon {
         background-color: rgba(220, 53, 69, 0.15);
         color: orange;
         width: 38px;
         height: 38px;
         border-radius: 50%;
         display: flex;
         align-items: center;
         justify-content: center;
         font-size: 1rem;
         flex-shrink: 0;
         margin-top: 2px;
     }

     .jsp-contact-label {
         color: #888;
         font-size: 0.75rem;
         text-transform: uppercase;
         letter-spacing: 0.5px;
         display: block;
         margin-bottom: 0.1rem;
     }

     .jsp-contact-value {
         color: #ffffff;
         font-weight: 500;
         text-decoration: none;
         transition: color 0.2s;
     }

     .jsp-contact-value:hover {
         color: #dc3545;
     }

     .jsp-social-btn {
         width: 42px;
         height: 42px;
         border-radius: 50%;
         background-color: #1a1a1a;
         border: 1px solid #333;
         color: #ffffff;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         font-size: 1.1rem;
         margin-right: 0.5rem;
         transition: all 0.3s ease;
         text-decoration: none;
     }

     .jsp-social-btn:hover {
         background-color: orange;
         border-color: orange;
         color: #ffffff;
         transform: translateY(-3px);
     }

     .jsp-service-tag {
         display: inline-block;
         background-color: #1a1a1a;
         border: 1px solid #333;
         color: #b0b0b0;
         padding: 0.35rem 0.9rem;
         border-radius: 2rem;
         font-size: 0.8rem;
         margin: 0.25rem 0.25rem 0.25rem 0;
         transition: all 0.3s ease;
         text-decoration: none;
     }

     .jsp-service-tag:hover {
         background-color: orange;
         border-color: orange;
         color: #ffffff;
     }

     .jsp-24-badge-footer {
         display: inline-flex;
         align-items: center;
         gap: 0.4rem;
         background: linear-gradient(135deg, #dc3545, #b02a37);
         color: #fff;
         font-size: 0.75rem;
         font-weight: 700;
         padding: 0.4rem 1rem;
         border-radius: 2rem;
         margin-top: 1rem;
     }

     .jsp-24-badge-footer i {
         font-size: 1rem;
     }

     .jsp-copyright-text {
         color: #666;
         font-size: 0.85rem;
     }

     .jsp-copyright-link {
         color: #dc3545;
         text-decoration: none;
         font-weight: 600;
     }

     .jsp-copyright-link:hover {
         color: #ffffff;
     }

     .jsp-footer-divider {
         border-color: #222;
         margin: 2rem 0;
     }

     /* WhatsApp Float Button */
     .jsp-whatsapp-float {
         position: fixed;
         bottom: 25px;
         right: 25px;
         width: 55px;
         height: 55px;
         background-color: #25d366;
         color: #fff;
         border-radius: 50%;
         display: flex;
         align-items: center;
         justify-content: center;
         font-size: 1.8rem;
         box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4);
         z-index: 1000;
         transition: all 0.3s ease;
         text-decoration: none;
     }

     .jsp-whatsapp-float:hover {
         transform: scale(1.1);
         color: #fff;
     }


     /* End Css of Footer  */



     /* Css of Booking  */

     .fh {
         font-family: 'Inter', sans-serif;
         background-color: #f8f9fa;
         overflow-x: hidden;
     }


     /* Hero Section */
     .fh-hero-section {
         position: relative;
         min-height: 100vh;
         background: linear-gradient(135deg, #0b0b0b 0%, #d4e9f0 50%, #c5dfe8 100%);
         overflow: hidden;
     }

     .fh-hero-bg {
         position: absolute;
         right: 0;
         top: 0;
         width: 65%;
         height: 100%;
         background-image: url('https://www.dptreks.com/wp-content/uploads/2019/09/Swayambhunath_2018.jpg');
         background-size: cover;
         background-position: center;
         clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%);
     }

     .fh-hero-content {
         position: relative;
         z-index: 2;
         padding-top: 140px;
         padding-left: 3rem;
     }

     .fh-hero-title {
         font-size: 3.2rem;
         font-weight: 600;
         color: #1a1a2e;
         line-height: 1.2;
         margin-bottom: 1.5rem;
         max-width: 500px;
     }

     .fh-hero-title span {
         display: block;
     }

     .fh-explore-link {
         color: #1a1a2e;
         text-decoration: none;
         font-weight: 500;
         font-size: 0.95rem;
         display: inline-flex;
         align-items: center;
         gap: 0.5rem;
         transition: gap 0.3s;
     }

     .fh-explore-link:hover {
         gap: 0.8rem;
         color: #1a1a2e;
     }

     /* Booking Widget */
     .fh-booking-widget {
         position: relative;
         z-index: 10;
         margin-top: 3rem;
         max-width: 1100px;
     }

     .fh-booking-tabs {
         display: flex;
         gap: 0;
     }

     .fh-booking-tab {
         padding: 1rem 2.5rem;
         background: #1a1a2e;
         color: rgba(255, 255, 255, 0.7);
         border: none;
         font-size: 0.9rem;
         font-weight: 500;
         cursor: pointer;
         display: flex;
         align-items: center;
         gap: 0.6rem;
         transition: all 0.3s;
     }

     .fh-booking-tab:first-child {
         border-radius: 12px 0 0 0;
     }

     .fh-booking-tab.active {
         background: #fff;
         color: #1a1a2e;
     }

     .fh-booking-tab:not(.active):hover {
         color: #fff;
         background: #2d2d44;
     }

     .fh-booking-card {
         background: #fff;
         border-radius: 0 12px 12px 12px;
         padding: 2rem;
         box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
     }

     /* Dropdown Selectors */
     .fh-selector-row {
         display: flex;
         gap: 1rem;
         margin-bottom: 1.5rem;
         flex-wrap: wrap;
     }

     .fh-selector-btn {
         background: transparent;
         border: 1px solid #e0e0e0;
         border-radius: 8px;
         padding: 0.6rem 1rem;
         font-size: 0.85rem;
         font-weight: 500;
         color: #333;
         cursor: pointer;
         display: flex;
         align-items: center;
         gap: 0.4rem;
         transition: all 0.2s;
     }

     .fh-selector-btn:hover {
         border-color: #1a1a2e;
     }

     .fh-selector-btn i {
         font-size: 0.7rem;
     }

     /* Form Fields */
     .fh-booking-form {
         display: grid;
         grid-template-columns: 1fr 1fr 1fr 1fr;
         gap: 1rem;
         align-items: end;
     }

     .fh-form-group {
         position: relative;
     }

     .fh-form-group label {
         display: block;
         font-size: 0.7rem;
         font-weight: 600;
         color: #999;
         text-transform: uppercase;
         letter-spacing: 0.5px;
         margin-bottom: 0.4rem;
     }

     .fh-location-input {
         border: 1px solid #e8e8e8;
         border-radius: 10px;
         padding: 1rem;
         background: #fafafa;
         cursor: pointer;
         transition: all 0.2s;
     }

     .fh-location-input:hover {
         border-color: #1a1a2e;
         background: #f5f5f5;
     }

     .fh-location-input .fh-city {
         font-size: 1.1rem;
         font-weight: 600;
         color: #1a1a2e;
         margin-bottom: 0.2rem;
     }

     .fh-location-input .fh-detail {
         font-size: 0.75rem;
         color: #999;
     }

     .fh-swap-btn {
         position: absolute;
         left: 50%;
         top: 50%;
         transform: translate(-50%, -20%);
         background: #fff;
         border: 1px solid #e0e0e0;
         border-radius: 50%;
         width: 36px;
         height: 36px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;
         z-index: 5;
         transition: all 0.3s;
     }

     .fh-swap-btn:hover {
         background: #1a1a2e;
         color: #fff;
         border-color: #1a1a2e;
         transform: translate(-50%, -20%) rotate(180deg);
     }

     .fh-date-input {
         border: 1px solid #e8e8e8;
         border-radius: 10px;
         padding: 1rem;
         background: #fafafa;
         text-align: center;
     }

     .fh-date-input .fh-day {
         font-size: 1.1rem;
         font-weight: 600;
         color: #1a1a2e;
     }

     .fh-date-nav {
         display: flex;
         justify-content: space-between;
         margin-top: 0.5rem;
     }

     .fh-date-nav button {
         background: none;
         border: none;
         font-size: 0.7rem;
         color: #999;
         cursor: pointer;
         font-weight: 500;
         transition: color 0.2s;
     }

     .fh-date-nav button:hover {
         color: #1a1a2e;
     }

     .fh-date-input i.bi-calendar {
         color: #1a1a2e;
         font-size: 1rem;
     }

     .fh-search-btn {
         background: #1a1a2e;
         color: #fff;
         border: none;
         border-radius: 10px;
         padding: 1.2rem 2rem;
         font-weight: 500;
         font-size: 0.95rem;
         display: flex;
         align-items: center;
         gap: 0.8rem;
         cursor: pointer;
         transition: all 0.3s;
         white-space: nowrap;
     }

     .fh-search-btn:hover {
         background: #2d2d44;
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(26, 26, 46, 0.3);
     }

     /* Popular Destinations */
     .fh-popular-section {
         padding: 4rem 0;
         background: #f8f9fa;
     }

     .fh-section-header {
         display: flex;
         justify-content: space-between;
         align-items: center;
         margin-bottom: 2rem;
     }

     .fh-section-title {
         font-size: 1.3rem;
         font-weight: 600;
         color: #1a1a2e;
     }

     .fh-explore-all {
         color: #1a1a2e;
         text-decoration: underline;
         font-size: 0.9rem;
         font-weight: 500;
     }

     .fh-destination-card {
         border-radius: 16px;
         overflow: hidden;
         position: relative;
         height: 280px;
         cursor: pointer;
         transition: transform 0.3s;
     }

     .fh-destination-card:hover {
         transform: translateY(-5px);
     }

     .fh-destination-card img {
         width: 100%;
         height: 100%;
         object-fit: cover;
     }

     .fh-destination-overlay {
         position: absolute;
         bottom: 0;
         left: 0;
         right: 0;
         padding: 1.5rem;
         background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
         color: #fff;
     }

     .fh-destination-name {
         font-size: 1.1rem;
         font-weight: 600;
     }

     .fh-destination-price {
         font-size: 0.85rem;
         opacity: 0.9;
     }

     /* Modal Styles */
     .modal-content {
         border-radius: 16px;
         border: none;
     }

     .modal-header {
         border-bottom: 1px solid #f0f0f0;
     }

     .fh-location-option {
         padding: 1rem;
         border-radius: 10px;
         cursor: pointer;
         transition: background 0.2s;
         border-bottom: 1px solid #f5f5f5;
     }

     .fh-location-option:hover {
         background: #f8f9fa;
     }

     .fh-location-option .city-name {
         font-weight: 600;
         color: #1a1a2e;
     }

     .fh-location-option .city-code {
         font-size: 0.8rem;
         color: #999;
     }

     /* Results Section */
     .fh-results-section {
         display: none;
         padding: 3rem 0;
         background: #fff;
     }

     .fh-flight-card {
         border: 1px solid #e8e8e8;
         border-radius: 12px;
         padding: 1.5rem;
         margin-bottom: 1rem;
         display: flex;
         justify-content: space-between;
         align-items: center;
         transition: all 0.2s;
     }

     .fh-flight-card:hover {
         border-color: #1a1a2e;
         box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
     }

     .fh-airline-logo {
         width: 40px;
         height: 40px;
         background: #1a1a2e;
         border-radius: 50%;
         display: flex;
         align-items: center;
         justify-content: center;
         color: #fff;
         font-weight: 700;
         font-size: 0.8rem;
     }

     .fh-flight-time {
         font-size: 1.2rem;
         font-weight: 700;
         color: #1a1a2e;
     }

     .fh-flight-route {
         font-size: 0.8rem;
         color: #999;
     }

     .fh-flight-price {
         font-size: 1.3rem;
         font-weight: 700;
         color: #1a1a2e;
     }

     .fh-book-now-btn {
         background: #1a1a2e;
         color: #fff;
         border: none;
         border-radius: 8px;
         padding: 0.6rem 1.5rem;
         font-size: 0.85rem;
         font-weight: 500;
         cursor: pointer;
     }

     /* Hotel & Car Forms */
     .fh-hotel-form,
     .fh-car-form {
         display: none;
     }

     .fh-hotel-form.active,
     .fh-car-form.active {
         display: block;
     }

     .fh-flight-form {
         display: none;
     }

     .fh-flight-form.active {
         display: block;
     }

     /* Passenger Dropdown */
     .fh-passenger-dropdown {
         position: absolute;
         top: 100%;
         left: 0;
         background: #fff;
         border: 1px solid #e0e0e0;
         border-radius: 10px;
         padding: 1rem;
         min-width: 250px;
         box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
         z-index: 100;
         display: none;
     }

     .fh-passenger-dropdown.show {
         display: block;
     }

     .fh-passenger-type {
         display: flex;
         justify-content: space-between;
         align-items: center;
         margin-bottom: 0.8rem;
     }

     .fh-passenger-type:last-child {
         margin-bottom: 0;
     }

     .fh-passenger-counter {
         display: flex;
         align-items: center;
         gap: 0.8rem;
     }

     .fh-passenger-counter button {
         width: 28px;
         height: 28px;
         border-radius: 50%;
         border: 1px solid #e0e0e0;
         background: #fff;
         cursor: pointer;
         display: flex;
         align-items: center;
         justify-content: center;
         font-size: 1rem;
         transition: all 0.2s;
     }

     .fh-passenger-counter button:hover {
         background: #1a1a2e;
         color: #fff;
         border-color: #1a1a2e;
     }

     /* Toast Notification */
     .fh-toast-container {
         position: fixed;
         bottom: 2rem;
         right: 2rem;
         z-index: 9999;
     }

     .fh-custom-toast {
         background: #1a1a2e;
         color: #fff;
         padding: 1rem 1.5rem;
         border-radius: 10px;
         box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
         display: flex;
         align-items: center;
         gap: 0.8rem;
         animation: slideIn 0.3s ease;
     }

     @keyframes slideIn {
         from {
             transform: translateX(100%);
             opacity: 0;
         }

         to {
             transform: translateX(0);
             opacity: 1;
         }
     }

     @media (max-width: 991px) {
         .fh-hero-bg {
             width: 100%;
             clip-path: none;
             opacity: 0.3;
         }

         .fh-hero-content {
             padding-left: 1rem;
             padding-right: 1rem;
         }

         .fh-hero-title {
             font-size: 2.2rem;
         }

         .fh-booking-form {
             grid-template-columns: 1fr 1fr;
         }

         .fh-search-btn {
             grid-column: span 2;
             justify-content: center;
         }
     }

     @media (max-width: 576px) {
         .fh-booking-form {
             grid-template-columns: 1fr;
         }

         .fh-search-btn {
             grid-column: span 1;
         }

         .fh-booking-tab {
             padding: 0.8rem 1.2rem;
             font-size: 0.8rem;
         }
     }



     /* End Css of Booking  */




     /* =====================================================
   JSP RECOMMENDED TOUR PACKAGES
===================================================== */

     .jsp-tour-section {
         width: 100%;
         padding: 85px 5% 90px;
         background: #ffffff;
     }


     /* =====================================================
   SECTION HEADING
===================================================== */

     .jsp-tour-heading {
         margin-bottom: 60px;
     }

     .jsp-tour-heading h2 {
         margin: 0;

         font-family: Georgia, "Times New Roman", serif;

         font-size: 30px;

         font-weight: 700;

         color: #111;

         letter-spacing: 0.5px;
     }


     /* =====================================================
   HEADING DECORATION
===================================================== */

     .jsp-heading-decoration {
         display: flex;

         align-items: center;

         justify-content: center;

         gap: 35px;

         margin-top: 25px;
     }

     .jsp-heading-decoration span {
         width: 320px;

         height: 1px;

         background: #dddddd;
     }

     .jsp-heading-decoration i {
         width: 45px;

         height: 10px;

         position: relative;

         display: block;
     }

     .jsp-heading-decoration i::before,
     .jsp-heading-decoration i::after {
         content: "";

         position: absolute;

         width: 9px;

         height: 9px;

         border-bottom: 3px solid #eeeeee;

         border-right: 3px solid #eeeeee;

         transform: rotate(45deg);
     }

     .jsp-heading-decoration i::before {
         left: 4px;
     }

     .jsp-heading-decoration i::after {
         left: 20px;
     }


     /* =====================================================
   TOUR CARD
===================================================== */

     .jsp-tour-card {
         position: relative;

         width: 100%;

         height: 385px;

         overflow: hidden;

         border-radius: 5px;

         background: #222;

         cursor: pointer;

         isolation: isolate;
     }


     /* =====================================================
   IMAGE
===================================================== */

     .jsp-tour-image {
         position: absolute;

         inset: 0;

         width: 100%;

         height: 100%;

         object-fit: cover;

         object-position: center;

         transition:
             transform 0.7s cubic-bezier(.2, .7, .2, 1),
             filter 0.7s ease;
     }


     /* =====================================================
   DARK OVERLAY
===================================================== */

     .jsp-tour-overlay {
         position: absolute;

         inset: 0;

         z-index: 1;

         background:
             linear-gradient(180deg,
                 rgba(0, 0, 0, 0.05) 0%,
                 rgba(0, 0, 0, 0.18) 40%,
                 rgba(0, 0, 0, 0.72) 100%);

         transition:
             background 0.6s ease;
     }


     /* =====================================================
   CONTENT
===================================================== */

     .jsp-tour-content {
         position: absolute;

         left: 38px;

         right: 30px;

         bottom: 55px;

         z-index: 2;

         color: #ffffff;

         transition:
             transform 0.6s cubic-bezier(.2, .7, .2, 1);
     }


     /* =====================================================
   DURATION
===================================================== */

     .jsp-tour-duration {
         font-family: Arial, Helvetica, sans-serif;

         font-size: 20px;

         font-weight: 400;

         line-height: 1.2;

         margin-bottom: 5px;

         color: #ffffff;

         transition:
             transform 0.5s ease,
             opacity 0.5s ease;
     }


     /* =====================================================
   TITLE
===================================================== */

     .jsp-tour-content h3 {
         margin: 0;

         font-family: Georgia, "Times New Roman", serif;

         font-size: 31px;

         line-height: 1.12;

         font-weight: 700;

         color: #ffffff;

         text-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);

         transition:
             transform 0.5s ease;
     }


     /* =====================================================
   LEARN MORE BUTTON
===================================================== */

     .jsp-tour-btn {
         display: inline-flex;

         align-items: center;

         gap: 10px;

         margin-top: 20px;

         padding: 12px 22px;

         background: #ffb21c;

         color: #111111;

         text-decoration: none;

         border-radius: 5px;

         font-family: Arial, Helvetica, sans-serif;

         font-size: 15px;

         font-weight: 500;

         opacity: 0;

         transform: translateY(25px);

         pointer-events: none;

         transition:
             opacity 0.45s ease,
             transform 0.55s cubic-bezier(.2, .7, .2, 1),
             background 0.3s ease;
     }

     .jsp-tour-btn i {
         transition: transform 0.3s ease;
     }


     /* =====================================================
   HOVER EFFECT
===================================================== */

     .jsp-tour-card:hover .jsp-tour-image {
         transform: scale(1.08);

         filter: brightness(0.72);
     }


     .jsp-tour-card:hover .jsp-tour-overlay {
         background:
             linear-gradient(180deg,
                 rgba(0, 0, 0, 0.18) 0%,
                 rgba(0, 0, 0, 0.45) 45%,
                 rgba(0, 0, 0, 0.88) 100%);
     }


     /* Move content upward */

     .jsp-tour-card:hover .jsp-tour-content {
         transform: translateY(-12px);
     }


     /* Button appears */

     .jsp-tour-card:hover .jsp-tour-btn {
         opacity: 1;

         transform: translateY(0);

         pointer-events: auto;
     }


     /* Button hover */

     .jsp-tour-btn:hover {
         background: #ffffff;

         color: #111111;
     }

     .jsp-tour-btn:hover i {
         transform: translateX(5px);
     }


     /* =====================================================
   CARD ANIMATION ON LOAD
===================================================== */

     .jsp-tour-card {
         animation: jspTourCardIn 0.8s ease both;
     }

     .jsp-tour-row .col-lg-4:nth-child(1) .jsp-tour-card {
         animation-delay: 0.1s;
     }

     .jsp-tour-row .col-lg-4:nth-child(2) .jsp-tour-card {
         animation-delay: 0.2s;
     }

     .jsp-tour-row .col-lg-4:nth-child(3) .jsp-tour-card {
         animation-delay: 0.3s;
     }


     @keyframes jspTourCardIn {

         from {
             opacity: 0;

             transform: translateY(35px);
         }

         to {
             opacity: 1;

             transform: translateY(0);
         }

     }


     /* =====================================================
   TABLET
===================================================== */

     @media (max-width: 991px) {

         .jsp-tour-section {
             padding: 70px 4% 70px;
         }

         .jsp-tour-heading {
             margin-bottom: 45px;
         }

         .jsp-heading-decoration span {
             width: 180px;
         }

         .jsp-tour-card {
             height: 350px;
         }

         .jsp-tour-content {
             left: 28px;

             right: 25px;

             bottom: 40px;
         }

         .jsp-tour-duration {
             font-size: 17px;
         }

         .jsp-tour-content h3 {
             font-size: 26px;
         }
     }


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

     @media (max-width: 767px) {

         .jsp-tour-section {
             padding: 60px 20px;
         }

         .jsp-tour-heading {
             margin-bottom: 35px;
         }

         .jsp-tour-heading h2 {
             font-size: 23px;
         }

         .jsp-heading-decoration {
             gap: 15px;
         }

         .jsp-heading-decoration span {
             width: 80px;
         }

         .jsp-tour-card {
             height: 340px;
         }

         .jsp-tour-content {
             left: 25px;

             right: 20px;

             bottom: 30px;
         }

         .jsp-tour-duration {
             font-size: 16px;
         }

         .jsp-tour-content h3 {
             font-size: 24px;
         }

         /*
       On mobile there is no traditional hover,
       so keep the button visible.
    */

         .jsp-tour-btn {
             opacity: 1;

             transform: translateY(0);

             pointer-events: auto;
         }

     }


     /* =====================================================
   SMALL MOBILE
===================================================== */

     @media (max-width: 480px) {

         .jsp-tour-section {
             padding-left: 15px;

             padding-right: 15px;
         }

         .jsp-tour-card {
             height: 300px;
         }

         .jsp-tour-heading h2 {
             font-size: 20px;
         }

         .jsp-tour-heading {
             margin-bottom: 30px;
         }

         .jsp-heading-decoration span {
             width: 55px;
         }

         .jsp-tour-content {
             left: 20px;

             bottom: 25px;
         }

         .jsp-tour-duration {
             font-size: 14px;
         }

         .jsp-tour-content h3 {
             font-size: 21px;
         }

         .jsp-tour-btn {
             padding: 10px 18px;

             font-size: 13px;
         }

     }






     /* tour Details  */




     .trip-page {
         padding: 36px 0 80px;
     }

     .trip-container {
         width: min(100% - 32px, 1480px);
         margin-inline: auto;
     }

     .trip-day {
         display: grid;
         grid-template-columns: 125px minmax(0, 1fr);
         gap: 40px;
         padding: 0 0 72px;
         margin-bottom: 48px;
         border-bottom: 1px solid var(--trip-muted);
     }

     .trip-day-badge {
         align-self: start;
         display: inline-flex;
         justify-content: center;
         align-items: center;
         min-height: 50px;
         padding: 10px 18px;
         border: 1px solid #cfcfcf;
         border-radius: 8px;
         background: #fff;
         font-size: 1.08rem;
         font-weight: 700;
         white-space: nowrap;
     }

     .trip-day-title,
     .trip-section-title {
         margin: 0;
         font-family: "Cormorant Garamond", serif;
         font-weight: 500;
         color: #111;
     }

     .trip-day-title {
         margin-bottom: 12px;
         font-size: clamp(2.2rem, 4vw, 3.6rem);
         line-height: 1.08;
     }

     .trip-day-description {
         max-width: 1060px;
         margin: 0;
         font-size: clamp(1rem, 1.45vw, 1.35rem);
         line-height: 1.75;
         letter-spacing: 0.01em;
     }

     .trip-day-description strong {
         font-weight: 700;
     }

     .trip-includes {
         padding-top: 12px;
     }

     .trip-section-title {
         margin-bottom: 48px;
         font-size: clamp(3rem, 5vw, 4.7rem);
         line-height: 1;
     }

     .trip-list {
         max-width: 1200px;
         margin: 0;
         padding: 0;
         list-style: none;
     }

     .trip-list-item {
         display: flex;
         align-items: center;
         gap: 20px;
         min-height: 94px;
         padding: 24px 0;
         border-bottom: 1px solid var(--trip-muted);
         font-size: clamp(1rem, 1.35vw, 1.28rem);
         line-height: 1.55;
     }

     .trip-list-icon {
         flex: 0 0 30px;
         width: 30px;
         height: 30px;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         border: 2px solid var(--trip-blue);
         border-radius: 50%;
         color: var(--trip-blue);
         font-size: 0.9rem;
     }

     .trip-excludes {
         margin-top: 80px;
     }

     .trip-list-icon.is-excluded {
         border-color: #ef5350;
         color: #ef5350;
     }

     .trip-back-top {
         position: fixed;
         right: 30px;
         bottom: 28px;
         z-index: 10;
         width: 50px;
         height: 50px;
         display: inline-flex;
         align-items: center;
         justify-content: center;
         border: 0;
         border-radius: 50%;
         color: #fff;
         background: var(--trip-blue);
         box-shadow: 0 10px 28px rgba(7, 155, 215, 0.3);
         opacity: 0;
         visibility: hidden;
         transform: translateY(12px);
         transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease, background 0.3s ease;
     }

     .trip-back-top.show {
         opacity: 1;
         visibility: visible;
         transform: translateY(0);
     }

     .trip-back-top:hover {
         color: #fff;
         background: #087eac;
     }

     @media (max-width: 991.98px) {
         .trip-day {
             grid-template-columns: 105px minmax(0, 1fr);
             gap: 25px;
             padding-bottom: 52px;
         }

         .trip-day-badge {
             min-height: 46px;
             font-size: 0.95rem;
         }
     }

     @media (max-width: 767.98px) {
         .trip-page {
             padding-top: 24px;
         }

         .trip-day {
             grid-template-columns: 1fr;
             gap: 20px;
             margin-bottom: 38px;
             padding-bottom: 40px;
         }

         .trip-day-badge {
             justify-self: start;
             min-width: 100px;
         }

         .trip-day-title {
             font-size: 2.45rem;
         }

         .trip-day-description {
             font-size: 1rem;
             line-height: 1.7;
         }

         .trip-section-title {
             margin-bottom: 25px;
             font-size: 3.2rem;
         }

         .trip-list-item {
             min-height: 76px;
             gap: 15px;
             padding: 19px 0;
             font-size: 0.98rem;
         }

         .trip-list-icon {
             flex-basis: 26px;
             width: 26px;
             height: 26px;
             font-size: 0.76rem;
         }

         .trip-back-top {
             right: 18px;
             bottom: 18px;
             width: 46px;
             height: 46px;
         }
     }


     /* End Css of Tour Detaila  */



     /* Css Of Popular PLaces  */


     /* Section Header */
     .section-header {
         display: flex;
         align-items: center;
         justify-content: space-between;
         margin-bottom: 40px;
         flex-wrap: wrap;
         gap: 15px;
     }

     .section-title {
         font-weight: 700;
         font-size: clamp(1.5rem, 3vw, 2rem);
         color: var(--text-dark);
         display: flex;
         align-items: center;
         gap: 12px;
         margin: 0;
     }

     .section-title .plane-icon {
         color: var(--primary-light);
         font-size: 1.3rem;
         transform: rotate(-15deg);
         opacity: 0.7;
     }

     .btn-view-all {
         display: inline-flex;
         align-items: center;
         gap: 8px;
         background: transparent;
         border: 1.5px solid #e2e8f0;
         color: var(--primary);
         padding: 10px 24px;
         border-radius: 50px;
         font-weight: 600;
         font-size: 0.9rem;
         text-decoration: none;
         transition: all 0.3s ease;
     }

     .btn-view-all:hover {
         background: var(--primary);
         color: white;
         border-color: var(--primary);
         transform: translateX(3px);
     }

     .btn-view-all i {
         transition: transform 0.3s ease;
     }

     .btn-view-all:hover i {
         transform: translateX(4px);
     }

     /* Destination Card */
     .dest-card {
         position: relative;
         border-radius: 20px;
         overflow: hidden;
         height: 380px;
         cursor: pointer;
         transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
         box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
     }

     .dest-card:hover {
         transform: translateY(-10px);
         box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
     }

     .dest-card img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: transform 0.6s ease;
     }

     .dest-card:hover img {
         transform: scale(1.08);
     }

     /* Badge */
     .dest-badge {
         position: absolute;
         top: 18px;
         left: 18px;
         background: rgba(255, 255, 255, 0.95);
         backdrop-filter: blur(10px);
         color: var(--primary);
         padding: 6px 16px;
         border-radius: 50px;
         font-size: 0.75rem;
         font-weight: 700;
         letter-spacing: 0.5px;
         text-transform: capitalize;
         box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
         z-index: 3;
     }

     /* Gradient Overlay */
     .dest-overlay {
         position: absolute;
         bottom: 0;
         left: 0;
         right: 0;
         height: 55%;
         background: linear-gradient(to top,
                 rgba(15, 23, 42, 0.92) 0%,
                 rgba(15, 23, 42, 0.7) 40%,
                 rgba(15, 23, 42, 0.2) 80%,
                 transparent 100%);
         z-index: 2;
         display: flex;
         flex-direction: column;
         justify-content: flex-end;
         padding: 24px;
     }

     .dest-info {
         display: flex;
         align-items: flex-end;
         justify-content: space-between;
         gap: 10px;
     }

     .dest-name {
         color: white;
         font-weight: 700;
         font-size: 1.15rem;
         margin-bottom: 6px;
     }

     .dest-location {
         display: flex;
         align-items: center;
         gap: 6px;
         color: rgba(255, 255, 255, 0.75);
         font-size: 0.85rem;
     }

     .dest-location i {
         color: #f59e0b;
         font-size: 0.9rem;
     }

     .dest-price {
         text-align: right;
         flex-shrink: 0;
     }

     .dest-price .from-label {
         color: rgba(255, 255, 255, 0.6);
         font-size: 0.75rem;
         display: block;
         margin-bottom: 2px;
     }

     .dest-price .price {
         color: white;
         font-weight: 800;
         font-size: 1.3rem;
     }

     /* Responsive */
     @media (max-width: 991px) {
         .dest-card {
             height: 320px;
         }
     }

     @media (max-width: 767px) {
         .dest-card {
             height: 280px;
         }

         .section-header {
             flex-direction: column;
             align-items: flex-start;
         }
     }

     @media (max-width: 575px) {
         .dest-card {
             height: 340px;
         }

         .dest-name {
             font-size: 1.3rem;
         }

         .dest-price .price {
             font-size: 1.5rem;
         }
     }

     .popular {
         background: #f8fafc;
         padding: 60px 0;
     }









     /* Testimonials */

     .jsp-testimonials {
         --jsp-navy: #071d34;
         --jsp-blue: #0d6efd;
         --jsp-sky: #67d4ff;
         position: relative;
         overflow: hidden;
         padding: 110px 0;
         color: #fff;
         background:
             radial-gradient(circle at 12% 18%, rgba(13, 110, 253, .36), transparent 28%),
             radial-gradient(circle at 90% 80%, rgba(103, 212, 255, .18), transparent 28%),
             linear-gradient(135deg, #041222, var(--jsp-navy));
     }

     .jsp-testimonials::before,
     .jsp-testimonials::after {
         content: "";
         position: absolute;
         border: 1px solid rgba(255, 255, 255, .1);
         border-radius: 50%;
         pointer-events: none;
     }

     .jsp-testimonials::before {
         width: 420px;
         height: 420px;
         top: -240px;
         right: -110px;
     }

     .jsp-testimonials::after {
         width: 260px;
         height: 260px;
         bottom: -160px;
         left: 7%;
     }

     .jsp-eyebrow {
         display: inline-flex;
         align-items: center;
         gap: 9px;
         margin-bottom: 16px;
         color: var(--jsp-sky);
         font-size: .78rem;
         font-weight: 800;
         letter-spacing: .18em;
         text-transform: uppercase;
     }

     .jsp-eyebrow::before {
         content: "";
         width: 35px;
         height: 2px;
         background: var(--jsp-sky);
     }

     .jsp-heading {
         max-width: 680px;
         font-size: clamp(2.1rem, 5vw, 4.1rem);
         font-weight: 800;
         line-height: 1.05;
         letter-spacing: -.045em;
     }

     .jsp-heading span {
         color: var(--jsp-sky);
     }

     .jsp-intro {
         max-width: 530px;
         color: rgba(255, 255, 255, .62);
         line-height: 1.8;
     }

     .jsp-card {
         position: relative;
         height: 100%;
         padding: 30px;
         overflow: hidden;
         border: 1px solid rgba(255, 255, 255, .12);
         border-radius: 24px;
         background: rgba(255, 255, 255, .07);
         box-shadow: 0 22px 65px rgba(0, 0, 0, .22);
         backdrop-filter: blur(16px);
         transition: transform .4s ease, border-color .4s ease, background .4s ease;
     }

     .jsp-card:hover {
         transform: translateY(-10px);
         border-color: rgba(103, 212, 255, .48);
         background: rgba(255, 255, 255, .11);
     }

     .jsp-quote-icon {
         position: absolute;
         top: 15px;
         right: 25px;
         color: rgba(103, 212, 255, .13);
         font-size: 5rem;
         line-height: 1;
     }

     .jsp-stars {
         color: #ffcb45;
         letter-spacing: 3px;
     }

     .jsp-review {
         min-height: 120px;
         margin: 24px 0 26px;
         color: rgba(255, 255, 255, .82);
         font-size: 1rem;
         line-height: 1.8;
     }

     .jsp-avatar {
         width: 58px;
         height: 58px;
         object-fit: cover;
         border: 3px solid rgba(103, 212, 255, .7);
         border-radius: 50%;
     }

     .jsp-name {
         margin: 0 0 4px;
         font-size: 1rem;
         font-weight: 750;
     }

     .jsp-trip {
         margin: 0;
         color: var(--jsp-sky);
         font-size: .78rem;
     }

     .jsp-verified {
         margin-left: auto;
         color: #7ee2ad;
         font-size: 1.1rem;
     }

     .jsp-slider-item {
         display: none;
         animation: jspFadeUp .6s ease both;
     }

     .jsp-slider-item.jsp-active {
         display: block;
     }

     .jsp-control {
         width: 50px;
         height: 50px;
         display: inline-grid;
         place-items: center;
         border: 1px solid rgba(255, 255, 255, .2);
         border-radius: 50%;
         color: #fff;
         background: transparent;
         transition: .3s ease;
     }

     .jsp-control:hover {
         border-color: var(--jsp-sky);
         color: var(--jsp-navy);
         background: var(--jsp-sky);
     }

     .jsp-dots {
         display: flex;
         gap: 8px;
     }

     .jsp-dot {
         width: 9px;
         height: 9px;
         padding: 0;
         border: 0;
         border-radius: 50%;
         background: rgba(255, 255, 255, .28);
         transition: .3s;
     }

     .jsp-dot.jsp-active {
         width: 28px;
         border-radius: 10px;
         background: var(--jsp-sky);
     }

     @keyframes jspFadeUp {
         from {
             opacity: 0;
             transform: translateY(18px);
         }

         to {
             opacity: 1;
             transform: translateY(0);
         }
     }

     @media (max-width: 767.98px) {
         .jsp-testimonials {
             padding: 75px 0;
         }

         .jsp-card {
             padding: 25px;
         }

         .jsp-review {
             min-height: auto;
         }
     }





     /* END of Testimonials */










     /* CSS OF CAR DETAILS  */


     .crd-page {
         --crd-primary: #d8a13b;
         --crd-primary-dark: #bc8525;
         --crd-navy: #013274;
         --crd-text: #52606d;
         --crd-muted: #84909a;
         --crd-light: #f5f7fa;
         --crd-border: #e5e9ee;
         --crd-white: #ffffff;

         width: 100%;
         min-height: 100vh;
         background: var(--crd-light);
         color: var(--crd-navy);
         font-family: 'Inter', sans-serif;
     }


     /* =====================================================
   HEADER
===================================================== */

     .crd-detail-header {
         background: var(--crd-navy);
         padding: 55px 0 95px;
         color: var(--crd-white);
     }

     .crd-breadcrumb {
         padding-top: 60px;
     }

     .crd-breadcrumb {
         margin-bottom: 18px;
         font-size: 14px;
     }

     .crd-breadcrumb a {
         color: rgba(255, 255, 255, 0.7);
         text-decoration: none;
     }

     .crd-breadcrumb a:hover {
         color: var(--crd-primary);
     }

     .crd-breadcrumb span {
         color: var(--crd-primary);
     }

     .crd-header-title {
         margin: 0;
         color: var(--crd-white);
         font-size: clamp(32px, 5vw, 52px);
         font-weight: 800;
     }

     .crd-header-description {
         margin: 10px 0 0;
         color: rgba(255, 255, 255, 0.7);
     }


     /* =====================================================
   MAIN
===================================================== */

     .crd-detail-main {
         margin-top: -55px;
         padding-bottom: 80px;
     }

     .crd-card {
         border: 1px solid var(--crd-border);
         border-radius: 18px;
         background: var(--crd-white);
         box-shadow: 0 12px 40px rgba(1, 50, 116, 0.08);
     }


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

     .crd-gallery {
         padding: 14px;
         margin-bottom: 25px;
     }

     .crd-main-image {
         position: relative;
         height: 500px;
         overflow: hidden;
         border-radius: 14px;
         background: #e9edf1;
     }

     .crd-main-image img {
         width: 100%;
         height: 100%;
         display: block;
         object-fit: cover;
         transition:
             opacity 0.25s ease,
             transform 0.4s ease;
     }

     .crd-main-image:hover img {
         transform: scale(1.025);
     }

     .crd-available-badge {
         position: absolute;
         top: 20px;
         left: 20px;

         display: inline-flex;
         align-items: center;
         gap: 6px;

         padding: 9px 16px;

         border-radius: 50px;

         background: var(--crd-white);
         color: #178a46;

         font-size: 13px;
         font-weight: 700;

         box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
     }

     .crd-thumbnail-grid {
         display: grid;
         grid-template-columns: repeat(4, 1fr);
         gap: 10px;

         margin-top: 10px;
     }

     .crd-thumbnail {
         height: 100px;
         padding: 0;

         overflow: hidden;

         border: 2px solid transparent;
         border-radius: 10px;

         background: transparent;

         cursor: pointer;

         transition: all 0.25s ease;
     }

     .crd-thumbnail img {
         width: 100%;
         height: 100%;
         object-fit: cover;
     }

     .crd-thumbnail:hover,
     .crd-thumbnail-active {
         border-color: var(--crd-primary);
     }

     .crd-thumbnail-active {
         box-shadow: 0 5px 18px rgba(216, 161, 59, 0.22);
     }


     /* =====================================================
   BASIC VEHICLE INFORMATION
===================================================== */

     .crd-info-box {
         padding: 30px;
     }

     .crd-category {
         display: inline-block;

         margin-bottom: 12px;
         padding: 7px 13px;

         border-radius: 50px;

         background: rgba(216, 161, 59, 0.12);
         color: var(--crd-primary-dark);

         font-size: 12px;
         font-weight: 800;

         letter-spacing: 0.7px;
         text-transform: uppercase;
     }

     .crd-vehicle-name {
         margin-bottom: 8px;

         color: var(--crd-navy);

         font-size: 32px;
         font-weight: 800;
     }

     .crd-location {
         display: flex;
         align-items: center;
         gap: 5px;

         color: #77838f;
         font-size: 14px;
     }

     .crd-location i {
         color: var(--crd-primary);
     }

     .crd-rating {
         display: flex;
         align-items: center;
         gap: 7px;

         margin-top: 12px;

         font-size: 14px;
     }

     .crd-rating-stars {
         color: #ffb400;
     }

     .crd-rating span {
         color: #8a949e;
     }

     .crd-divider {
         margin: 25px 0;
         border-top: 1px solid var(--crd-border);
     }


     /* =====================================================
   SPECIFICATIONS
===================================================== */

     .crd-spec-grid {
         display: grid;
         grid-template-columns: repeat(4, 1fr);
         gap: 12px;
     }

     .crd-spec-item {
         padding: 18px 10px;

         border: 1px solid #edf0f3;
         border-radius: 12px;

         background: #f7f9fb;

         text-align: center;

         transition: all 0.3s ease;
     }

     .crd-spec-item:hover {
         transform: translateY(-4px);
         border-color: rgba(216, 161, 59, 0.35);

         box-shadow: 0 10px 25px rgba(1, 50, 116, 0.08);
     }

     .crd-spec-item i {
         display: block;

         margin-bottom: 8px;

         color: var(--crd-primary);

         font-size: 23px;
     }

     .crd-spec-item strong {
         display: block;

         color: var(--crd-navy);

         font-size: 14px;
     }

     .crd-spec-item span {
         color: #8a959f;
         font-size: 12px;
     }


     /* =====================================================
   CONTENT SECTIONS
===================================================== */

     .crd-content-section {
         margin-top: 25px;
         padding: 30px;
     }

     .crd-section-title {
         margin-bottom: 18px;

         color: var(--crd-navy);

         font-size: 23px;
         font-weight: 800;
     }

     .crd-description {
         margin: 0;

         color: var(--crd-text);

         line-height: 1.85;
     }


     /* =====================================================
   FEATURES
===================================================== */

     .crd-feature-grid {
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         gap: 13px;
     }

     .crd-feature-item {
         display: flex;
         align-items: center;
         gap: 9px;

         color: var(--crd-text);

         font-size: 14px;
     }

     .crd-feature-item i {
         flex: 0 0 27px;

         width: 27px;
         height: 27px;

         display: inline-flex;
         align-items: center;
         justify-content: center;

         border-radius: 50%;

         background: rgba(216, 161, 59, 0.12);
         color: var(--crd-primary);

         font-size: 13px;
     }


     /* =====================================================
   RENTAL CONDITIONS
===================================================== */

     .crd-condition-item {
         display: flex;
         gap: 14px;

         padding: 15px 0;

         border-bottom: 1px solid var(--crd-border);
     }

     .crd-condition-item:last-child {
         border-bottom: none;
     }

     .crd-condition-icon {
         flex: 0 0 42px;

         width: 42px;
         height: 42px;

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

         border-radius: 10px;

         background: rgba(216, 161, 59, 0.12);
         color: var(--crd-primary);

         font-size: 19px;
     }

     .crd-condition-content h6 {
         margin-bottom: 4px;

         color: var(--crd-navy);

         font-weight: 700;
     }

     .crd-condition-content p {
         margin: 0;

         color: #7a8793;

         font-size: 13px;
     }


     /* =====================================================
   BOOKING
===================================================== */

     .crd-booking-card {
         position: sticky;
         top: 110px;

         padding: 28px;
     }

     .crd-price-label {
         margin-bottom: 7px;

         color: #87929d;

         font-size: 13px;
     }

     .crd-price {
         color: var(--crd-primary);

         font-size: 36px;
         font-weight: 800;
         line-height: 1;
     }

     .crd-price small {
         color: #7c8995;

         font-size: 14px;
         font-weight: 500;
     }

     .crd-form-label {
         display: block;

         margin-bottom: 7px;

         color: var(--crd-navy);

         font-size: 13px;
         font-weight: 700;
     }

     .crd-form-control {
         min-height: 49px;

         border: 1px solid var(--crd-border);
         border-radius: 9px;

         font-size: 14px;
     }

     .crd-form-control:focus {
         border-color: var(--crd-primary);

         box-shadow:
             0 0 0 0.2rem rgba(216, 161, 59, 0.15);
     }


     /* =====================================================
   TOTAL
===================================================== */

     .crd-total-box {
         margin-top: 20px;
         padding: 17px;

         border-radius: 12px;

         background: #f6f8fa;
     }

     .crd-total-row {
         display: flex;
         align-items: center;
         justify-content: space-between;
         gap: 15px;

         margin-bottom: 9px;

         color: #66727d;

         font-size: 14px;
     }

     .crd-grand-total {
         margin-bottom: 0;
         padding-top: 12px;

         border-top: 1px solid #dde2e7;

         color: var(--crd-navy);

         font-size: 17px;
         font-weight: 800;
     }


     /* =====================================================
   BOOK BUTTON
===================================================== */

     .crd-book-button {
         width: 100%;

         display: flex;
         align-items: center;
         justify-content: center;
         gap: 9px;

         margin-top: 20px;
         padding: 15px;

         border: none;
         border-radius: 10px;

         background: var(--crd-primary);
         color: var(--crd-white);

         font-weight: 800;

         cursor: pointer;

         transition: all 0.25s ease;
     }

     .crd-book-button:hover {
         background: var(--crd-primary-dark);
         color: var(--crd-white);

         transform: translateY(-2px);

         box-shadow:
             0 8px 20px rgba(216, 161, 59, 0.28);
     }

     .crd-book-button i {
         transition: transform 0.3s ease;
     }

     .crd-book-button:hover i {
         transform: translateX(5px);
     }

     .crd-safe-booking {
         margin: 15px 0 0;

         color: #8a949e;

         text-align: center;

         font-size: 12px;
     }

     .crd-safe-booking i {
         margin-right: 4px;

         color: #1c9c57;
     }


     /* =====================================================
   HELP CARD
===================================================== */

     .crd-help-card {
         margin-top: 20px;
         padding: 23px;

         background: var(--crd-navy);
         color: var(--crd-white);
     }

     .crd-help-inner {
         display: flex;
         align-items: center;
         gap: 17px;
     }

     .crd-help-icon {
         color: var(--crd-primary);

         font-size: 28px;
     }

     .crd-help-content h5 {
         margin-bottom: 4px;

         color: var(--crd-white);

         font-weight: 800;
     }

     .crd-help-content p {
         margin-bottom: 5px;

         color: rgba(255, 255, 255, 0.65);

         font-size: 13px;
     }

     .crd-help-content a {
         color: var(--crd-white);

         font-weight: 700;

         text-decoration: none;
     }

     .crd-help-content a:hover {
         color: var(--crd-primary);
     }


     /* =====================================================
   RELATED VEHICLES
===================================================== */

     .crd-related-section {
         padding: 70px 0;

         background: var(--crd-white);
     }

     .crd-related-title {
         margin-bottom: 8px;

         color: var(--crd-navy);

         font-size: 32px;
         font-weight: 800;
     }

     .crd-related-subtitle {
         margin-bottom: 30px;

         color: var(--crd-muted);
     }

     .crd-related-card {
         height: 100%;

         overflow: hidden;

         border: 1px solid var(--crd-border);
         border-radius: 15px;

         background: var(--crd-white);

         transition: all 0.3s ease;
     }

     .crd-related-card:hover {
         transform: translateY(-6px);

         box-shadow:
             0 15px 35px rgba(1, 50, 116, 0.1);
     }

     .crd-related-image {
         height: 210px;

         overflow: hidden;
     }

     .crd-related-image img {
         width: 100%;
         height: 100%;

         display: block;

         object-fit: cover;

         transition: transform 0.4s ease;
     }

     .crd-related-card:hover .crd-related-image img {
         transform: scale(1.05);
     }

     .crd-related-body {
         padding: 20px;
     }

     .crd-related-name {
         margin: 0;

         color: var(--crd-navy);

         font-weight: 800;
     }

     .crd-related-specs {
         display: flex;
         flex-wrap: wrap;
         gap: 15px;

         margin: 15px 0;

         color: #7c8791;

         font-size: 12px;
     }

     .crd-related-specs i {
         margin-right: 3px;

         color: var(--crd-primary);
     }

     .crd-related-footer {
         display: flex;
         align-items: center;
         justify-content: space-between;
         gap: 10px;
     }

     .crd-related-price {
         color: var(--crd-primary);

         font-size: 21px;
         font-weight: 800;
     }

     .crd-related-price small {
         color: #8a949e;

         font-size: 12px;
         font-weight: 400;
     }

     .crd-related-button {
         padding: 8px 14px;

         border: 1px solid var(--crd-primary);
         border-radius: 7px;

         color: var(--crd-primary);

         font-size: 13px;
         font-weight: 700;

         text-decoration: none;

         transition: all 0.2s ease;
     }

     .crd-related-button:hover {
         background: var(--crd-primary);
         color: var(--crd-white);
     }


     /* =====================================================
   TABLET
===================================================== */

     @media (max-width: 991.98px) {

         .crd-main-image {
             height: 420px;
         }

         .crd-booking-card {
             position: static;
             margin-top: 25px;
         }

     }


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

     @media (max-width: 767.98px) {

         .crd-detail-header {
             padding: 40px 0 80px;
         }

         .crd-main-image {
             height: 320px;
         }

         .crd-thumbnail {
             height: 75px;
         }

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

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

     }


     /* =====================================================
   SMALL MOBILE
===================================================== */

     @media (max-width: 480px) {

         .crd-main-image {
             height: 250px;
         }

         .crd-thumbnail {
             height: 58px;
         }

         .crd-feature-grid {
             grid-template-columns: 1fr;
         }

         .crd-info-box,
         .crd-content-section,
         .crd-booking-card {
             padding: 20px;
         }

         .crd-related-footer {
             align-items: flex-start;
             flex-direction: column;
         }

     }



     /* END CSS OF CAR DETAILS  */










     /* END CSS OF HOTEL DETAILS  */

     .jsp-hotel-detail-page {
         background: #f5f7fa;
         color: #013274;
         font-family: 'Poppins', sans-serif;
     }

     .jsp-hotel-detail-header {
         padding: 120px 0 65px;
         background: #013274;
         color: #fff;
     }

     .jsp-hotel-detail-breadcrumb {
         display: flex;
         align-items: center;
         flex-wrap: wrap;
         gap: 10px;
         margin-bottom: 18px;
         font-size: 13px;
     }

     .jsp-hotel-detail-breadcrumb a {
         color: rgba(255, 255, 255, 0.7);
         text-decoration: none;
     }

     .jsp-hotel-detail-breadcrumb a:hover {
         color: #d8a13b;
     }

     .jsp-hotel-detail-breadcrumb i {
         font-size: 10px;
         color: rgba(255, 255, 255, 0.4);
     }

     .jsp-hotel-detail-breadcrumb span {
         color: #d8a13b;
     }

     .jsp-hotel-detail-title {
         font-family: 'Playfair Display', serif;
         font-size: 48px;
         font-weight: 700;
     }

     .jsp-hotel-detail-subtitle {
         color: rgba(255, 255, 255, 0.7);
     }

     .jsp-hotel-detail-main {
         padding: 60px 0 80px;
     }

     .jsp-hotel-detail-card {
         background: #fff;
         border: 1px solid #e5e9ee;
         border-radius: 18px;
         overflow: hidden;
         box-shadow: 0 10px 35px rgba(1, 50, 116, 0.06);
     }

     .jsp-hotel-detail-card+.jsp-hotel-detail-card {
         margin-top: 25px;
     }

     .jsp-hotel-detail-main-image {
         height: 480px;
     }

     .jsp-hotel-detail-main-image img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: opacity 0.25s ease;
     }

     .jsp-hotel-detail-thumbnails {
         display: grid;
         grid-template-columns: repeat(4, 1fr);
         gap: 10px;
         padding: 12px;
     }

     .jsp-hotel-detail-thumbnail {
         height: 90px;
         padding: 0;
         border: 2px solid transparent;
         border-radius: 10px;
         overflow: hidden;
         background: transparent;
     }

     .jsp-hotel-detail-thumbnail img {
         width: 100%;
         height: 100%;
         object-fit: cover;
     }

     .jsp-hotel-detail-thumbnail-active,
     .jsp-hotel-detail-thumbnail:hover {
         border-color: #d8a13b;
     }

     .jsp-hotel-detail-info {
         padding: 30px;
     }

     .jsp-hotel-detail-category {
         display: inline-block;
         padding: 6px 13px;
         margin-bottom: 12px;
         border-radius: 30px;
         background: rgba(216, 161, 59, 0.12);
         color: #bc8525;
         font-size: 12px;
         font-weight: 600;
     }

     .jsp-hotel-detail-name {
         font-family: 'Playfair Display', serif;
         color: #013274;
         font-size: 32px;
         font-weight: 700;
     }

     .jsp-hotel-detail-location {
         color: #52606d;
         font-size: 14px;
     }

     .jsp-hotel-detail-location i {
         margin-right: 5px;
         color: #d8a13b;
     }

     .jsp-hotel-detail-booking {
         position: sticky;
         top: 110px;
         padding: 30px;
     }

     .jsp-hotel-detail-price-label {
         color: #84909a;
         font-size: 12px;
     }

     .jsp-hotel-detail-price {
         margin-bottom: 25px;
         color: #bc8525;
         font-size: 30px;
         font-weight: 700;
     }

     .jsp-hotel-detail-price small {
         color: #84909a;
         font-size: 12px;
         font-weight: 400;
     }

     .jsp-hotel-detail-form-label {
         display: block;
         margin-bottom: 7px;
         color: #013274;
         font-size: 12px;
         font-weight: 600;
     }

     .jsp-hotel-detail-input {
         min-height: 48px;
         border: 1px solid #e5e9ee;
         border-radius: 9px;
         font-size: 13px;
         box-shadow: none !important;
     }

     .jsp-hotel-detail-input:focus {
         border-color: #d8a13b;
     }

     .jsp-hotel-detail-book-btn {
         width: 100%;
         margin-top: 25px;
         padding: 14px 20px;
         border: none;
         border-radius: 9px;
         background: #d8a13b;
         color: #fff;
         font-size: 13px;
         font-weight: 600;
         transition: 0.3s ease;
     }

     .jsp-hotel-detail-book-btn:hover {
         background: #bc8525;
         transform: translateY(-2px);
     }

     @media (max-width: 991.98px) {
         .jsp-hotel-detail-booking {
             position: static;
         }
     }

     @media (max-width: 767.98px) {
         .jsp-hotel-detail-header {
             padding: 100px 0 50px;
         }

         .jsp-hotel-detail-title {
             font-size: 36px;
         }

         .jsp-hotel-detail-main-image {
             height: 320px;
         }
     }

     @media (max-width: 575.98px) {
         .jsp-hotel-detail-main-image {
             height: 250px;
         }

         .jsp-hotel-detail-thumbnail {
             height: 60px;
         }
     }




     /* END CSS OF HOTEL DETAILS  */










     /* CSS OF TOURS DETAILS  */


     :root {
         --td-page-bg: #ffffff;
         --td-sidebar-bg: #f8f5ef;
         --td-text: #111111;
         --td-yellow: #ffb31a;
         --td-green: #20b94b;
     }

     .td-section {
         margin: 0;
         color: var(--td-text);
         background: var(--td-page-bg);
         font-family: Arial, Helvetica, sans-serif;
     }

     .td-hero {
         position: relative;
         min-height: 750px;
         display: flex;
         align-items: flex-end;
         overflow: hidden;
         color: #fff;
         background:
             linear-gradient(180deg, rgba(0, 0, 0, .18) 0%, rgba(0, 0, 0, .18) 42%, rgba(0, 0, 0, .82) 100%),
             url("https://langtang.com/wp-content/uploads/2025/07/Badimalika-Trek.jpeg") center/cover no-repeat;
     }

     .td-hero-content {
         position: relative;
         z-index: 2;
         width: 100%;
         padding: 0 5% 30px;
     }

     .td-hero-title {
         margin-bottom: 12px;
         font-family: Georgia, "Times New Roman", serif;
         font-size: clamp(2.4rem, 3.2vw, 3.8rem);
         line-height: 1.08;
         font-weight: 700;
     }

     .td-breadcrumb {
         display: flex;
         align-items: center;
         gap: 15px;
         margin: 0 0 18px;
         padding: 0;
         list-style: none;
         font-size: clamp(1rem, 1.25vw, 1.45rem);
     }

     .td-breadcrumb a {
         color: #fff;
         text-decoration: none;
     }

     .td-breadcrumb-divider,
     .td-breadcrumb-current {
         color: var(--td-yellow);
     }

     .td-travel-badge {
         display: inline-block;
         min-width: 235px;
         padding: 7px 12px 6px;
         color: #555;
         background: rgba(255, 255, 255, .94);
         border-radius: 6px;
         box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
     }

     .td-travel-badge strong {
         display: block;
         font-size: 1.65rem;
         line-height: 1;
         font-weight: 500;
         letter-spacing: -1px;
     }

     .td-travel-badge span {
         display: block;
         margin-top: 4px;
         font-size: .76rem;
         letter-spacing: .35px;
     }

     .td-hero-actions {
         position: absolute;
         right: 3.8%;
         bottom: 44px;
         z-index: 3;
         display: flex;
         flex-direction: column;
         align-items: center;
         gap: 42px;
     }

     .td-whatsapp-btn {
         display: grid;
         place-items: center;
         width: 84px;
         height: 84px;
         color: #fff;
         background: var(--td-green);
         border-radius: 50%;
         box-shadow: 0 8px 22px rgba(0, 0, 0, .25);
         font-size: 2.8rem;
         text-decoration: none;
         transition: transform .25s ease, box-shadow .25s ease;
     }

     .td-whatsapp-btn:hover {
         color: #fff;
         transform: translateY(-5px) scale(1.04);
         box-shadow: 0 12px 28px rgba(0, 0, 0, .32);
     }

     .td-estimate-btn {
         min-width: 295px;
         padding: 17px 28px;
         color: #090909;
         background: var(--td-yellow);
         border-radius: 999px;
         font-size: 1.35rem;
         font-weight: 700;
         text-align: center;
         text-decoration: none;
         box-shadow: 0 8px 20px rgba(0, 0, 0, .2);
         transition: transform .25s ease, background .25s ease;
     }

     .td-estimate-btn:hover {
         color: #090909;
         background: #ffc13d;
         transform: translateY(-4px);
     }

     .td-section {
         padding: 38px 0 65px;
     }

     .td-main-title {
         margin: 0 0 30px;
         font-size: clamp(1.25rem, 1.35vw, 1.55rem);
         font-weight: 500;
     }

     .td-description {
         max-width: 100%;
         margin-bottom: 43px;
         font-size: clamp(1rem, 1.28vw, 1.48rem);
         line-height: 1.5;
     }

     .td-gallery-item {
         position: relative;
         height: 280px;
         overflow: hidden;
         border-radius: 6px;
         background: #eee;
     }

     .td-gallery-item img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         transition: transform .55s ease, filter .55s ease;
     }

     .td-gallery-item::after {
         position: absolute;
         inset: 0;
         content: "";
         background: rgba(0, 0, 0, 0);
         transition: background .4s ease;
         pointer-events: none;
     }

     .td-gallery-item:hover img {
         transform: scale(1.07);
         filter: saturate(1.08);
     }

     .td-gallery-item:hover::after {
         background: rgba(0, 0, 0, .08);
     }

     .td-sidebar-column {
         position: sticky;
         top: 100px;
         align-self: flex-start;
     }

     .td-sidebar {
         min-height: 700px;
         padding: 45px 44px 38px;
         background: var(--td-sidebar-bg);
         box-shadow: 0 0 22px rgba(0, 0, 0, .08);
     }

     .td-sidebar-title {
         margin-bottom: 37px;
         font-size: clamp(1.55rem, 1.7vw, 2rem);
         font-weight: 700;
     }

     .td-info-list {
         display: grid;
         gap: 20px;
         margin: 0;
         padding: 0;
         list-style: none;
         font-size: clamp(1rem, 1.25vw, 1.42rem);
         line-height: 1.55;
     }

     .td-help-box {
         margin-top: 64px;
     }

     .td-help-title {
         max-width: 330px;
         margin-bottom: 12px;
         font-size: clamp(1.45rem, 1.65vw, 1.9rem);
         line-height: 1.12;
         font-weight: 700;
     }

     .td-help-text {
         margin-bottom: 34px;
         font-size: clamp(1rem, 1.18vw, 1.35rem);
         line-height: 1.55;
     }

     .td-phone {
         display: flex;
         align-items: center;
         gap: 24px;
         color: inherit;
         font-size: clamp(1rem, 1.15vw, 1.3rem);
         text-decoration: none;
     }

     .td-phone i {
         color: var(--td-yellow);
         font-size: 1.25rem;
     }

     .td-float-help {
         position: fixed;
         right: clamp(22px, 8.5vw, 165px);
         bottom: 23px;
         z-index: 1040;
         display: grid;
         place-items: center;
         width: 92px;
         height: 92px;
         color: #fff;
         background: var(--td-yellow);
         border: 14px solid #fff;
         border-radius: 50%;
         box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
         font-size: 2rem;
         font-weight: 700;
         text-decoration: none;
         transition: transform .25s ease;
     }

     .td-float-help:hover {
         color: #fff;
         transform: translateY(-5px);
     }

     @media (min-width: 1400px) {
         .td-container {
             max-width: 1720px;
         }
     }

     @media (max-width: 1399.98px) {
         .td-gallery-item {
             height: 240px;
         }

         .td-sidebar {
             padding: 35px 30px;
         }
     }

     @media (max-width: 991.98px) {
         .td-hero {
             min-height: 620px;
         }

         .td-hero-content {
             padding: 0 28px 28px;
         }

         .td-hero-actions {
             right: 24px;
             bottom: 28px;
             gap: 22px;
         }

         .td-whatsapp-btn {
             width: 70px;
             height: 70px;
             font-size: 2.25rem;
         }

         .td-estimate-btn {
             min-width: 245px;
             padding: 14px 22px;
             font-size: 1.1rem;
         }

         .td-section {
             padding-top: 28px;
         }

         .td-sidebar-column {
             position: static;
         }

         .td-sidebar {
             min-height: auto;
             margin-top: 18px;
         }

         .td-help-box {
             margin-top: 38px;
         }

         .td-float-help {
             right: 18px;
             width: 76px;
             height: 76px;
             border-width: 11px;
         }
     }

     @media (max-width: 575.98px) {
         .td-hero {
             min-height: 560px;
             background-position: 58% center;
         }

         .td-hero-content {
             padding: 0 20px 28px;
         }

         .td-hero-title {
             max-width: 310px;
         }

         .td-breadcrumb {
             flex-wrap: wrap;
             gap: 9px;
             padding-right: 10px;
         }

         .td-travel-badge {
             min-width: 205px;
         }

         .td-hero-actions {
             right: 18px;
             bottom: 30px;
             align-items: flex-end;
         }

         .td-whatsapp-btn {
             width: 62px;
             height: 62px;
             font-size: 2rem;
         }

         .td-estimate-btn {
             min-width: 0;
             padding: 12px 18px;
             font-size: .95rem;
         }

         .td-description {
             margin-bottom: 28px;
         }

         .td-gallery-item {
             height: 230px;
         }

         .td-sidebar {
             padding: 30px 24px;
         }

         .td-sidebar-title {
             margin-bottom: 25px;
         }

         .td-phone {
             gap: 14px;
         }
     }




     /* END CSS OF TOURS DETAILS  */










     /*  CSS OF WHY CHOOSE US OF INDEX PAGE  */

     /* =========================================
   WHY CHOOSE US - UNIQUE CSS
========================================= */

     #nepalwhySection {
         background: #ffffff;
         padding: 40px 0 70px;
         overflow: hidden;
     }


     /* Heading */

     #nepalwhySection .nepalwhy-heading {
         margin-bottom: 55px;
     }

     #nepalwhySection .nepalwhy-small-title {
         font-family: Georgia, "Times New Roman", serif;
         font-size: 22px;
         font-weight: 700;
         color: #050505;
         margin-bottom: 32px;
     }

     #nepalwhySection .nepalwhy-main-title {
         font-family: Georgia, "Times New Roman", serif;
         font-size: 32px;
         line-height: 1.2;
         font-weight: 700;
         color: #050505;
         margin: 0;
     }


     /* =========================================
   Decorative Divider
========================================= */

     #nepalwhySection .nepalwhy-divider {
         max-width: 800px;
         margin: 55px auto 0;
         display: flex;
         align-items: center;
         justify-content: center;
         gap: 35px;
     }

     #nepalwhySection .nepalwhy-line {
         display: block;
         flex: 1;
         height: 1px;
         background: #ffad21;
     }


     /* Zig Zag */

     #nepalwhySection .nepalwhy-zigzag {
         display: flex;
         align-items: center;
     }

     #nepalwhySection .nepalwhy-zigzag i {
         display: block;
         width: 16px;
         height: 16px;

         border-right: 3px solid #ffb21e;
         border-bottom: 3px solid #ffb21e;

         transform: rotate(45deg);
         margin-left: -3px;
     }


     /* =========================================
   Content
========================================= */

     #nepalwhySection .nepalwhy-content {
         max-width: 1200px;
         margin-left: auto;
         margin-right: auto;
     }

     #nepalwhySection .nepalwhy-text {
         font-family: Arial, Helvetica, sans-serif;
         color: #080808;
     }

     #nepalwhySection .nepalwhy-text p {
         font-size: 20px;
         line-height: 1.5;
         margin-bottom: 18px;
         text-align: justify;
     }

     #nepalwhySection .nepalwhy-text strong {
         font-weight: 700;
         color: #000000;
     }


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

     @media (max-width: 991.98px) {

         #nepalwhySection {
             padding: 55px 0;
         }

         #nepalwhySection .nepalwhy-small-title {
             font-size: 27px;
             margin-bottom: 20px;
         }

         #nepalwhySection .nepalwhy-main-title {
             font-size: 38px;
         }

         #nepalwhySection .nepalwhy-divider {
             margin-top: 35px;
             margin-bottom: 0;
             gap: 20px;
         }

         #nepalwhySection .nepalwhy-heading {
             margin-bottom: 40px;
         }

         #nepalwhySection .nepalwhy-text p {
             font-size: 19px;
         }
     }


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

     @media (max-width: 575.98px) {

         #nepalwhySection {
             padding: 40px 8px;
         }

         #nepalwhySection .nepalwhy-small-title {
             font-size: 22px;
             margin-bottom: 16px;
         }

         #nepalwhySection .nepalwhy-main-title {
             font-size: 29px;
             line-height: 1.3;
         }

         #nepalwhySection .nepalwhy-divider {
             margin-top: 28px;
             gap: 12px;
         }

         #nepalwhySection .nepalwhy-zigzag i {
             width: 11px;
             height: 11px;
             border-width: 2px;
         }

         #nepalwhySection .nepalwhy-heading {
             margin-bottom: 32px;
         }

         #nepalwhySection .nepalwhy-content {
             --bs-gutter-y: 0;
         }

         #nepalwhySection .nepalwhy-text p {
             font-size: 16px;
             line-height: 1.7;
             text-align: left;
         }
     }



     /* END CSS OF WHY CHOOSE US OF INDEX PAGE  */