/* Basic styles */

:root{
  --header-height:80px;
  --accent:#198cff;
}
*{
  box-sizing:border-box;
  margin: 0;
  padding: 0;
}
@font-face {
  font-family: 'Amithen';
  src: url('/assets/fonts/Amithen.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body {
        font-family: 'Playfair Display', serif;
    }

body{
  /* margin:0;
  font-family:Arial,Helvetica,sans-serif; */
  /* overflow: hidden; */
  /* color:#fff; */
}

/* Header  */

/* Site header overlay (places nav over hero image) */
.site-header{
  position:relative;
  height:var(--header-height);
  display:flex;
  align-items:center;
  z-index:40;
  justify-content: space-evenly;
  /* padding: 0 40px; */
}
.site-header-m{
  position:relative;
  /* padding: 0 40px;; */
  height:var(--header-height);
  display:flex;
  align-items:center;
  justify-content: space-around;
  
}
.header--overlay{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  background:transparent;
  color:#fff;
  padding:8px 0;
  transition:background .24s ease, color .24s ease;
}

.logo-img-header{
  top: 50px;
}

@media (max-width:1024px){
  .logo-img-header{
    display: none;
  }
}

/* Sticky header when user scrolls past hero search */
.site-header.sticky{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  background:#101010; /* dark background when sticky */
  color:#fff;
  min-height:72px; /* reduced height to match smaller search */
  z-index:99;
  box-shadow:0 6px 18px rgba(2,6,11,0.5);
  transition:transform .28s cubic-bezier(.2,.9,.2,1), background .2s ease;
}

/* Layout inside sticky header: logo left, search center, actions right */
.site-header.sticky .site-header-m{
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 18px;
}
.site-header .header-search{flex:1;display:none}
.site-header.sticky .header-search{display:flex;justify-content:center;align-items:center}
.site-header.sticky .brand img{height:38px}
.site-header.sticky .logo-img-header{
  display: none;
}
/* hide the large main-nav when sticky (we show compact search + actions) */
.site-header.sticky .main-nav{display:none !important; visibility:hidden; pointer-events:none}

/* keep actions (login, hamburger) visible at right */
.site-header.sticky .nav-actions{z-index:99}

/* show header-search textarea styling - compact version */
.header-ai-search{
  border-radius:28px;
  padding:4px 6px;
  border:3px solid #d95353; /* match hero search border color */
  background:#fff;
  width:min(920px, 90%);
  box-shadow:0 6px 20px rgba(0,0,0,0.12);
}
/* match the hero search height inside sticky header */
.site-header.sticky .ai-text{height:42px;padding:10px 12px;font-size:15px}
/* hide ai-icons in sticky header to keep the compact look */
.site-header.sticky .ai-icons{display:none !important}
.site-header.sticky .ai-search-body{
  height: 42px;
}
/* Hide the hero fixed content once sticky header is active to avoid duplicate controls. Do NOT hide offcanvas. */
.site-header.sticky ~ .hero .hero-fixed{visibility:hidden;opacity:0;pointer-events:none}

/* small responsive tweak: keep header-search full width on narrow screens */
@media (max-width:900px){
  .site-header.sticky .header-search{padding:0 10px}
  .header-ai-search{width:100%;max-width:640px}
}
.brand{
  text-decoration: none;
  color: white;
  gap: 10px;
}
.header--overlay .brand img{height:42px}
.header--overlay .main-nav a,
.header--overlay .nav-actions a,
.header--overlay .nav-actions button{
  color:#fff;
  text-decoration:none;
  font-weight:600;
}
.header--overlay .main-nav a:hover{color:var(--accent)}
.header--overlay .nav-actions a:hover{
  color: #fff;
  background: transparent;
}
/* When the header isn't overlay (e.g., other pages), fall back to dark text */
.site-header:not(.header--overlay) a{color:#071217}

@media (max-width:1024px){
  .header--overlay .brand img{height:56px}
}

/* Mega menu styles (desktop only) */
.nav-mega{position:static}

/* Position mega-panels relative to the whole nav so each panel
  starts from the same horizontal point (keeps them aligned/responsive) */
.main-nav{position:relative}
.nav-mega .nav-link{color:#fff !important;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.nav-mega .nav-link:hover{
  color:#0f62ff;
}
.nav-mega .mega-panel{
  position:absolute;
  /* position directly beneath the trigger (avoid using fixed header height) */
  /* top: calc(100% + 3px); */
  /* top: 2px; */
  left:0;
  /* responsive panel width with a sensible desktop minimum */
  min-width:580px;
  width:min(920px, calc(100% - 40px));
  max-width:920px;
  background:transparent;
  color:#071217;
  border-radius:14px;
  /* box-shadow:0 20px 48px rgba(2,6,11,0.18); */
  padding:10px 10px;
  z-index:30;
  display:none;
}
.nav-mega .mega-panel[aria-hidden="false"]{display:block}
.mega-inner{display:flex;gap:0px;align-items:flex-start; background-color: #fff; padding: 10px; border-radius: 14px;}
.mega-col{flex:0 0 33.333%;max-width:33.33%;padding:0}
.mega-col ul{list-style:none;margin:0;padding:0}
.mega-col li{padding:0}
.mega-col a{display:block;color:#0b2a33;text-decoration:none;font-weight:600;padding:3px 0px;font-size:14px;line-height:1.6}
.mega-col a:hover{color:#0f62ff !important}
.mega-col .badge{
  color:#fff;
  background-color: #d95353;
}
.badge-soft{display:inline-block;background:#fff0f0;border-radius:14px;padding:6px 10px;margin-left:10px;font-size:12px;color:#d35454;border:1px solid rgba(211,84,84,0.06);vertical-align:middle}
.badge-soft-pink{display:inline-block;background:#fff4f6;border-radius:14px;padding:6px 10px;margin-left:10px;font-size:12px;color:#ff6b6b;vertical-align:middle}
.badge-soft-beige{display:inline-block;background:#fff7f0;border-radius:14px;padding:6px 10px;margin-left:10px;font-size:12px;color:#c77f3f;vertical-align:middle}
.badge-soft-blue{display:inline-block;background:#f3f6ff;border-radius:14px;padding:6px 10px;margin-left:10px;font-size:12px;color:#5f6fd1;vertical-align:middle}

/* Responsive: on smaller screens show the mega-panel as a stacked full-width dropdown when opened */
@media (max-width:1024px){
  .nav-mega .mega-panel{
    /* make it flow in document, full width under header */
    position:static;
    top:auto;
    left:auto;
    min-width: auto;
    max-width: none;
    width:100%;
    background:#fff;
    box-shadow:none;
    border-radius:8px;
    padding:12px;
    display:none; /* keep hidden until opened */
  }
  /* show when toggled open (click on mobile) */
  .nav-mega .mega-panel[aria-hidden="false"]{display:block}

  /* make columns stack into two columns on small screens */
  .mega-inner{flex-direction:row;flex-wrap:wrap;gap:12px}
  .mega-col{flex:0 0 50%;padding:6px}

  /* ensure trigger still readable when opened */
  .nav-mega .nav-link[aria-expanded="true"]{color:#071217}
}

/* Ensure trigger shows dark color when its panel is open (desktop too) */
.nav-mega .nav-link[aria-expanded="true"]{color:#071217}

/* When header is overlayed (nav sits on hero), anchors inside the mega-panel
   should remain dark so they are readable on the white panel */
.header--overlay .main-nav .mega-panel a,
.header--overlay .main-nav .mega-panel .mega-col a{
  color: #0b2a33;
}


/* Mobile sidebar */
.mobile-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.45);
  opacity:0;
  pointer-events:none;
  transition:opacity .28s ease;
  z-index:12;
}
.mobile-backdrop.visible{
  opacity:1;
  pointer-events:auto;
}

.mobile-drawer{
  position:fixed;
  top:0;
  right:0;
  height:100vh;
  width:340px;
  max-width:92vw;
  background: #fff;
  color:#fff;
  transform:translateX(100%); 
  transition:transform .36s cubic-bezier(.2,.9,.2,1);
  z-index:100;
  display:flex;
  flex-direction:column;
  box-shadow: -10px 20px 60px rgba(2,6,11,0.6);
}
.mobile-drawer.open{
  transform:translateX(0); 
}
.mobile-drawer .drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.mobile-drawer .drawer-close{
  background:transparent;
  border:0;color:#000;
  font-size:22px;
  padding:6px 10px;
  cursor:pointer;
}

.mobile-drawer .drawer-nav{
  padding:18px 14px;
  overflow:auto;
}

.mobile-drawer .drawer-nav ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.mobile-drawer .drawer-nav a{
  color:#000;
  text-decoration:none;
  padding:14px 12px;
  border-radius:8px;
  display:block;
  font-size:17px;
  font-weight:600;
}

.mobile-drawer .drawer-nav a:hover{
  background:rgba(255,255,255,0.03);
}

.mobile-drawer .drawer-nav a + a{
  border-top:1px solid rgba(255,255,255,0.03);
  padding-top:12px;
}

.mobile-drawer .drawer-header, .mobile-drawer .drawer-nav{
  padding-top:calc(env(safe-area-inset-top, 0px) + 12px);
}

/* styled scrollbar inside drawer */
.mobile-drawer .drawer-nav::-webkit-scrollbar{
  width:8px;
}

.mobile-drawer .drawer-nav::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,0.08);
  border-radius:8px;
}

/* Show drawer only on small screens (hide on widths >= 1025px) */
@media (min-width:1025px){
  .mobile-drawer, .mobile-backdrop{
    display:none;
  }
}

/* At tablet and below, show hamburger and hide full nav */
@media (max-width:1024px){
  .main-nav{
    display:none;
  }
  .mobile-toggle{
    display:block;
  }
}

/* Extra nav  */
.extra-nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:12px;
  align-items:center;
}

.extra-nav a{
  color:#fff;
  text-decoration:none;
  padding:6px 8px;
  font-weight:600;
  font-size:15px;
}

.extra-nav a:hover{
  color:var(--accent);
}

/* Hide extra-nav at smaller widths  */
@media (max-width:1024px){
  .extra-nav{
    display:none!important;
  }
}

/* Drawer extra list styles */
.drawer-extra{
  padding:12px 18px;
  color:#000;
  background:transparent;
  border-top:1px solid rgba(0,0,0,0.04);
}

.drawer-greeting{
  font-weight:700;
  margin-bottom:10px;
  font-size:18px;
  color:#071217;
}

.drawer-extra-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.drawer-extra-list a{
  color:#071217;
  text-decoration:none;
  padding:8px 6px;
  display:block;
}

.drawer-extra-list a:hover{
  color:var(--accent);
}

.drawer-contact{
  color:#071217;
}

.drawer-phone{
  font-weight:700;
}

.drawer-socials a{
  margin-right:8px;
  color:#071217;
  text-decoration:none;
}

@media (min-width:1025px){
  .drawer-extra{
    display:none;
  }
}

/* Desktop offcanvas tweaks to match mobile drawer styling */
.desktop-offcanvas .offcanvas-header{
  border-bottom:1px solid rgba(7,18,23,0.04);
}

.desktop-offcanvas .offcanvas-title{
  font-weight:700;
}
.desktop-offcanvas .offcanvas-body{
  color:#071217;
}
.desktop-offcanvas ul{
  padding-left:0;
}
.desktop-offcanvas ul li{
  padding:8px 0;
  border-bottom:1px solid rgba(7,18,23,0.03);
}
.desktop-offcanvas a{
  color:#071217;
  text-decoration:none;
}
.desktop-offcanvas a:hover{
  color:var(--accent);
}


/* hero section  */


/* Hero (rebuilt simple slider) */
.hero{
  position:relative;
  min-height:50vh;
  overflow:hidden;
  display:block;
  width:100%;
}

.hero-swiper{
  position:relative;
  height:100%;
}

.hero-swiper .swiper-slide{
  display:flex;
  align-items:center;
  justify-content:center;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:1;
  height: 70vh;
  transition:opacity .6s ease;
  /* background-color:#222; */
}
.hero-search input{width:min(680px,88%);padding:14px 18px;border-radius:14px;border:1px solid rgba(9, 87, 155, 0.18);background:#ffffff;color:#071217;box-shadow:0 8px 30px rgba(30, 105, 197, 0.06);font-size:16px}
.hero-search button{display:none}

/* Typing box (below the search input): rounded, subtle shadow like attachment */
.typing-box{max-width:680px;margin:14px auto 0;background:#fff;border-radius:14px;padding:14px 18px;border:1px solid rgba(255,107,107,0.08);box-shadow:0 18px 40px rgba(244,177,170,0.06);color:#333;font-size:15px;min-height:52px;display:flex;align-items:center;gap:12px}
.typing-box::before{content:'';width:36px;height:36px;border-radius:50%;background:rgba(255,107,107,0.08);display:inline-block}
.typing-box .typing-cursor{display:inline-block;width:6px;height:20px;background:#ff6b6b;margin-left:6px;vertical-align:baseline;animation:blink 1s steps(2, start) infinite}
@keyframes blink{50%{opacity:0}}

.hero .hero-fixed {
  position: absolute;
  top: 54%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  z-index: 20;
  pointer-events: auto;
  padding: 0 0 24px 0;
}
.ai-icons button{
  color: #000;
}
/* Ensure title -> description -> search box ordering and spacing */
.hero-fixed .container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}
.hero-fixed h1{margin-bottom:0;font-weight: 500; font-family: 'Times New Roman', Times, serif;
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);}
.hero-fixed h1 span{
  font-family: "Great Vibes", "Dancing Script", cursive;
  color: #d95353;
  font: 25px;
}
.hero-fixed p{margin-top:0}
.hero-search-inline{margin-top:8px}

/* Hero corner logos (overlayed on top of hero slides) */
.hero .hero-logos{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:25;
}
.hero .hero-logos .hero-logo{
  position:absolute;
  max-width:100px;
  width:auto;
  height:auto;
  mix-blend-mode: multiply;
  object-fit:contain;
  pointer-events:none;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,0.22));
}
/* .hero .hero-logos .logo-left{ right:100px; top:100px; }
.hero .hero-logos .logo-right{ right:18px; top:100px; } */

@media (max-width:900px){
  .hero .hero-logos .hero-logo{ max-width:80px; }
  .hero .hero-logos .logo-left{ left:12px; top:12px; }
  .hero .hero-logos .logo-right{ right:12px; top:12px; }
}

@media (max-width:480px){
  .hero .hero-logos .hero-logo{ max-width:60px; opacity:0.95; }
  .hero .hero-logos .logo-left{ left:8px; top:8px; }
  .hero .hero-logos .logo-right{ right:8px; top:8px; }
}

/* When overlaying, nudge position slightly on small screens so content stays visible */
@media (max-width:700px){
  /* Small screens: nudge down less aggressively */
  .hero .hero-fixed{ top:46%; }
}

.fw-6{
  font-weight:600;
}

@media (min-width:1900px){
  .hero-swiper .swiper-slide{
  height: 40vh;
}
}

.hero-swiper .swiper-slide-active{
  opacity:1;
}

.hero-swiper .overlay{
  position:absolute;
  inset:0;background:linear-gradient(180deg, rgba(9,9,9,0.35), rgba(9,9,9,0.6));
  z-index:1;
}

/* Ensure videos fill slides and sit under the overlay/hero content. 
   Do not force 100% heights (percent heights can collapse when parent uses min-height).
   Keep slide height controlled by the explicit rule above (70vh). */
.hero-swiper{ position:relative; }
.hero-swiper .swiper-wrapper{ position:relative; }
.hero-swiper .swiper-slide{ position:relative; overflow:hidden; }
.hero-swiper .swiper-slide video{
  position:absolute;
  left:0; top:0; right:0; bottom:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  z-index:0;
  transition:opacity .24s ease, visibility .24s ease;
}
/* Do not hide non-active videos via CSS — JS will pause and hide them reliably after init. */

.hero-content{
  position:relative;
  z-index:2;
  text-align:center;
  max-width:980px;
  color:#fff;
}

.hero-content h1{
  font-size:64px;
  font-family: 'Arial', sans-serif;
  line-height:0.95;
  margin:0 0 18px;
  font-weight:800;
}

.hero-content p{
  font-size:16px;
  opacity:0.95;
  margin-bottom:20px;
}

/* AI-style inline hero search box */
.hero-search-inline { 
  display:flex; 
  justify-content:center; 
}

.ai-search-box{
  background:#f5f3f3;
  color:#111;
  min-width:481px;
  width:100%;
  border-radius:20px;
  /* padding:5px 1px; */
  display:block;
  /* box-shadow: 0 2px 6px rgb(47, 161, 231); */
  border:3px solid #d95353;
}

.ai-search-body{
  display:flex;
  flex-direction:column;
  gap:10px;
  height: 101px;
  align-items:center;
  /* padding-bottom:20px; */
  position: relative;
}

/* Responsive tweaks for Influencer section */
.influencer-section .influencer-row{ display:flex; gap:28px; align-items:stretch; flex-wrap:wrap; }
.influencer-section .influencer-left,
.influencer-section .influencer-right{ flex:0 0 48%; min-width:300px; }
.influencer-media{ position:relative; width:100%; height:100%; overflow:hidden; border-radius:16px; }
.influencer-media video{ width:100%; height:100%; object-fit:cover; display:block; }
.influencer-cta{ position:absolute; right:18px; bottom:18px; background:rgba(255,255,255,0.92); color:#d95353; padding:10px 14px; border-radius:10px; text-decoration:none; font-weight:600; z-index:3; }
.influencer-card{ display:flex; flex-direction:column; justify-content:space-between; }

/* Tablet and below: stack columns and relax fixed min-heights */
@media (max-width: 992px){
  .influencer-section .influencer-row{ flex-direction:column; gap:20px; }
  .influencer-section .influencer-left,
  .influencer-section .influencer-right{ flex:0 0 100% !important; min-width:0 !important; }
  .influencer-media{ height:auto; }
  .influencer-media video{ max-height:420px; }
  .influencer-card{ min-height:auto !important; padding:28px !important; }
  .influencer-avatars{ gap:10px; }
}

/* Small phones: tighten spacing and scale avatars */
@media (max-width: 600px){
  .influencer-media video{ max-height:320px; }
  .influencer-card{ padding:18px !important; }
  .influencer-cta{ right:12px; bottom:12px; padding:8px 12px; font-size:14px; }
  .influencer-avatars .avatar{ width:40px !important; height:40px !important; }
}

/* Mobile + Tablet sticky header: show only brand, login and hamburger; hide extra logos, nav and hero corner logos */
@media (max-width: 1024px){
  /* When header becomes sticky, reduce clutter */
  .site-header.sticky .main-nav,
  .site-header.sticky .logo-img-header,
  .site-header.sticky .header-search,
  .site-header.sticky .ai-icons{
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Ensure primary brand logo remains visible */
  .site-header.sticky .brand{ display:flex !important; align-items:center; }

  /* Force login button visible in sticky header on mobile */
  .site-header.sticky .btn.btn-outline-light{ display:inline-block !important; }
  .site-header.sticky .btn.btn-outline-light:hover{ color:#0b7fcf; background: transparent; }

  /* Keep the menu toggle visible */
  .site-header.sticky .mobile-toggle{ display:inline-flex !important; }

  /* Also hide hero corner logos (if present) when on small screens */
  .hero .hero-logos{ display:none !important; }
}

.ai-text{
  width:min(920px,90%);
  resize:none;
  /* min-height:56px; */
  /* max-height:160px; */
  padding:12px 14px;
  border-radius:8px;
  border:0;
  font-size:15px;
  color:#222;
  background:#f5f3f3;

}
.ai-text.autotyping{ 
  color: #9aa0a6 !important; 
}

.ai-text:focus{
  outline:none;
  border: none;
}

.ai-text::placeholder{
  color:rgba(0,0,0,0.35);
}

/* .ai-text:empty::before{
  content:'Plan a 5-day trip to Bali with water villas, scuba diving, and top Instagram spots.'; color:rgba(0,0,0,0.35);
} */

.ai-icons{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  align-items:center;
  position:absolute;
  right:20px;
  bottom:5px;
}

.ai-icons .icon{
  background:transparent;
  border:0;
  font-size:15px;
  cursor:pointer;
  padding:8px;
  border-radius:8px;
}

.ai-icons .submit{
  /* background:linear-gradient(180deg,#ff6b6b,#ff4b4b); */
  color:#0b7fcf;
}

/* The site has a generic rule hiding hero-search buttons; override it for the inline AI search */
.hero-search-inline .ai-icons .icon{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  font-size:20px;
  color:#333;
  border:0;
  padding:6px;
  border-radius:12px;
}

.hero-search-inline .ai-icons .mic{
  color:#ff6b6b;
}

.hero-search-inline .ai-icons .submit{
  color:#0b7fcf;
  padding:10px 14px;
  font-weight:700;
}

.hero-search-inline .ai-icons .icon:focus{
  outline:3px solid rgba(7,18,23,0.08);
  outline-offset:3px;
}

@media (max-width:700px){
  .ai-search-box{
    padding:12px 14px;
    min-width:350px;
  }
  .ai-text{
    font-size:15px;
  }
  .hero-search-inline .ai-icons .icon{
    width:40px;
    height:40px;
  }
}

.hero-search{
  display:flex;
  gap:8px;
  justify-content:center;
}



/* Styling for the animated typing input to match the attached rounded box */
#heroQuickSearch{
  height:76px;
  line-height:22px;
}

/* Small responsive tweak */
@media (max-width:480px){
  #heroQuickSearch{
    height:48px;
    font-size:15px;
  }
}

.hero-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.45);
  border:0;
  color:#fff;
  font-size:26px;
  width:46px;
  height:46px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:3;
  cursor:pointer;
}

.hero-arrow.prev{
  left:16px;
}
.hero-arrow.next{
  right:16px;
}

.hero-dots{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:18px;
  display:flex;
  gap:8px;
  z-index:3;
}

.hero-dots button{
  width:10px;
  height:10px;
  border-radius:50%;
  background:rgba(255,255,255,0.35);
  border:0;

/* Responsive adjustments for hero-strip on narrow screens */
@media (max-width:700px) {
  .hero-strip{
    display:none;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    /* border-radius: 14px; */
    font-size: 14px;
    margin-top: -12px; 
    width: calc(100% - 28px);
    margin-left: auto;
    margin-right: auto;
  }
  .hero-strip p{
    margin: 0;
    padding: 0 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
  }
}

@media (max-width:420px){
  .hero-strip{display: none; font-size:13px; padding:8px 12px; margin-top: -10px; }
}
}

.hero-dots button.active{
  background:var(--accent);
}

/* Content placeholders */

.content-block{
  min-height:300px;
  padding:60px 20px;
  background:#fff;
  color:#111;
}

/* Influencer / testimonial split section */
.influencer-section .influencer-media img{display:block;width:100%;height:100%;object-fit:cover}
.influencer-section .influencer-cta{
  position:absolute;left:28px;bottom:24px;background:linear-gradient(180deg,#d95353,#b43c3c);color:#fff;padding:12px 20px;border-radius:10px;text-decoration:none;font-weight:700;box-shadow:0 8px 30px rgba(217,83,83,0.18);
  width: fit-content;
}
.influencer-section .influencer-card{background:#fbf0e9;border-radius:16px;padding:28px;display:flex;flex-direction:column;justify-content:space-between}
.influencer-section .influencer-card h3{color:#d95353;margin:0}
.influencer-section .influencer-avatars{display:flex;gap:12px}
.influencer-section .influencer-avatars .avatar img{display:block;width:100%;height:100%;object-fit:cover}
.influencer-section .influencer-btn{background:#d95353;border:0}

@media (max-width:900px){
  .influencer-row{flex-direction:column}
  .influencer-left, .influencer-right{flex:1 1 100%}
  .influencer-section .influencer-cta{left:16px;right:auto}
}

/* Make media and testimonial card equal height */
.influencer-row{align-items:stretch}
.influencer-left, .influencer-right{display:flex;flex-direction:column}
.influencer-section .influencer-media{flex:1 1 auto;min-height:280px;display:flex;flex-direction:column;border-radius:16px;overflow:hidden}
.influencer-section .influencer-card{flex:1 1 auto}

@media (max-width:900px){
  .influencer-section .influencer-media{min-height:200px}
}

/* Support section styles */
.support-section{background:linear-gradient(180deg,#fbf5f2,#fff);}
.support-row{align-items:stretch}
.support-phone .phone-frame{width:100%;border-radius:28px;
  /* border:10px solid #000; */
  overflow:hidden;
  /* box-shadow:0 18px 40px rgba(0,0,0,0.06); */
  /* background:#fff; */
}
.support-phone .phone-frame img{width:100%;height:100%;object-fit:cover;display:block}
.support-right .support-cards{display:flex;flex-direction:column;gap:18px;margin-top:12px}
.support-card{display:flex;gap:14px;align-items:flex-start;background:#fff;border-radius:12px;padding:16px;box-shadow:0 8px 30px rgba(2,6,11,0.06);}
.support-card .card-icon{width:56px;height:56px;border-radius:10px;background:#fff3ec;display:flex;align-items:center;justify-content:center;font-size:22px;color:#e67e22;flex:0 0 56px}
.support-card .card-body .card-title{font-weight:700;color:#111;margin-bottom:6px}
.support-card .card-body .card-sub{color:#666;font-size:14px}

/* Inline SVG chat screen styling inside the phone photoframe */
.support-phone svg.phone-frame{
  width:280px;
  max-width:100%;
  height:auto;display:block;
}
.chat-screen{font-family: 'Inter', sans-serif; color:#333;}
.chat-screen .bot-bubble{background:#fff;border-radius:10px;padding:10px 12px;max-width:85%;box-shadow:0 6px 18px rgba(0,0,0,0.04);color:#333;font-size:14px}
.svg-bot-text-body{
  font-size: 17px;
}
.chat-screen .bot-bubble.small{font-size:12px;color:#555}
.chat-screen .user-bubble{background:#ff7a00;color:#fff;padding:10px 12px;border-radius:10px;max-width:80%;font-size:13px}
.typing-dots{display:flex;align-items:center;justify-content:flex-end}
.typing-dots span{width:6px;height:6px;background:#fff;border-radius:50%;display:inline-block;opacity:0.2}
.typing-dots span:nth-child(1){animation:dot 1s linear infinite 0s}
.typing-dots span:nth-child(2){animation:dot 1s linear infinite 0.15s}
.typing-dots span:nth-child(3){animation:dot 1s linear infinite 0.3s}
@keyframes dot{0%{opacity:0.2;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}100%{opacity:0.2;transform:translateY(0)}}

/* Small responsive tweak to keep phone scaled */
@media (max-width:900px){
  .support-phone svg.phone-frame{width:220px}
}

/* Bot typing dots (left aligned) */
.typing-dots.bot{align-self:flex-start;justify-content:flex-start;margin-top:6px}

/* Bot label shown above every bot message */
.bot-group{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.bot-label{background:#fff;border-radius:12px;padding:6px 10px;color:#d95353;font-weight:700;font-size:12px;box-shadow:0 6px 18px rgba(0,0,0,0.04);}

/* Bot name inside the bubble (when placed within .bot-bubble) */
.bot-bubble .bot-name{color:#d95353;font-weight:700;font-size:12px;margin-bottom:6px}

@media (max-width:900px){
  .support-row{flex-direction:column}
  .support-left,.support-right{flex:1 1 100%}
  .support-phone{order:2}
  .support-right{order:1}
}

/* Responsive */

@media (max-width:900px){
  .slide-inner h1{
    font-size:44px;
  }
  .brand-text{
    font-size:18px;
  }
}

@media (max-width:700px){
  .main-nav{
    display:none;
  }
  .mobile-toggle{
    display:block;
  }
  :root{
    --header-height:60px;
  }
  .slide-inner h1{
    font-size:28px;
  }
  .hero-search{
    flex-direction:column;
    padding:0 20px;
  }
  .hero-search input{
    width:100%;
  }
  .slide-arrow{
    width:40px;
    height:40px;
    font-size:22px;
  }
}

.nav-options .plan-holidays-btn{
  background-color: #d95353;
}

/* Mobile hero adjustments: hide hero nav arrows and make text more readable */
@media (max-width:768px){
  /* hide Swiper prev/next on small screens to reduce clutter */
  .hero-swiper .swiper-button-prev,
  .hero-swiper .swiper-button-next{
    display:none!important;
  }

  /* make hero full-bleed but ensure content has breathing room */
  .hero-content{
    padding:12px 16px;
    padding-top: calc(var(--header-height) + 8px);
    max-width:92%;
    margin:0 auto;
  }

  .hero-content h1{
    font-size:clamp(20px, 6vw, 36px);
    line-height:1.08;
    margin-bottom:10px;
  }

  .hero-content p{
    font-size:14px;
    margin-bottom:12px;
    opacity:0.95;
  }

  .hero-search{gap:10px;padding:0 10px}
  .hero-search input{font-size:15px;padding:12px}
  .hero-search button{padding:12px}
}



/* hero strip  */

.hero-strip{
  background: #000;
  color:#fff;
  box-shadow: 0 5px 10px rgba(0,0,0,0.04);
  padding:15px 12px;
  text-align:center;
  font-size:15px;
  font-weight:600;
  margin-top: -31px;
  opacity: 1;
  border-radius: 30px;
  display: flex;
  justify-content: space-around;
  position: relative; 
  z-index: 21; 
  align-items: center;
  align-content: center;
}
.hero-strip p{
  margin: auto;
}
.hero-strip p i{
  color: rgb(21, 194, 21);
  margin-right: 8px ;
  font-weight: 800;
}

@media (max-width:900px){
  .hero-strip{
    display: none;
  }
}

/* Testimonials */
.testimonials-section{
  background:transparent;
  padding:56px 20px;
}
.testimonial-card{
  background:#fff;
  border-radius:12px;
  border:1px solid rgba(7,18,23,0.04);
  box-shadow:0 8px 26px rgba(2,6,11,0.04);
  min-height:160px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.testimonial-card .test-body{
  color:#5b6370;
  font-size:15px;
  line-height:1.6;
}
.test-avatar{
  width:54px;
  height:54px;
  border-radius:50%;
  object-fit:cover;
}
.test-author .muted{
  font-size:13px;
  color:#6b6f77;
}

@media (max-width:700px){
  .testimonials-section{
    padding:28px 12px;
  }
  .testimonial-card{
    min-height:140px;
  }
}

/* About section styles */

.about-section{
  background:transparent;
  padding:56px 20px;
}
.about-section .stat-card{
  background:#fff;
  border-radius:10px;
  border:1px solid rgba(7,18,23,0.04);
  box-shadow:0 8px 20px rgba(2,6,11,0.04);
}
.about-section .stat-num{
  font-size:26px;
  font-weight:800;
  color:#071217;
}
.team-card{
  background:#fff;
  border-radius:10px;
  border:1px solid rgba(7,18,23,0.04);
  box-shadow:0 8px 20px rgba(2,6,11,0.04);
}
.team-avatar{
  width:84px;
  height:84px;
  border-radius:50%;
  object-fit:cover;
  margin:0 auto;
}

@media (max-width:700px){
  .about-section{
    padding:32px 12px;
  }
  .team-avatar{
    width:68px;
    height:68px;
  }
}

/* Contact section styles */
.contact-section .card{
  border-radius:12px;
}
.contact-section h3{
  font-size:22px;
  color:#071217;
}
.contact-section .form-label{
  font-weight:600;
}
.contact-section .btn-primary{
  background:#198cff;
  border-color:#198cff;
}

/* New footer styles */
.new-footer{
  font-family:Arial,Helvetica,sans-serif;
  color:#071217; 
  background-color: #2f343c;
}
.new-footer .footer-outer{
  background:transparent;
  padding:44px 20px 0;
}
.new-footer .footer-inner{
  max-width:1200px;
  margin:0 auto;
}
.new-footer .footer-box{
  background:#fff;
  border-radius:12px;
  padding:28px;
  border:1px solid rgba(7,18,23,0.04);
  box-shadow: 0px 10px 45px rgba(0, 0, 0, 0.12); 
  margin-top: -200px;
}
.new-footer .footer-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  align-items:stretch;
}
.new-footer .footer-grid .col h5{
  font-size:16px;
  margin-bottom:10px;
  color:#071217;
  font-weight: 600;
}
.new-footer .footer-grid .col p.muted{
  color:#6b6f77;
  font-size:14px;
  line-height:1.6;
}
.new-footer .brand img{
  height:46px;
}
.new-footer .links ul, .new-footer .brands ul, .new-footer .travellers ul{
  list-style:none;
  padding:0;
  margin:0;
}
.footer-fraud{
  color: red;
}
.new-footer .links li, .new-footer .brands li, .new-footer .travellers li{
  margin-bottom:8px;
}

/* Trending row: hide native horizontal scrollbar and add button focus styles */
#trendingCards{
  -ms-overflow-style: none; /* IE + Edge */
  scrollbar-width: none; /* Firefox */
  padding-bottom: 0 !important;
}
#trendingCards::-webkit-scrollbar{ display: none; height: 0; }

.trending-wrap button{
  cursor: pointer;
  background: #fff;
  border: 0;
}
.trending-wrap button:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(25,140,255,0.12);
}
.trending-card img:hover{
  transform: scale(1.09);
  transition: transform 0.3s ease-in-out;
}

/* hide overlay buttons on very small screens */
@media (max-width:600px){
  .trending-wrap button{ display:none; }
  .trending-row{ gap:14px; }
  .trending-card{ min-width:160px; }
}


/* Testimonials: hide native scrollbar and small-screen tweaks */
#testimonialsCarousel{
  -ms-overflow-style: none;
  scrollbar-width: none;
}
#testimonialsCarousel::-webkit-scrollbar{ display:none; height:0; }
.testimonials-wrap button{ cursor:pointer; background:#fff; border:0; }
.testimonials-wrap button:focus{ box-shadow: 0 0 0 4px rgba(25,140,255,0.12); outline:none; }
@media (max-width:700px){
  .testimonials-wrap button{ display:none; }
  .testimonials-row{ gap:14px; }
  .test-card{ min-width:220px; }
}

/* Responsive card counts and scroll-snap for scrollers
   - Desktop: 3 cards visible
   - Tablet: 2 cards visible
   - Mobile: 1 card visible
*/
/* Apply to trending, testimonials, reasons and recent carousels */
#trendingCards, #testimonialsCarousel, #reasonsCarousel, .recent-carousel{
  scroll-snap-type: x mandatory;
}

#trendingCards .trending-card,
#testimonialsCarousel .test-card,
#reasonsCarousel .reasons-card,
.recent-carousel .recent-card{
  scroll-snap-align: start;
  -webkit-scroll-snap-align: start;
  flex: 0 0 calc((100% - 56px) / 3); /* default: 3 columns with 28px gap (2 * gap = 56px) */
  max-width: calc((100% - 56px) / 3);
}

/* Tablet: 2 cards */
@media (max-width: 1024px){
  #trendingCards .trending-card,
  #testimonialsCarousel .test-card,
  #reasonsCarousel .reasons-card,
  .recent-carousel .recent-card{
    flex: 0 0 calc((100% - 28px) / 2);
    max-width: calc((100% - 28px) / 2);
  }
}

/* Mobile: 1 card */
@media (max-width: 600px){
  #trendingCards .trending-card,
  #testimonialsCarousel .test-card,
  #reasonsCarousel .reasons-card,
  .recent-carousel .recent-card{
    flex: 0 0 100%;
    max-width: 100%;
  }
}
.new-footer a{
  color:#7b7d7d;
  text-decoration:none;
  font-weight: 500;
}
.new-footer a:hover{
  color:var(--accent);
}
.new-footer .dest-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.new-footer .dest-grid a{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  text-align:center;
}
.new-footer .dest-grid img{
  width:64px;
  height:48px;
  border-radius:6px;
  object-fit:cover;
}
.new-footer .dest-grid span{
  font-size:13px;
  color:#5b6370;
}

.footer-bottom-dark{
  background:#2f343c;
  color:#fff;
  padding:18px 0;
  margin-top:18px;
  border-radius:8px;
}
.footer-bottom-inner{
  max-width:1200px;
  margin:0 auto;
  /* height: 100px; */
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:6px 20px; 
  flex-direction: column;
}
.footer-bottom-inner .logo-center img{
  height:80px;
  /* width: 150px; */
  object-fit: cover;
}
.footer-bottom-inner .socials-row{
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:center;
  margin-top:14px;
}
.footer-bottom-inner .socials-row a{
  color:#fff;
  font-size:20px;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:64px;
  border-radius:50%; 
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.04);
}
.footer-bottom-inner .socials-row a i{
  font-size:25px;
}
.footer-bottom-inner .socials-row a:hover{
  color:var(--accent);
  background:rgba(255,255,255,0.09);
  transform:translateY(-3px);
}
.footer-bottom-inner .copyright{
  font-size:14px;
  color:rgba(255,255,255,0.8);
  margin-top:14px;
}

/* Divider with centered logo */
.footer-divider{
  display:flex;
  align-items:center;
  gap:18px;
  width:100%;
}
.footer-divider .line{flex:1;height:1px;background:rgba(255,255,255,0.18);display:block}
.footer-divider .logo-center{display:flex;align-items:center;justify-content:center;padding:6px 18px;background:transparent}
/* .footer-divider .logo-center img{height:36px} */

/* Back to top button (footer) */
.back-to-top{position:absolute;right:20px;bottom:18px;background:#fff;color:#071217;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 6px 18px rgba(2,6,11,0.12);opacity:0;visibility:hidden;transform:translateY(6px);transition:all .28s ease}
.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top i{font-size:14px}

@media (max-width:980px){
  .footer-divider .logo-center img{height:34px}
  .back-to-top{right:12px}
}

@media (max-width:980px){
  .new-footer .footer-grid{grid-template-columns:repeat(2,1fr)}
  .new-footer .dest-grid{grid-template-columns:repeat(4,1fr)}
  .footer-bottom-inner{flex-direction:column;gap:8px;text-align:center}
}

@media (max-width:520px){
  .new-footer .footer-grid{grid-template-columns:1fr}
  .new-footer .dest-grid{grid-template-columns:repeat(3,1fr)}
  .new-footer .brand img{height:40px}
}

/* Take Charge section */
.takecharge-section{padding:40px 20px; 
  
}
.tc-box{background:#fff;border-radius:20px;border:1px solid rgba(255,107,107,0.18);box-shadow:0 1px 20px #d95353;padding:28px}
.tc-inner{display:flex;align-items:center;gap:26px}
.tc-content{flex:1}
.tc-content h2{font-size:34px;line-height:1.05;color:#071217;margin-bottom:12px;font-weight:700}
.tc-content p{color:#6b6f77;font-size:16px;max-width:720px;margin-bottom:18px}
.tc-cta{
 background-color: #d95353; display:inline-block;background:#d95353;color:#fff;padding:12px 22px;border-radius:12px;text-decoration:none;font-weight:700;box-shadow:0 8px 24px rgba(255,107,107,0.12)}
.tc-graphic{flex:0 0 320px;display:flex;justify-content:center}
.tc-graphic img{width:320px;height:auto;object-fit:contain}

@media (max-width:992px){
  .tc-inner{flex-direction:column-reverse;align-items:flex-start}
  .tc-graphic{width:100%;flex:0 0 auto}
  .tc-graphic img{width:260px}
  .tc-content h2{font-size:28px}
}

@media (max-width:520px){
  .tc-box{padding:18px;border-radius:14px}
  .tc-content h2{font-size:22px}
  .tc-graphic img{width:180px}
}

/* Testimonials styles */
.testimonials-section{padding:40px 20px; margin-bottom: 200px;}
.testimonials-section .section-title{font-size:32px;margin-bottom:6px}
.test-card{position:relative;display:flex;flex-direction:column;align-items:center}
.test-avatar-wrap{width:260px;height:260px;border-radius:50%;overflow:hidden;box-shadow:0 12px 30px rgba(2,6,11,0.08);border:1px solid rgba(7,18,23,0.04)}
.test-avatar{width:100%;height:100%;object-fit:cover;display:block}
.test-panel{width:100%;margin-top:-48px;padding:0 10px}
.test-panel-inner{background:#fff;border-radius:16px;padding:18px;box-shadow:0 12px 30px rgba(2,6,11,0.06);border:1px solid rgba(7,18,23,0.04)}
.test-name{font-weight:800;font-size:18px;color:#071217;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.test-name .brand.small{font-weight:700;color:#ff6b6b;font-size:12px;margin-left:8px}
.test-text{color:#57585b;font-size:14px;line-height:1.5;margin-bottom:12px}
.test-meta{font-size:14px;color:#6b6f77;display:flex;align-items:center;gap:10px}
.test-stars{color:#ffcf36;margin-left:8px}

@media (max-width:992px){
  .testimonials-row{grid-template-columns:repeat(2,1fr)!important}
  .test-avatar-wrap{width:220px;height:220px}
}

@media (max-width:600px){
  .testimonials-row{grid-template-columns:1fr!important}
  .test-avatar-wrap{width:180px;height:180px}
}

/* Enquiry modal styles */
.enquire-modal{position:fixed;inset:0;display:none;z-index:99}
.enquire-modal.open{display:block}
.enquire-backdrop{position:fixed;inset:0;background:rgba(2,6,11,0.5)}
.enquire-dialog{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);max-width:500px;width:80%;background:#fff;border-radius:14px;box-shadow:0 40px 80px rgba(2,6,11,0.2);overflow:hidden}
.enquire-close{position:absolute;right:10px;top:8px;background:transparent;border:0;font-size:26px;line-height:1;color:#333;cursor:pointer;padding:6px}
.enquire-inner{display:flex;gap:0;min-height:360px; }
.enquire-form-wrap{flex:1;padding:10px 20px}
.enquire-form-wrap h3{margin-top:0px;margin-bottom:10px;font-size:20px}
.enquire-form-wrap .form-row{margin-bottom:10px;}
.enquire-form-wrap .enquire-sub{color:#6b6f77;margin-top:4px;margin-bottom:12px}
.enquire-form-wrap input,.enquire-form-wrap textarea{width:100%;padding:8px 16px;border-radius:12px;border:1px solid rgba(7,18,23,0.08);font-size:15px;background:#fff}
.pax-row{display:flex;gap:12px;margin-bottom:14px}
.pax-input{flex:1}
.pax-input label{font-size:13px;color:#5b6370;margin-bottom:6px;display:block}
.pax-input input{padding:5px 12px;border-radius:8px;border:1px solid rgba(7,18,23,0.08);width:100%}
.form-actions{display:block;margin-top:6px}
.submit-enquire{background:#ff6b6b;color:#fff;padding:14px 20px;border-radius:12px;border:0;font-weight:700;width:100%;font-size:16px}
.enquire-side{display:none}
.enquire-dialog{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);max-width:600px;width:95%;background:#fff;border-radius:14px;box-shadow:0 40px 80px rgba(2,6,11,0.2);overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - 48px)}
.enquire-close{position:absolute;right:12px;top:10px;background:transparent;border:0;font-size:28px;line-height:1;color:#333;cursor:pointer;padding:6px;z-index:20}
.enquire-inner{display:flex;gap:0;min-height:360px;flex:1;overflow:auto}
.enquire-form-wrap{flex:1;padding:22px 26px;overflow:auto}

/* Make modal full-height on small screens and scrollable */
@media (max-width:720px){
  .enquire-dialog{left:0;right:0;top:auto;bottom:0;transform:none;width:100%;max-width:none;border-radius:12px 12px 0 0}
  .enquire-inner{flex-direction:column}
  .enquire-side{width:100%;order:2}
  .enquire-form-wrap{order:1;padding:18px;max-height:60vh;overflow:auto}
  .enquire-dialog{max-height:92vh}
  .enquire-close{right:12px;top:6px}
}
.enquire-dialog{max-height:calc(100vh - 12px)}
.enquire-close{right:12px;top:10px}

/* Larger dialog header style to match reference */
.enquire-form-wrap h2{font-size:22px;margin:6px 0}
.enquire-form-wrap p.enquire-sub{font-size:14px}

@media (max-width:992px){
  .enquire-dialog{left:0;right:0;top:auto;bottom:0;transform:none;width:100%;max-width:none;border-radius:12px 12px 0 0;max-height:calc(100vh - 12px)}
  .enquire-inner{flex-direction:column}
  .enquire-side{width:100%;order:2}
  .enquire-form-wrap{order:1;padding:16px;max-height:calc(100vh - 160px);overflow:auto}
  .enquire-dialog{max-height:calc(100vh - 12px)}
  .enquire-close{right:12px;top:10px}
}

/* keep previous small-screen rules but ensure behaviour remains stable on very small phones */
@media (max-width:520px){
  .enquire-form-wrap{max-height:calc(100vh - 180px)}
}
/* Vertical separators between the first four footer menu columns */
.new-footer .footer-box .footer-grid .col{position:relative;padding:12px 18px}
.new-footer .footer-box .footer-grid .col:nth-child(n+2):nth-child(-n+4){
  border-left:1px solid rgba(22, 22, 22, 0.12);
  padding-left:28px;
}

@media (max-width:980px){
  /* remove separators on smaller widths to avoid cramped layout */
  .new-footer .footer-box .footer-grid .col:nth-child(n+2):nth-child(-n+4){ border-left:0;padding-left:0 }
}
.map-wrap iframe{display:block;width:100%;height:300px;border:0}

@media (max-width:768px){
  .map-wrap iframe{height:240px}
}



/* Featured Destinations styles */
.featured-section{
  padding:56px 20px 36px;
  background: #fff;
  color:#071217;
}
.featured-section .section-title{
  text-align:center;
  font-size:36px;
  margin:0 0 18px;
  font-weight:700;
}
.dest-categories{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:22px}
.dest-categories .pill{background:transparent;border:1px solid rgba(7,18,23,0.06);padding:10px 18px;border-radius:24px;color:#333;cursor:pointer}
.dest-categories .pill.active{background:var(--accent);color:#fff;border-color:transparent}

.dest-swiper{padding:8px 6px 18px; position:relative}
.dest-swiper .swiper-slide{width:320px}
.dest-card{background:transparent;border-radius:18px;padding:12px 6px;display:flex;flex-direction:column;align-items:center}
.dest-img{width:100%;height:190px;border-radius:16px;background-size:cover;background-position:center;box-shadow:0 12px 30px rgba(2,6,11,0.06)}
.dest-meta{display:flex;align-items:center;gap:8px;margin-top:12px;font-weight:700;color:#071217}
.dest-pin{font-size:16px}
.dest-name{font-size:18px}

/* Reasons to book carousel */
.reasons-section{
  background:transparent;
  padding:42px 20px;
}

.reasons-section .section-title{
  text-align:center;
  font-size:32px;
  margin-bottom:6px;
  font-weight:700;
  color:#071217;
}

.reasons-section .section-sub{
  margin-bottom:18px;
}

.reasons-carousel{
  display:flex;
  gap:18px;
  overflow-x:hidden;
  padding:18px 6px;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
}

.reasons-carousel::-webkit-scrollbar{
  display:none;
  height:0;
}

.reasons-carousel{ 
  -ms-overflow-style: none;
  scrollbar-width: none; 
}

.reasons-carousel{
  display:flex;
  gap:18px;
  overflow-x:auto;
  padding:18px 6px;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
}

.reasons-carousel::-webkit-scrollbar{
  height:8px;
}

.reasons-carousel{ 
  -ms-overflow-style: auto; 
  scrollbar-width: auto; 
}

.reasons-card{
  scroll-snap-align:start;
}

.reasons-card{
  flex:0 0 23%;
  max-width:320px;
  min-width:220px;
  background:#fff;
  border-radius:14px;
  border:1px solid rgba(7,18,23,0.04);
  padding:18px;
  box-shadow:0 10px 30px rgba(2,6,11,0.04);
  display:flex;
  align-items:center;
}

.reason-inner{
  display:flex;
  gap:14px;
  align-items:center;
}

.reason-icon{
  width:72px;
  height:72px;
  border-radius:12px; 
  color: var(--accent); 
  background:#f6fbff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:32px;
}

.reason-body h3{
  margin:0;
  font-size:20px;
  color:#071217;
}

.reason-body .muted{
  color:#6b7580;
  margin-top:6px;
}

.reasons-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:56px;
  height:56px;
  border-radius:50%;
  border:0;
  background:#fff;
  box-shadow:0 10px 28px rgba(2,6,11,0.12);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  cursor:pointer;
  z-index:12;
}

.reasons-arrow.prev{
  left:-28px;
}

.reasons-arrow.next{
  right:-28px;
}

.reasons-arrow{
  position:absolute;
  top:50px;
  transform:translateY(0);
  width:48px;
  height:48px;
  border-radius:50%;
  border:0;
  background:#fff;
  box-shadow:0 6px 18px rgba(2,6,11,0.08);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  cursor:pointer;
  z-index:12;
}

.reasons-arrow.prev{
  right:86px;
}

.reasons-arrow.next{
  right:16px;
}

@media (max-width:900px){
  .reasons-card{
    flex:0 0 60%;
    max-width:60%;
  }
  .reasons-arrow.prev{
    left:8px;
  }
  .reasons-arrow.next{
    right:8px;
  }
}
@media (max-width:700px){
  .reasons-card{
    flex:0 0 85%;
    max-width:85%;
  }
  .reasons-arrow{
    display:none;
  }
}

/* Recently Booked Itineraries */
.recently-booked-section{padding:0px 20px;background:transparent; background-color: #b4ddf9}
.recently-booked-section .section-title{font-size:32px;font-weight:700;color:#071217}
.recent-tabs .recent-tab{background:transparent;border:1px solid rgba(7,18,23,0.06);padding:8px 16px;border-radius:24px;background-color: #fff; cursor:pointer;font-weight:700}
.recent-tabs .recent-tab.active{background:var(--accent);color:#fff;border-color:transparent}
.recent-carousel{display:flex;gap:18px;overflow:hidden;padding:18px 6px}
.recent-card{flex:0 0 22%;min-width:220px;background:#fff;border-radius:12px;border:1px solid rgba(7,18,23,0.04);overflow:hidden;box-shadow:0 12px 30px rgba(2,6,11,0.04);}
.recent-carousel{display:flex;gap:18px;overflow-x:auto;padding:18px 6px;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.recent-carousel::-webkit-scrollbar{height:8px}
.recent-carousel{ -ms-overflow-style: auto; scrollbar-width: auto; }
.recent-card{flex:0 0 28%;min-width:220px;background:#fff;border-radius:12px;border:3px solid #d95353;overflow:hidden;box-shadow:0 12px 30px rgba(2,6,11,0.04);scroll-snap-align:start;position:relative}
/* top yellow band using pseudo element */
.recent-card::before{
  content:'';
  position:absolute;
  left:0;right:0;top:0;height:52px;
  background:#d95353; /* bright lemon */
  border-top-left-radius:12px;border-top-right-radius:12px;
  z-index:12;
}
/* position the initials + who/timestamp over the yellow band */
.recent-badge{position:absolute;top:8px;left:18px;font-size:13px;color:#071217;font-weight:700;z-index:12;display:flex;align-items:center;gap:10px}
.recent-badge .initials{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#ffb7d0;color:#071217;font-weight:800;margin-right:8px;box-shadow:0 2px 6px rgba(2,6,11,0.06)}
/* push the image down slightly so the band sits above it */
.recent-img{width:100%;height:170px;object-fit:cover;display:block;margin-top:14px}
.recent-content{padding:14px 16px 18px}
.recent-content h3{font-size:18px;margin:6px 0 10px;color:#071217;font-weight:600}
.recent-meta{color:#6b7580;font-size:13px;margin-bottom:12px}
/* optional tag/pill inside recent content if present */
.recent-content .pill{display:inline-block;padding:6px 10px;border-radius:14px;background:#ffe7ee;color:#b02e57;font-weight:700;font-size:12px;margin-bottom:8px}
.recent-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid rgba(7,18,23,0.04)}
.recent-pill{display:inline-block;padding:6px 10px;border-radius:14px;background:#ffdbe6;color:#c33d6b;font-weight:700;font-size:12px;margin-top:6px;letter-spacing:0.6px}
.recent-price{font-weight:800;font-size:20px}
.btn-small{background:#0f9d58;color:#fff;padding:10px 16px;border-radius:10px;text-decoration:none;font-weight:700}
.recent-arrow{position:absolute;width:56px;height:56px;border-radius:50%;border:0;background:#fff;box-shadow:0 10px 28px rgba(2,6,11,0.12);display:flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer;}
/* .recent-arrow.prev{left:-28px} */
.recent-arrow.next{right:-28px}
.recent-arrow{position:absolute;top:-70px;transform:translateY(0);width:44px;height:44px;border-radius:50%;border:0;background:#fff;box-shadow:0 6px 18px rgba(2,6,11,0.08);display:flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer;z-index:12}
.recent-arrow.prev{right:72px}
.recent-arrow.next{right:16px}
@media (max-width:992px){
  .recent-card{flex:0 0 46%;min-width:240px}
}
@media (max-width:700px){
  .recent-card{flex:0 0 85%;min-width:80%}
  .recent-arrow{display:none}
}

/* pagination tweak */
.dest-pagination{margin-top:16px}

/* Travelling on a budget */
.budget-section{padding:36px 20px;background:transparent}
.budget-section .section-title{font-size:28px;font-weight:700;color:#071217}
.budget-row{display:flex;gap:22px;align-items:stretch}
.budget-card{flex:0 0 32%;min-width:220px;background:#fff;border-radius:18px;overflow:hidden;border:1px solid rgba(7,18,23,0.06);box-shadow:0 8px 28px rgba(2,6,11,0.04);display:flex;flex-direction:column}
.budget-top{padding:28px 20px 22px;color:#071217;display:flex;flex-direction:column;gap:6px}
.budget-label{font-size:20px;font-weight:700}
.budget-amount{font-size:40px;font-weight:700}
.budget-amount .per{font-size:18px;font-weight:700;margin-left:6px}
.budget-bottom{background:#fff;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(7,18,23,0.04)}
.budget-desc{color:#071217;font-size:16px; font-weight: 600;}
.budget-cta{width:44px;height:44px;border-radius:50%;background:#0f62ff;color:#fff;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:18px}
@media (max-width:992px){.budget-card{flex:0 0 48%;min-width:200px}}
@media (max-width:700px){.budget-row{flex-direction:column}.budget-card{flex:0 0 100%}}

/* Last-minute deals (Visa-free) */
.lastminute-section{
  padding:36px 20px;
  background:transparent; 
}
.lastminute-section .section-title{font-size:28px;font-weight:700;color:#071217}
.lastminute-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;align-items:stretch}
.lm-card{position:relative;border-radius:14px;overflow:hidden}
.lm-card img{width:100%;height:100%;display:block;object-fit:cover}
.lm-card--large{grid-column:2 / 3;grid-row:1 / span 2;height:460px;border-radius:18px}
.lm-card--small{height:220px;border-radius:12px}
.lm-overlay{position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.58) 100%);color:#fff}
.lm-title{font-size:24px;font-weight:800}
.lm-from{font-size:14px;margin-top:8px}
@media (max-width:1100px){.lastminute-grid{grid-template-columns:1fr 1fr;}.lm-card--large{grid-column:1 / -1;height:420px}}
@media (max-width:700px){.lastminute-grid{grid-template-columns:1fr;gap:14px}.lm-card--large{height:320px}.lm-card--small{height:180px}}

/* Make last-minute section compact on tablet/mobile: 3-up rounded thumbnails with labels below */
@media (max-width:1100px){
  .lastminute-grid{grid-template-columns:repeat(3,1fr);gap:18px}
  .lm-card--large{grid-column:auto;grid-row:auto;height:auto}
  .lm-card{height:auto;border-radius:16px}
/* Tablet: show 2 cards in honeymoon section for better readability */
@media (max-width:1024px){
  .honeymoon-cards .package-card{
    flex: 0 0 calc((100% - 20px) / 2);
    max-width: calc((100% - 20px) / 2);
    min-height:420px;
  }
}
  .lm-card img{width:100%;height:120px;object-fit:cover;border-radius:16px}
  .lm-overlay{position:static;background:transparent;color:#071217;padding:10px 0 0;text-align:center}
  .lm-title{font-size:16px;font-weight:700}
  .lm-from{font-size:13px;margin-top:6px;color:#6b6f77}
}
@media (max-width:700px){
  .lastminute-grid{grid-template-columns:repeat(3,1fr);gap:12px}
  .lm-card img{height:90px;border-radius:14px}
  .lm-title{font-size:14px}
  .lm-from{font-size:12px}
}

/* navigation arrows for destinations slider */
.dest-prev, .dest-next{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(7,18,23,0.06);cursor:pointer;z-index:12}
.dest-prev{left:8px}
.dest-next{right:8px}
@media (max-width:992px){
  .dest-prev,.dest-next{display:none}
}

@media (max-width:900px){
  .dest-swiper .swiper-slide{width:260px}
  .dest-img{height:160px}
  .featured-section .section-title{font-size:28px}
}
@media (max-width:480px){
  .dest-swiper .swiper-slide{width:220px}
  .dest-img{height:140px}
}

/* Honeymoon section styles */
.honeymoon-section{padding:36px 20px;background:#fff}
.honeymoon-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.honeymoon-header .title{font-size:28px;font-weight:700;color:#071217}
.honeymoon-pills{display:flex;gap:10px}
.honeymoon-pills .pill{background:#fff;border:1px solid rgba(7,18,23,0.06);padding:10px 14px;border-radius:8px;color:#333;cursor:pointer;font-weight:600}
.honeymoon-pills .pill.active{background:var(--accent);color:#fff;border-color:transparent}
.honeymoon-row{position:relative}
.honeymoon-cards{display:flex;gap:20px;overflow-x:auto;overflow-y:hidden;padding-bottom:8px;scroll-behavior:smooth;align-items:stretch;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
.honeymoon-cards .package-card{box-sizing:border-box;flex:0 0 calc((100% - 40px) / 3);max-width:calc((100% - 40px) / 3);min-height:420px;display:flex;flex-direction:column;scroll-snap-align:start}
.honeymoon-cards .package-card .package-image{height:220px}
.honeymoon-cards .package-card .package-body{flex:1;}
.honeymoon-cards .package-card .package-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-clamp:2}
.honeymoon-nav{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:12}
.honeymoon-nav.left{left:-28px}
.honeymoon-nav.right{right:-28px}
.honeymoon-nav button{width:56px;height:56px;border-radius:50%;border:0;background:rgba(7,18,23,0.06);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 18px rgba(2,6,11,0.06)}
.honeymoon-nav button:hover{background:rgba(7,18,23,0.12)}

/* card show/hide transitions */
.package-card{transition:transform .3s ease, opacity .3s ease}
.package-card.fade-out{opacity:0;transform:translateY(8px);pointer-events:none}
.package-card.fade-in{opacity:1;transform:none}

@media (max-width:1200px){
  /* keep 3-up but slightly smaller image */
  .honeymoon-cards .package-card{flex:0 0 calc((100% - 40px) / 3);max-width:calc((100% - 40px) / 3);min-height:400px}
  .honeymoon-cards .package-card .package-image{height:160px}
}
@media (max-width:900px){
  .honeymoon-header{flex-direction:column;align-items:flex-start}
  .honeymoon-pills{flex-wrap:wrap}
  .honeymoon-cards{gap:12px}
  .honeymoon-cards .package-card{flex:0 0 calc((100% - 20px) / 2);max-width:calc((100% - 20px) / 2);min-height:420px}
  .honeymoon-cards .package-card .package-image{height:150px}
  .honeymoon-nav.left{left:-22px}
  .honeymoon-nav.right{right:-22px}
  .honeymoon-nav button{width:48px;height:48px}
}
@media (max-width:700px){
  .honeymoon-cards .package-card{flex:0 0 85%;max-width:85%;height:auto}
  .honeymoon-cards .package-card .package-image{height:140px}
  .honeymoon-nav{display:flex}
  .honeymoon-nav.left{left:-20px}
  .honeymoon-nav.right{right:-20px}
  .honeymoon-nav button{width:44px;height:44px}
}

/* hide default scrollbar while allowing scroll */
.honeymoon-cards::-webkit-scrollbar{height:8px;display:none}
.honeymoon-cards{-ms-overflow-style:none;scrollbar-width:none}


/* Features banner (marketing) */
.features-banner{
  padding:40px 20px;
  background:#f6f5ff;
  background-color: #b4ddf9;
  border-radius:18px;
  margin:40px auto;
}
.features-inner{max-width:1200px;margin:0 auto;}
.features-title{font-size:32px;text-align:center;margin:6px 0 22px;font-weight:700;color:#071217}
.features-row{display:flex;gap:28px;justify-content:space-between;align-items:stretch}
.feature-item{display:flex;gap:18px;align-items:flex-start;flex:1;min-width:0}
.feature-icon{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;flex-shrink:0;box-shadow:0 8px 24px rgba(2,6,11,0.06)}
.feature-icon--gold{background:#ffb84d;color:#071217}
.feature-icon--blue{background:#1ea3ff;color:#fff}
.feature-body h3{font-size:20px;margin:0 0 8px;font-weight:600;color:#071217}
.feature-body p{margin:0;color:#5b6370;line-height:1.5}
.features-cta{margin-top:28px;display:flex;justify-content:center}
.cta-pill{background:#198cff;color:#fff;padding:12px 28px;border-radius:30px;display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-weight:700}
.cta-link{background:rgba(255,255,255,0.12);padding:8px 12px;border-radius:16px;font-weight:600}

@media (max-width:900px){
  .features-title{font-size:28px}
  .features-row{gap:18px}
}
@media (max-width:768px){
  .features-row{flex-direction:column;align-items:center;text-align:center}
  .feature-item{flex-direction:column;align-items:center}
  .feature-body h3{font-size:18px}
  .feature-icon{width:64px;height:64px;font-size:22px;margin-bottom:10px}
  .cta-pill{width:fit-content}
}


/* Packages / cards */
.packages-section{padding:52px 20px;background:transparent}
.packages-section .section-title{font-size:36px;text-align:center;margin-top:6px;margin-bottom:8px;font-weight:700}
.packages-section .section-sub{text-align:center;color:#6b6f77;margin-bottom:28px}
.packages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:start}
.package-card{background:#fff;border-radius:16px;border:1px solid rgba(7,18,23,0.06);overflow:hidden;box-shadow:0 6px 22px rgba(2,6,11,0.04);display:flex;flex-direction:column;min-height: 429px; margin-top: 15px;}
.package-image{height:220px;background-size:contain;background-position:center;border-bottom-left-radius:16px;border-bottom-right-radius:16px;position:relative}
.package-image img{width:100%;height:100%;object-fit:cover;display:block;border-bottom-left-radius:16px;border-bottom-right-radius:16px}
.package-image img:hover{
  transform: scale(1.09);
  transition: transform 0.3s ease-in-out;
}
.package-image .badges{position:absolute;top:12px;right:12px;display:flex;flex-direction:column;gap:8px}
.badge{display:inline-block;padding:6px 12px;border-radius:16px;font-weight:700;font-size:13px}
.badge-sale{background:#ff4d6d;color:#fff}
.badge-type{background:#d95353;color:#071217}
.badge-featured{background:#ff9a2c;color:#071217}
.package-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:5px}
.package-title{font-size:20px;margin:0;color:#071217}
.package-meta{color:#6b6f77;font-size:14px}
.package-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.package-row .book-btn{background-color:#248df7;color:#fff;padding:10px 16px;border-radius:10px;text-decoration:none;font-weight:600}
.package-row .book-btn:hover{background-color:#55a3f1;color: #fff;}
.price{text-align:right}
.price-old{text-decoration:line-through;color:#9aa0a6;font-size:14px}
.package-features{list-style:none;padding:0;margin:6px 0 0;display:flex;flex-wrap:wrap;gap:8px 12px;font-size:13px;color:#5b6370;align-items:center}
.package-features li{margin:0;display:inline-flex;align-items:center;gap:8px;padding-right:6px;font-size:13px}
.package-features li::before{content:"\2022";color:#000;font-weight:700;margin-right:6px;font-size:12px;line-height:1}
/* paragraphs immediately after the features list: show as single-line with ellipsis */
.package-features + p,
.package-features + p + p,
.package-features + p + p + p,
.hon-desc{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin:0 12px 0 0;
  padding:0;
  font-size:13px;
  color:#5b6370;
}
.hon-desc{
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  
}
.hon-desc p{
  margin: 0; padding:0;

}
.package-features + p::before,.hon-desc p::before, .package-features + p + p::before, .package-features + p + p + p::before{content:"\2713";color:#1ea37a;font-weight:700;margin-right:6px;font-size:12px;line-height:1;top:2px;}
.package-row{display:flex;align-items:center;justify-content:space-between;gap:12px;clear:both}



/* Ensure the price row and divider sit at the bottom of each package card for consistent layout */
.package-body{display:flex;flex-direction:column;flex:1;padding-bottom:14px}
.package-body hr{margin:0 0 12px 0}
.package-row{margin-top:auto;align-items:center;border-top:1px solid rgba(12, 12, 12, 0.12);padding-top:12px}
.package-features li a{color:inherit;text-decoration:none}
.price-label{color:#9aa0a6;font-size:13px;margin-bottom:6px}
.price-line{display:flex;align-items:center;gap:8px;font-size:14px}
.price-old{text-decoration:line-through;color:#9aa0a6}
.save-badge{background:#ffd9b3;color:#b45a00;padding:4px 8px;border-radius:8px;font-weight:700;font-size:12px}  
.price-sub{font-size:12px;color:#6b6f77;font-weight:400}
.honeymoon-cards .package-row{align-items:end}
.price-now{font-size:20px;font-weight:600;color:#071217; margin-top: 6px;}
.price-sub{font-size:12px;color:#6b6f77}
.package-footer{display:flex;gap:18px;align-items:center;color:#5b6370;font-size:14px}
.package-footer .pkg-icon{display:flex;align-items:center;gap:8px}
.package-card hr{border:0;border-top:1px solid rgba(7,18,23,0.04);margin:8px 0}

@media (max-width:1024px){
  .packages-grid{grid-template-columns:repeat(2,1fr)}
  .package-image{height:200px}
}


/* When mainnav is sticky, avoid content jump by adding padding to body (handled by JS), but provide a fallback spacing class */
.body-with-sticky-nav{padding-top:64px}



@media (max-width:700px){
  .packages-grid{grid-template-columns:1fr}
  .package-image{height:180px}
}


/* Blog section */
.blog-section{padding:52px 20px;background:#fff}
.blog-section .section-title{font-size:32px;text-align:center;margin-bottom:6px; font-weight: 700;}
.blog-section .section-sub{text-align:center;color:#6b6f77;margin-bottom:26px}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.blog-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid rgba(7,18,23,0.04);box-shadow:0 8px 30px rgba(2,6,11,0.04);display:flex;flex-direction:column}
.blog-image{height:160px;background-size:cover;background-position:center}
.blog-body{padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.blog-meta{font-size:13px;color:#9aa0a6}
.blog-title{font-size:18px;margin:0;color:#071217}
.blog-excerpt{color:#5b6370;font-size:14px}
.read-more{margin-top:8px;color:var(--accent);font-weight:700;text-decoration:none}

@media (max-width:1024px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.blog-grid{grid-template-columns:1fr}}

/* FAQ accordion */
.faq-section{padding:52px 20px;background:transparent}
.faq-section .section-title{font-size:32px;text-align:center;margin-bottom:6px; font-weight: 700;}
.faq-section .section-sub{text-align:center;color:#6b6f77;margin-bottom:22px}
.faq-list{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq-item{border-radius:12px;overflow:hidden;border:1px solid rgba(7,18,23,0.06);background:#fff}
.faq-q{width:100%;text-align:left;padding:16px 18px;background:transparent;border:0;font-size:16px;display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.faq-q:hover{background:rgba(2,6,11,0.02)}
.faq-arrow{transition:transform .28s ease;margin-left:12px}
.faq-a{padding:12px 18px;border-top:1px solid rgba(7,18,23,0.04);display:none;color:#5b6370;line-height:1.6}
.faq-item.open .faq-a{display:block}
.faq-item.open .faq-arrow{transform:rotate(90deg)}

@media (max-width:700px){.faq-q{font-size:15px;padding:12px 14px}.faq-a{padding:12px 14px}}

/* Activity / Adventure grid */
.activity-section{padding:40px 20px;background:transparent}
.activity-head{text-align:center;max-width:980px;margin:0 auto 36px}
.activity-sub{color:#ff5a5a;font-weight:700;letter-spacing:1px;margin-bottom:12px;display:inline-block;text-transform:uppercase;position:relative}
.activity-sub:before{content:'';display:inline-block;width:64px;height:3px;background:#ff5a5a;margin-right:14px;vertical-align:middle;border-radius:2px}
.activity-title{font-size:32px;margin:0 0 14px;font-weight:700;color:#071217;}
.activity-desc{color:#6b6f77;max-width:900px;margin:0 auto;font-size:15px}
.activity-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:28px;align-items:start;justify-items:center;max-width:1200px;margin:0 auto}
.activity-item{display:flex;flex-direction:column;align-items:center;gap:14px;padding:18px;background:transparent;border-radius:10px}
.activity-box{width:150px;height:120px;border:1px solid rgba(7,18,23,0.06);display:flex;align-items:center;justify-content:center;border-radius:10px;background:#fff;font-size:40px;color:#0b7fcf;box-shadow:0 8px 20px rgba(2,6,11,0.03);transition:transform .22s ease, box-shadow .22s ease}
.activity-item:hover .activity-box{transform:translateY(-6px);box-shadow:0 18px 40px rgba(2,6,11,0.08)}
.activity-item h4{margin:0;font-size:18px;color:#071217}
.activity-item .muted{color:#6b6f77;font-size:14px}

@media (max-width:1200px){.activity-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:900px){.activity-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.activity-grid{grid-template-columns:repeat(2,1fr)}.activity-box{width:120px;height:92px;font-size:30px}}
@media (max-width:480px){.activity-grid{grid-template-columns:1fr}.activity-box{width:100px;height:84px}}




/* back to top  */

.back-to-top{
  position:fixed;
  bottom:24px;
  right:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:50%;
  background:#198cff;
  color:#fdfdfd;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(2,6,11,0.12);
  opacity:0;
  transform:translateY(10px) scale(.98);
  transition:opacity .28s ease, transform .28s ease;
  cursor:pointer;
  z-index:99;
}
.back-to-top i{
  color: #fff;
}
.back-to-top.visible{opacity:1;transform:translateY(0) scale(1)}

/* Gallery specific tweaks */
.gallery-section{background:transparent;padding-top:56px;padding-bottom:56px}
.gallery-section .section-title{
  text-align:center;
  font-weight:700;
  font-size: 32px;
}
.gallery-intro .small{letter-spacing:1px}
.gallery-title{font-size:42px;line-height:1.02;color:#071217;margin-bottom:14px}
.gallery-section .text-muted{color:#6b6f77}
.gallery-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:12px;box-shadow:0 14px 40px rgba(2,6,11,0.06)}
.gallery-img-main img{
  min-height: 205px;
}

@media (max-width:992px){
  .gallery-title{font-size:32px}
}
@media (max-width:576px){
  .gallery-title{font-size:24px}
  .gallery-section{padding-top:28px;padding-bottom:28px}
}

.page-login .login-section{background:transparent;color:#071217}
.page-login .login-section .card{border-radius:10px}
.page-login .login-section .card .card-title{color:#071217}
.page-login .login-section a{color:#071217}
.page-login .login-section a:hover{color:var(--accent)}

/* Ensure top-strip looks correct on login page (dark text instead of white) */
.page-login .top-strip{background:transparent;color:#071217}
.page-login .top-strip .top-right a{color:#071217}

/* Login split layout (branding + form) */
.login-split{display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:#fff}
.login-split{box-shadow:0 18px 40px rgba(2,6,11,0.08)}
.login-split .left-panel{
  /* background image + overlay for the left branding panel */
  background-image: url('../images/hero-images/hero2.png'), radial-gradient( circle at 20% 10%, rgba(10,60,95,0.18), transparent 20%), linear-gradient(180deg,#052c49 0%, #08344f 100%);
  color:#fff;
  min-height:600px;
  padding:48px 36px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
}
.login-split .left-panel img{filter:brightness(0) saturate(100%) invert(96%) sepia(4%) saturate(6%) hue-rotate(137deg) brightness(102%) contrast(102%);}
.login-split .left-panel h2{font-size:30px;line-height:1;margin-top:12px;color:#8fffcf;text-shadow:0 6px 18px rgba(3,18,30,0.25)}
.login-split .left-panel .benefits{margin-top:28px}
.login-split .left-panel .benefits li{color:rgba(255,255,255,0.9);font-weight:600;margin-bottom:12px}
.login-split .left-panel::after{
  content:'';position:absolute;left:8px;top:12px;bottom:12px;width:10px;background:repeating-linear-gradient(180deg,#06283f 0 8px, #0b3f5a 8px 16px);border-radius:6px;opacity:0.95}
.login-split .right-panel{padding:28px 32px;background:#fff}
.login-split .right-panel .btn-light{border:1px solid rgba(7,18,23,0.06);border-radius:8px}
.login-split .right-panel h4{color:#071217;font-weight:700}
.login-split .right-panel .form-control{border-radius:12px;background:#f4f6f9;border:1px solid #e6eef6;padding:14px 16px}
.login-split .right-panel .form-select{border-radius:12px;background:#f4f6f9;border:1px solid #e6eef6;padding:12px}
.login-split .right-panel .form-control::placeholder{color:#6b7b88}
.login-split .right-panel .row.g-2>.col-4 .form-select,
.login-split .right-panel .row.g-2>.col-4 .form-control{padding:10px}
.btn-otp{background:#bfeee0;color:#fff;border:none;font-weight:700;border-radius:10px;padding:14px}
.btn-otp:hover{background:#96e6c0}

/* responsive: side-by-side on large screens */
@media(min-width:992px){
  .login-split{flex-direction:row}
  .login-split .left-panel{flex:0 0 38%;max-width:38%;position:relative}
  .login-split .right-panel{flex:1}
}

/* on small screens make left panel hidden and add top radius to right panel */
@media(max-width:991px){
  .login-split .left-panel{display:none}
  .login-split .right-panel{border-radius:12px}
}


  /* Filter destination page styles */

  .filter-page .dest-top-search{
    background:#f7f7f7;
    padding:18px 0;
    border-bottom:1px solid rgba(7,18,23,0.03);
  }

  .filter-page .dest-top-search .container{
    display:flex;
    gap:12px;
    align-items:center;
  }

  .filter-page .dest-top-search input[type="search"]{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(7,18,23,0.06);box-shadow:none;background:#fff}
  .filter-page .dest-top-search .btn{border-radius:10px;padding:10px 16px}

  .filter-page .filter-page-container{
    display:grid;
    grid-template-columns:320px 1fr;
    gap:28px;
    align-items:start;
  }
  .filters-sidebar{padding:12px;border-radius:12px}
  .filters-sidebar h2{font-size:20px;margin-bottom:12px;font-weight:700;color:#071217;}
  .filters-sidebar .filter-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
  .refine-result{
    color:#6b6f77;font-weight:600
  }
  .filters-sidebar fieldset{border:0;padding:0;margin:10px 0 18px}
  .filters-sidebar legend{font-weight:700;color:#071217;margin-bottom:8px}
  .filters-sidebar label{display:block;color:#333;padding:8px 6px;border-radius:6px;cursor:pointer;font-size:15px}
  .filters-sidebar input[type="checkbox"]{margin-right:10px;transform:translateY(1px)}
  .filters-sidebar .btn{font-weight:700}
  .reset-btn-filter{
    background:transparent;border:0;color:#0b7fcf;
  }

  .results-column .results-list{display:flex;flex-direction:column;gap:18px}
  .result-col-main{
    background:#fff;border-radius:12px;padding:18px;border:1px solid rgba(7,18,23,0.04);box-shadow:0 12px 36px rgba(2,6,11,0.04);
  }
  .result-col-upper{
    display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;
  }
  .result-count{
    margin:0;color:#0b6bb3;font-weight:600;
  }
  .result-list{
    display:flex;flex-direction:column;gap:18px;
  }
  .results-column .destination-card{display:flex;gap:18px;align-items:flex-start;background:#fff;border-radius:14px;padding:14px;border:1px solid rgba(7,18,23,0.04);box-shadow:0 8px 30px rgba(2,6,11,0.04);
}
  .results-column .destination-card img{width:220px;height:150px;border-radius:12px;object-fit:cover;flex:0 0 220px}
  .results-column .destination-card .des{
    flex:1;display:flex;flex-direction:column;gap:8px;
  }
  
  .results-column .destination-card h4{font-size:18px;margin:0;color:#071217;
  font-weight:600;}
  .results-column .destination-card p{margin:0;color:#6b6f77}
  .results-column .destination-card .pill-main{
    display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;
  }
  .results-column .destination-card .pill{display:inline-block;background:#fff;border-radius:8px;padding:6px 10px;border:1px solid rgba(7,18,23,0.04);font-size:13px;color:#5b6370}
  .results-column .destination-card .des .card-bottom{
    display:flex;align-items:center;justify-content:space-between;margin-top:12px;
  }
  .results-column .destination-card .des .card-bottom .price{
    font-weight:700;font-size:20px;color:#071217;
  }
  .results-column .destination-card .des .card-bottom .price span{
    font-weight:400;font-size:13px;color:#6b6f77
  }
  .results-column .destination-card .btn{border-radius:10px;
  background:#ff7b6b;color:#fff;padding:10px 18px;text-decoration:none;}

  /* small helper for count header */
  .results-column > div > .results-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}

  /* Responsive: stack filters above results on narrow screens */
  @media (max-width:980px){
    .filter-page .filter-page-container{grid-template-columns:1fr;gap:18px}
    .filters-sidebar{order:1}
    .results-column{order:2}
    /* Make each card take full width when sidebar is hidden */
    .results-column .destination-card{flex-direction:column;gap:12px;width:100%}
    .results-column .destination-card img{width:100% !important;height:180px !important;flex:0 0 auto;border-radius:12px}
  }

  @media (max-width:600px){
    .filter-page .dest-top-search .container{padding:0 12px}
    .filter-page .dest-top-search input[type="search"]{padding:10px}
    .filter-page .filter-page-container{gap:12px}
    .results-column .destination-card{flex-direction:column}
    .results-column .destination-card img{width:100%;height:180px;flex:0 0 auto}
    .filters-sidebar label{font-size:14px}
  }

  /* Ensure filter labels appear one-per-line and inputs align */
  .filters-sidebar label{
    display:flex;
    align-items:center;
    gap:10px;
    padding:8px 6px;
    width:100%;
  }
  /* Also apply to cloned filters inside the mobile offcanvas */
  #mobileFiltersBody label{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 6px;
    width:100%;
    border-bottom:1px solid rgba(7,18,23,0.04);
  }
  #mobileFiltersBody label:last-child{border-bottom:0}
  .filters-sidebar input[type="checkbox"], #mobileFiltersBody input[type="checkbox"]{margin-right:8px;flex:0 0 auto}

  /* Mobile: hide left filters, show per-card filter toggle that opens offcanvas */
  @media (max-width:980px){
    .filters-sidebar{display:none}
    .destination-card{position:relative}
  }

  /* Mobile filter button placed under the search box */
  .mobile-filter-row{display:block}
  .mobile-filter-row{max-width:1200px;margin:8px auto 0;padding:0 16px}
  .mobile-filter-row .mobile-filter-inner{display:flex;justify-content:flex-end}
  .mobile-filter-btn{display:none;border-radius:10px;background:#fff;border:1px solid rgba(7,18,23,0.06);color:#071217;padding:8px 12px;font-weight:700}
  .mobile-filter-btn i{color:#0b6bb3}
  @media (max-width:980px){
    .mobile-filter-btn{display:inline-flex;align-items:center;gap:8px}
  }




