:root{
  /* Brand */
  --brand:#0076A3;         /* primary */
  --brand-2:#22d3ee;       /* accent  */
  /* Surface & text */
  --light:#F1F7FF;
  --bg:#f8fafc;
  --bg-dim:#F3F4F8;
  --ink:#0f172a;
  --muted:#64748b;
  --dark:#0b1220;
  /* State */
  --success:#10b981;
  --warning:#f59e0b;
  --danger:#ef4444;
  /* Layout tokens */
  --border:#e2e8f0;
  --radius:7px;
  --shadow:0 10px 25px rgba(2,6,23,.15);
  /* Hero overlay tuneables */
  --overlay-hero-top: rgba(2,6,23,.55);
  --overlay-hero-mid: rgba(2,6,23,.15);
  --overlay-hero-btm: rgba(2,6,23,.65);
}
/* ================================
   2) BASE
=================================== */
html,body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;color:var(--ink);background:var(--bg)}
p{text-align:justify;}
h1, h2,h3,h4,h5,h6{font-family:'poppins',sans-serif; color: var(--brand); line-height: 1.35;}
h1{font-size:2rem; font-weight: 700;}
h2{font-size:1.5rem; font-weight: 700;}
h3{font-size:1.25rem; font-weight: 700;}


a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:none;}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
img{max-width:100%;height:auto;display:block}
.sticky-top{z-index:1050!important}
@media (min-width:1300px){ .container{max-width:1300px} }
.header-spacer{height:120px}
@media (max-width:991.98px){ .header-spacer{height:84px} }
.card h3{color:var(--brand);font-size:1.1em;font-weight:600}
/* ================================
   3) TOPBAR / NAVBAR
=================================== */
.topbar{background:linear-gradient(90deg,rgba(11,18,32,.98),rgba(11,18,32,.92));color:#e5e7eb;border-bottom:1px solid rgba(226,232,240,.08)}
.link-plain{color:#e5e7eb}.link-plain:hover{color:var(--brand)}

.navbar.fixed-top{top:0;left:0;right:0;background:#fff;color:var(--ink)}
.site-navbar{transition:background .25s,box-shadow .25s,backdrop-filter .25s;background:transparent;border-bottom:1px solid transparent}
.site-navbar.scrolled{background:var(--light);backdrop-filter:saturate(160%) blur(10px);border-bottom-color:rgba(226,232,240,.08);box-shadow:0 6px 20px rgba(2,6,23,.22)}
.brand-mark {display: inline-block;max-width: 200px; /* Default size on desktops */ height: auto;     /* Keeps image ratio */ vertical-align: middle;
  object-fit: contain; transition: all 0.3s ease-in-out;}
.site-navbar.scrolled .brand-mark{height:auto; min-width: 150px;}
.brand-text{font-weight:800;letter-spacing:.2px;color:#0a5e80}
.navbar .nav-link{color:var(--ink);font-weight:700;padding:30px 5px}
.navbar .nav-link:hover,.navbar .nav-link:focus{color:var(--brand);text-decoration:none}
.navbar .dropdown-toggle::after{margin-left:.35rem;vertical-align:.12em}
/* Right actions */
.nav-actions{display:flex;align-items:center;gap:.5rem;margin-left:.5rem}
.nav-search-btn{border:none;background:transparent;color:#0b1220;font-size:1.1rem;width:40px;height:40px;display:grid;place-items:center;border-radius:999px}
.nav-search-btn:hover{background:rgba(2,6,23,.06)}
.social-row a{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--border);border-radius:999px;margin-left:6px;color:#0b132a;background:#fff}
.social-row a:hover{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent}
.social-mini{display:inline-grid;place-items:center;width:36px;height:36px;margin-left:6px;border-radius:999px;color:#fff}
.social-mini:hover{background:rgba(255,255,255,.1)}
/* ================================
   4) MEGA MENU (WHITE + THEME)
=================================== */
.mega-parent{position:static}
.mega-parent .dropdown-menu.mega-menu{
  position:absolute;z-index:1045;left: 50%!important;top:calc(100% - 30px) !important;transform:translateX(-50%)!important;transform-origin:top center;width:min(1260px,96vw);margin-top:0;padding:20px;border:0;border-radius:18px;background:#fff;box-shadow:0 20px 40px rgba(2,6,23,.15);animation:menuDrop .18s ease;height: 80vh;overflow-y: scroll;
}
.mega-parent .dropdown-menu.mega-menu::before{content:"";position:absolute;left:0;right:0;top:-20px;height:20px;background:transparent}
.mega-parent .dropdown-menu.mega-menu.show{left:50%!important;top:calc(100% - 15px)!important;transform:translateX(-50%)!important}
@keyframes menuDrop{from{opacity:0;transform:translateX(-50%) translateY(-6px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.mega-inner{position:relative;z-index:2}
.mega-col{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px;height:100%;box-shadow:0 4px 12px rgba(2,6,23,.05);transition:transform .18s,box-shadow .18s}
.mega-col:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(2,6,23,.08)}
.mega-title{margin:0 0 .65rem;font-weight:800;font-size:1rem;color:var(--brand)}
.mega-label{display:inline-block;padding:.18rem .5rem;font-size:.72rem;font-weight:700;letter-spacing:.02em;color:var(--brand);background:rgba(14,165,233,.08);border:1px solid rgba(14,165,233,.18);border-radius:999px}
.mega-divider{height:1px;background:var(--border);margin:.6rem 0}

.mega-list{list-style:none;margin:0;padding:0}
.mega-list>li{margin:.35rem 0; list-style: none;}
.mega-list a{position:relative;display:flex;align-items:center;gap:.5rem;font-weight:400;color:var(--ink);text-decoration:none;padding:.25rem .25rem;border-radius:8px;transition:padding .18s,background .18s,color .18s,box-shadow .18s}
.mega-list a::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--warning);position:absolute;left:6px;top:50%;transform:translateY(-50%) scale(.6);opacity:0;transition:transform .18s,opacity .18s}
.mega-list a:hover,.mega-list a:focus-visible{color:#0b132a;background:linear-gradient(90deg,rgba(14,165,233,.08),rgba(34,211,238,.06));padding-left:calc(.25rem + 15px);box-shadow:0 2px 10px rgba(2,6,23,.06) inset}
.mega-list a:hover::before,.mega-list a:focus-visible::before{opacity:1;transform:translateY(-50%) scale(1)}
.mega-list .badge{margin-left:auto;font-size:.7rem;border-radius:6px;padding:.15rem .45rem;background:var(--brand-2);color:#fff}
.mega-list ul{list-style:none;margin:.3rem 0 .3rem .9rem;padding-left:.6rem;border-left:2px solid var(--border)}
.mega-list .has-children{position:relative;padding-right:18px}
.mega-list .has-children::after{content:"›";position:absolute;right:2px;top:50%;transform:translateY(-50%);opacity:.45;transition:opacity .15s,transform .15s}
.mega-list .has-children:hover::after{opacity:.8;transform:translateY(-50%) translateX(2px)}

.mega-mini{display:flex;gap:.7rem;align-items:center;border:1px solid var(--border);border-radius:14px;padding:10px;background:#fff;transition:transform .18s,box-shadow .18s,border-color .18s}
.mega-mini:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,6,23,.10);border-color:#cfeaf7}
.mega-mini .thumb{width:78px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;flex:none}
.mega-mini .thumb img{width:100%;height:100%;object-fit:cover}
.mega-mini h5{margin:0;font-size:.95rem;font-weight:700;color:var(--ink)}
.mega-mini .mini-meta{margin:2px 0 0;font-size:.82rem;color:var(--muted)}
/* ===== Tablet & Below ===== */
@media (max-width: 992px) {
  .topbar {text-align: center; font-size: 0.8rem; padding: 0.35rem 0;}
  .topbar .container {flex-direction: column;gap: 0.35rem;}
  .topbar .small { font-size: 0.8rem;}
  .topbar .social-row {margin-top: 0.25rem;}
  .brand-mark {  max-width: 150px;}
  .mega-parent:hover>.dropdown-menu,
  .mega-parent:focus-within>.dropdown-menu{display:block}
  .mega-parent .dropdown-menu.mega-menu{position:static;transform:none;width:100%;border-radius:12px;margin-top:.5rem;padding:10px}
  .mega-col{padding:12px}
}
/* ===== Mobile ===== */
@media (max-width: 576px) {
   .brand-mark {  max-width: 120px;  margin-right: 8px; /* replaces .me-2 if Bootstrap isn't used */ }
  .topbar {font-size: 0.78rem;}
  .topbar .small {display: block;margin-bottom: 0.25rem;white-space: normal; /* allow wrapping */text-align: center;}
  .topbar .social-row {margin-top: 0.4rem;}
  .topbar .social-row a {margin: 0 0.3rem;font-size: 1rem;}  
}
@media(max-width:1023px){
.mobile-mega .m-link.has-children span:after{transform:none;content:"\f067";display: inline-block;font: normal normal normal 14px / 1 FontAwesome;border:0;margin-left: 0;vertical-align: text-bottom;float:right;background: #e7e7e7;padding: 4px 5px;border-radius: 4px;color:#00468c;}
.mobile-mega .m-link.has-children.show span:after{content:"\f068"}
}

/* Offcanvas Mobile Menu (optional) */
.offcanvas-90{width:90vw;max-width:480px}
.mobile-mega{padding:10px 16px;}
.mobile-mega li{border-bottom: solid 1px #eee;}
.mobile-mega .m-level{list-style:none;margin:0;padding:0}
.mobile-mega .m-link{padding:12px 6px;border-bottom:1px solid var(--border);background:none;border:none;text-align:left;color:var(--ink);font-weight:600;display: block;}
.fw-600{font-weight:600;}
/*.mobile-mega .m-link.has-children::after{content: "+";font-weight: 900;transform: translateX(2px);background: #d7d7d7;width: 20px;height: 20px;display: flex;justify-content: center;align-items: center;border-radius: 4px;}*/
.mobile-mega .m-level .m-level{display:none;padding-left:10px;border-left:2px solid var(--border)}
.m-social a{display:inline-grid;place-items:center;width:36px;height:36px;border:1px solid var(--border);border-radius:999px;color:#0b132a;margin-right:6px;background:#fff}
.m-social a:hover{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent}
.m-pay img{height:28px;margin-right:10px}
/* ================================
   5) SEARCH OVERLAY
=================================== */
.search-overlay{position:fixed;inset:0;background:rgba(11,18,32,.86);backdrop-filter:blur(4px);display:none;z-index:1080}
.search-overlay.show{display:block}
.search-overlay .inner{min-height:100%;display:grid;place-items:center;padding:2rem}
.search-card{width:min(900px,92vw);background:#0b1220;border-radius:16px;box-shadow:0 20px 50px rgba(2,6,23,.35);padding:1.25rem;border:1px solid rgba(255,255,255,.08)}
.search-card .title{color:#fff;font-weight:800;font-size:1.25rem;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.search-form{display:flex;gap:.5rem}
.search-form .form-control{padding:.9rem 1rem;font-size:1.05rem;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0f172a;color:#fff}
.search-form .form-control::placeholder{color:#94a3b8}
.search-close{position:absolute;top:1rem;right:1rem;background:transparent;border:none;color:#fff;font-size:1.75rem;line-height:1;opacity:.85}
.search-hint{color:#cbd5e1;font-size:.9rem;margin-top:.75rem;opacity:.9}
@media (max-width:576px){ .search-form{flex-direction:column} .search-form .btn{width:100%} }
/* ================================
    BACKGROUNDS
=================================== */
  .bg-light{background:var(--light);}
  .bg-dim{background:var(--bg-dim);}
  .bg-dark{background:  var(--dark);}
  .txt-white{color:#fff;}
/* ================================
   6) BUTTONS
=================================== */
.btn-brand{background:linear-gradient(90deg,var(--brand),var(--brand-2));border:none;color:#fff}
.btn-brand:hover{opacity:.92;color:#fff}
.btn-outline-brand{border:2px solid var(--brand);color:var(--brand);font-weight:700;background:transparent}
.btn-outline-brand:hover{background:var(--brand);color:#fff}
/* ================================
   7) SLICK ESSENTIALS (BASELINE)
=================================== */
.slick-slider{position:relative;display:block;box-sizing:border-box;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-track{position:relative;top:0;left:0;display:block}
.slick-slide{display:none;float:left;height:100%;min-height:1px}
.slick-initialized .slick-slide{display:block}
.slick-arrow{position:absolute;z-index:3}
/* ================================
   8) HERO (Slick-based, merged)
      – Full width • Aspect via min-height
=================================== */
.hero{position:relative;overflow:hidden}
.hero-slider{position:relative}
.hero-slide{position:relative;min-height:62vh}
@media (min-width:992px){ .hero-slide{min-height:76vh} }
.hero-slide .hero-bg{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;filter:saturate(1.05) brightness(.95);
}
/* Single overlay layer (fixes “overlapped by black color”) */
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,var(--overlay-hero-top) 0%,var(--overlay-hero-mid) 50%,var(--overlay-hero-btm) 100%);
}
/* Caption panel */
.hero-caption{
  position:absolute;left:50%;bottom:8%;transform:translateX(-50%);
  z-index:2;width:min(1100px,92%);color:#fff;
  background:rgba(0,0,0,.34); /* balanced transparency */
  padding:2rem;border-radius:.75rem;box-shadow:0 6px 20px rgba(0,0,0,.25);
}
/* Animated caption */
.hero-caption{opacity:0;transform:translate(-50%,16px)}
.hero-caption.is-in{animation:capIn .6s ease-out both}
@keyframes capIn{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}
.badge-soft{display:inline-block;font-size:.8rem;padding:.35rem .65rem;border-radius:999px;background:rgba(14,165,233,.18);border:1px solid rgba(14,165,233,.35);color:#e6faff;font-weight:700}
.hero-title{margin:.6rem 0 .35rem;font-weight:800;font-size:clamp(1.4rem,3.2vw,2.4rem);line-height:1.15}
.hero-title .brand{color:var(--brand)}
.hero-sub{margin:0 0 .9rem;font-size:clamp(.9rem,2vw,1.05rem);opacity:.98}
.hero-cta{display:flex;flex-wrap:wrap;gap:.6rem}
.btn-brand,.btn-ghost{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem .9rem;border-radius:999px;font-weight:600;text-decoration:none;transition:.25s}
.btn-brand:hover{background:#0594cf;transform:translateY(-1px)}
.btn-ghost{border:1px solid rgba(255,255,255,.35);color:#fff}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.12)}
/* External hero arrows (for your custom buttons) */
.hero-prev,.hero-next{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:42px;height:42px;border-radius:999px;
  border:1px solid var(--border);background:#fff;color:var(--ink);display:grid;place-items:center;box-shadow:var(--shadow)
}
.hero-prev{left:14px}.hero-next{right:14px}
/* Optional loader bar */
.hero-loader{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);width:90px;height:4px;border-radius:999px;overflow:hidden;background:#fff3;z-index:2}
.hero-loader:before{content:"";display:block;width:40%;height:100%;background:#fff;animation:loadbar 2.2s linear infinite}
@keyframes loadbar{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
/* ================================
   9) SECTIONS & CARDS
=================================== */
.section{padding:64px 0;animation: fadeInDown 1s ease-in-out;}
.section-title{font-weight:800}
.meta{color:var(--muted);font-weight:600;font-size:.95rem}
.price{font-weight:700;font-size:1rem}
.card-smooth{border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 2px 14px rgba(2,6,23,.06);background:#fff;overflow:hidden}
.card-smooth{
  /* hover motion */
  transform: translateZ(0);
  transition: transform .3s cubic-bezier(.2,.8,.2,1),
              box-shadow .3s cubic-bezier(.2,.8,.2,1);
  will-change: transform, box-shadow;
}
.card-smooth:hover,
.card-smooth:focus-within{
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 16px 40px rgba(2,6,23,.12);
}
.card-media{position:relative}
.image-slot{display:block;position:relative}
.image-slot::before{content:"";display:block;aspect-ratio:16/9;width:100%}
.image-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card-badge{position:absolute;bottom: -1rem;right:.9rem;z-index:2;display:inline-flex;min-height: 60px;align-items:center;border-radius:var(--radius);}
.bg-success{background:var(--success); border-radius:var(--radius); padding:3px 7px;font-size:14px;font-weight:700;color:#fff;}
.bg-warning{background:var(--warning); border-radius:var(--radius);padding:3px 7px;font-size:14px;font-weight:700;color:#fff;}
.price span{font-size:1rem;}
.welcome{background:url(../images/mountain-bg.svg); background-position-x: 0%;  background-position-y: 0%; object-fit: cover;height: 100%; background-position: center;}
/* Why section (fixed invalid background syntax) */
#why{position:relative;}
#why::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(260px 120px at 100% 0, rgba(14,165,233,.10), transparent 60%),
    radial-gradient(260px 120px at 0 0, rgba(34,211,238,.10), transparent 60%);
  }
#why::after{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;pointer-events:none;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));opacity:.9;border-radius:0 0 8px 8px;
}
.why{background:var(--light);padding:15px;border-radius:10px}
.section-title span{color:var(--brand-2)}
.fa-solid{color:var(--brand-2)}
.kpi{border:1px dashed var(--border);border-radius:16px;padding:18px;background:#fff}
.kpi i{font-size:1.4rem}
/* Trip grid/cards */
.trip-grid{display:grid;gap:1.25rem}
@media (min-width:576px){ .trip-grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:992px){ .trip-grid{grid-template-columns:repeat(3,1fr)} }
.trip-card .card-media{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius)}
.trip-card .card-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform .6s ease}
.trip-card:hover .card-media img{transform:scale(1.06)}
.ribbon{position:absolute;top:.75rem;left:.75rem;z-index:3;display:inline-flex;align-items:center;gap:.4rem;background:var(--brand);color:#fff;font-weight:700;padding:.35rem .6rem;border-radius:999px;box-shadow:var(--shadow)}
.ribbon.warning{background:var(--warning)}
.ribbon.success{background:#16a34a}
.trip-card h3{font-size:1.05rem;line-height:1.35;margin-bottom:.35rem;font-weight:800}
.trip-card .card-body{display:flex;flex-direction:column}
.trip-meta{display:flex;flex-wrap:wrap;gap:.75rem 1rem;margin:.4rem 0 .8rem;color:var(--muted)}
.trip-meta .time,.trip-meta .date{font-size:clamp(14px,2.1vw,18px);line-height:1.3;font-weight:600}
.trip-meta i{opacity:.7;margin-right:.35rem}
.trip-foot{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:auto}
.trip-price{font-weight:800;font-size:1.1rem;color:var(--ink)}
.badge-tag{background:#0f172a0f;color:var(--ink);border:1px solid var(--border);padding:.25rem .5rem;border-radius:999px;font-weight:700}
/* ================================
   10) CAROUSELS (Activities / Trips)
=================================== */
.title.two-col{display:flex;align-items:end;justify-content:space-between;gap:1.5rem;margin-bottom:1.25rem}
.subtitle{display:inline-block;color:var(--brand);font-weight:700;letter-spacing:.02em;margin-bottom:.25rem}
.slick-nav,.t-nav{display:flex;gap:.5rem}
.slick-prev-btn,.slick-next-btn,.t-prev,.t-next{
  display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--border);
  color:#0b132a;box-shadow:0 2px 8px rgba(2,6,23,.06);cursor:pointer;transition:all .2s ease
}
.slick-prev-btn:hover,.slick-next-btn:hover,.t-prev:hover,.t-next:hover{
  background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent
}
.icon-rotate-45{transform:rotate(45deg)}
.icon-rotate-135{transform:rotate(135deg)}
.activity-carousel .slick-list{margin:0 -12px}
.activity-carousel .slick-slide{margin:0 12px}
.activity-carousel .slick-prev:before,.activity-carousel .slick-next:before{display:none}
/* Trip carousel (if using Slick on trips) */
.trip-carousel .slick-list{margin:0 -12px}
.trip-carousel .slick-slide{margin:0 12px}
.trip-carousel .slick-prev:before,.trip-carousel .slick-next:before{display:none}
.trip-carousel .slick-arrow{top:-58px}
.trip-carousel .slick-prev{left:auto;right:54px}
.trip-carousel .slick-next{right:10px}
/* ===== Header arrow buttons (Trek/Tour) ===== */
.title-row.with-arrows {
  display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:1rem;
}
.title-arrow {
  border:0; background: var(--brand); color:#fff;
  width:40px; height:40px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  transition: transform .15s ease, opacity .2s ease, background .3s ease;
}
.title-arrow:hover { background:#0284c7; transform:translateY(-1px); }
.title-arrow:disabled { opacity:.4; cursor:not-allowed; }
/* ===== Trip carousels (shared gutters) ===== */
.trip-carousel .slick-list{ margin:0 -12px; }
.trip-carousel .slick-slide{ margin:0 12px; }
.trip-carousel .slick-prev:before,
.trip-carousel .slick-next:before{ display:none; }
/* Optional: move default slick arrows up, if you also show them there */
.trip-carousel .slick-arrow{ top:-58px; }
.trip-carousel .slick-prev{ left:auto; right:54px; }
.trip-carousel .slick-next{ right:10px; }
/* Small screens: narrower cards */
@media (max-width: 576px){
  .trip-card { flex-basis: 260px; }
}
/* ===== Title row ===== */
    .title.two-col{display:flex;align-items:flex-end;justify-content:space-between;gap:1.25rem;margin:1.25rem 0}
    .subtitle{color:var(--brand);font-weight:700;letter-spacing:.02em;display:inline-block;margin-bottom:.25rem}
    .section h2{margin:0;font-weight:900}
    /* Card look */
  .activity-card{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff}
  .activity-card .media{aspect-ratio:16/10;background:#f1f5f9}
  .activity-card img{width:100%;height:100%;object-fit:cover;display:block}
  .activity-card .body{padding:12px 14px}
  .activity-card h3{margin:6px 0 4px;font-size:1rem}
  .activity-card p{margin:0;color:#475569;font-size:.95rem}
  /* Slick gutters */
  .activity-slider .slick-list{margin:0 -10px}
  .activity-slider .slick-slide{margin:0 10px}
  /* Optional: hide default dots (keep if you set dots:true) */
  /* .slick-dots{display:none !important;} */
/* ================================
   11) TRIP OF THE DAY
=================================== */
.trip-of-month{background: var(--brand);}
.trip-of-month .title-center{margin-bottom: 15px;}
.tom-media img{border-radius:12px;width:100%;height:100%;object-fit:cover}
.tom-body{padding: 15px;}
@media (max-width:992px){ .trip-of-day .tod-wrap{grid-template-columns:1fr} }
/* ================================
   12) COLLAGE (12×6)
=================================== */
.collage12x6{padding:48px 0;}
.grid-12x6{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(6,1fr);gap:16px;width:100%;height:clamp(520px,68vh,820px);position:relative}
.tile{position:relative;display:block;width:100%;height:100%;border-radius:var(--radius);overflow:hidden;background:#000;box-shadow:var(--shadow);text-decoration:none;color:inherit;isolation:isolate;transition:transform .25s,box-shadow .25s}
.tile:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(2,6,23,.16)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform .35s}
.tile:hover img{transform:scale(1.08)}
.tile .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,6,23,0) 45%,rgba(2,6,23,.55) 85%,rgba(2,6,23,.75) 100%);display:flex;align-items:flex-end;padding:14px;pointer-events:none}
.tile .overlay h3{margin:0;font-size:clamp(1rem,1.4vw,1.25rem);font-weight:800;line-height:1.15;color:#fff;border-bottom:2px solid transparent;display:inline-block}
.tile:hover .overlay h3{border-bottom-color:var(--brand)}
.tA{grid-column:1 / span 6;grid-row:1 / span 4}
.tB{grid-column:1 / span 3;grid-row:5 / span 2}
.tC{grid-column:4 / span 3;grid-row:5 / span 2}
.tD{grid-column:7 / span 3;grid-row:1 / span 3}
.tE{grid-column:7 / span 3;grid-row:4 / span 3}
.tF{grid-column:10 / span 3;grid-row:1 / span 2}
.tG{grid-column:10 / span 3;grid-row:3 / span 2}
.tH{grid-column:10 / span 3;grid-row:5 / span 2}
/* ================================
   13) TESTIMONIALS
=================================== */
/* ===== Testimonials (Slick) ===== */
.testimonials { background: var(--bg); }
.testimonial-slider { position: relative; }
.testimonial-slider .slick-list { margin: 0 -12px; }
.testimonial-slider .slick-slide { margin: 0 12px; }
.testimonial-slider .slick-dots { bottom: -28px; }
.testimonial-slider .slick-prev:before,
.testimonial-slider .slick-next:before { display: none; }
/* Cards (rely on your tokens) */
.t-card{
  position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:18px 18px 20px;display:flex;flex-direction:column;gap:12px;
  transition:transform .25s ease,box-shadow .25s ease
}
.t-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,6,23,.12)}
.t-card .t-accent{content:"";position:absolute;inset:0 0 auto 0;height:3px;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));
  border-top-left-radius:calc(var(--radius) - 1px);border-top-right-radius:calc(var(--radius) - 1px)
}
.t-header{display:flex;align-items:center;gap:12px}
.t-avatar{width:56px;height:56px;border-radius:999px;object-fit:cover;border:2px solid var(--bg);
  box-shadow:0 2px 10px rgba(2,6,23,.08)}
  .t-name{margin:0;font-weight:800;color:var(--ink);font-size:1rem}
.t-address{color:var(--muted);font-size:.9rem}
.t-rating{display:flex;align-items:center;gap:.5rem}
.t-score{font-weight:700;color:var(--ink);font-size:.95rem}
.stars{--rating:4.8;position:relative;display:inline-block;font-size:1rem;line-height:1;letter-spacing:2px}
.stars::before{content:"★★★★★";color:var(--border)}
.stars::after{content:"★★★★★";position:absolute;left:0;top:0;width:calc(var(--rating)/5*100%);overflow:hidden;color:var(--warning);white-space: nowrap;}
.t-review{margin:0;color:var(--ink);font-size:.975rem;line-height:1.6}
/* Title nav buttons (reuse your style) */
.t-nav{display:flex;gap:.5rem}
.t-prev,.t-next{
  display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--border);
  color:#0b132a;box-shadow:0 2px 8px rgba(2,6,23,.06);cursor:pointer;transition:all .2s ease
}
.t-prev:hover,.t-next:hover{
  background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent
}
/* Responsive */
@media (max-width:992px){
  .testimonial-slider .slick-list{ margin: 0 -8px; }
  .testimonial-slider .slick-slide{ margin: 0 8px; }
}
/* ================================
   14) FOOTER
=================================== */
#expeditions{background:  url(../images/map-bg.webp);}
.footer-white .footer-social a{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--border);border-radius:999px;margin-right:8px;color:#0b132a;background:#fff;transition:.2s}
.footer-white .footer-social a:hover{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent}
.icons ul{display:flex;align-items:center;gap:1rem;list-style:none;padding:0;margin:0}
.icons ul li{display:flex;align-items:center;justify-content:center;border:2px solid var(--brand);border-radius:8px;padding:6px;background:#fff;transition:.25s}
.icons ul li img{display:block;max-height:40px;max-width:60px;object-fit:contain}
.icons ul li:hover{background:var(--brand);border-color:var(--brand-2)}
.icons ul li:hover img{filter:brightness(0) invert(1)}
.pay-row img{height:34px;margin-right:10px}
.footer-bottom{padding:15px 0;color:#fff;background:#405a79}
/* ================================
   15) MOBILE QUICKBAR
=================================== */
.quickbar{position:fixed;bottom:0;left:0;right:0;z-index:999;background:#0b1220}
.quickbar .btn{border-radius:0;text-decoration:none;}
/* ================================
   16) LAZY IMAGE PLACEHOLDER
=================================== */
img.lazy{background:linear-gradient(90deg,#f1f5f9 0%,#e2e8f0 50%,#f1f5f9 100%);background-size:200% 100%;animation:imgShimmer 2s linear infinite}
img.lazy.slick-lazyload-error{opacity:.4}
.slick-loading .slick-slide img{visibility:hidden}
@keyframes imgShimmer{0%{background-position:0 0}100%{background-position:-200% 0}}
/* ================================
   17) RESPONSIVE BREAKPOINTS
=================================== */
/* -------- Desktop (≥ 992px) -------- */
/* (Most desktop styles are already default above) */
/* -------- Tablet (576px–991px) -------- */
@media (max-width:991.98px){
  .title.two-col{flex-direction:column;align-items:flex-start}
  .title-row{flex-direction:column;align-items:flex-start}
  .grid-12x6{grid-template-columns:1fr 1fr;grid-template-rows:none;height:auto}
  .tile{grid-column:auto;grid-row:auto;aspect-ratio:4/3}
  .tA{aspect-ratio:16/10}
  .section{padding:48px 0}
}
/* -------- Mobile (≤ 575px) -------- */
@media (max-width:575.98px){
  .grid-12x6{grid-template-columns:1fr;gap:14px}
  .tile{border-radius:14px;aspect-ratio:4/3}
  .tA{aspect-ratio:16/9}
  .section{padding:40px 0}
  .price{font-size:1.15rem}
  .hero-caption{padding:1.25rem}
  .hero-title{font-size:clamp(1.2rem,6vw,1.8rem)}
}
/* ================================
   18) REDUCED MOTION
=================================== */
@media (prefers-reduced-motion:reduce){
  .site-navbar,.tile,.t-card,.hero-caption,.hero-title,.hero-sub,.brand-mark,
  .mega-col,.mega-mini,.mega-list a{transition:none;animation:none}
}
.navbar-expand-lg .navbar-nav .dropdown-menu li {list-style: none;}
.navbar-expand-lg .navbar-nav .dropdown-menu li .second-drop{list-style:none;border: 1px solid #ccc; border-radius:4px;display: none;  position: absolute;top: 0px;left: 100%;background: #fff!important;}
.navbar-expand-lg .navbar-nav .dropdown-menu li .second-drop ul li a{color: #333;white-space:nowrap;}
.navbar-expand-lg .navbar-nav .dropdown-menu li .second-drop ul li{padding: 10px 20px;color: #fff;border-bottom: 1px solid #e5e5e5;font-size: 15px;}
.navbar-expand-lg .navbar-nav .dropdown-menu li .second-drop ul li:hover{background: #fff;background: #f9f9f9;}
.navbar-expand-lg .navbar-nav .dropdown-menu li .second-drop ul li:hover a{color: #333!important;}
.navbar-expand-lg .navbar-nav .dropdown-menu li:hover .second-drop{display: block;}
.navbar-expand-lg .navbar-nav .dropdown-menu .second-drop ul li:hover .third-drop{display: block;}
.navbar-toggler{background: linear-gradient(90deg, rgba(11, 18, 32, .98), rgba(11, 18, 32, .92));}
.package-card.trek-card{background: #fff;transform: translateZ(0);
    transition: transform .3s 
    cubic-bezier(.2, .8, .2, 1), box-shadow .3s 
cubic-bezier(.2, .8, .2, 1);
    will-change: transform, box-shadow;}
    .package-card.trek-card .card-body{padding: 1rem;}
.package-card.trek-card h3.card-title {
    color: var(--brand);
    font-size: 1.1em;
    font-weight: 600;
    margin-bottom: .5rem;
  }
.package-card.trek-card:hover,
.package-card.trek-card:focus-within{
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 16px 40px rgba(2,6,23,.12);
}
/* ================================
   19) Inner Pages
=================================== */
  .page-nav{background:#0077a4; padding:9px 0px 7px 0px; color:#fff;}
  .page-nav a{color:#efefef;}
  .page-nav .active{color:#000;}
  .page-hero{position:relative; max-height: 650px; overflow: hidden;}
  .page-hero img{width:100%; object-fit: cover; height:auto;}
  .page-hero .title{position:absolute; bottom:5%; margin-left: 10%; text-align:  center; padding:10px;   background: rgba(0,0,0,0.35); width:fit-content; color: #fff; }
  .page-hero .title  h1{font-weight:900; color: #fff; }

  .action-buttons{display: flex; justify-content:space-between; margin-top: 10px;}
  .action-buttons a{text-align: center; border-radius:var(--radius); color: #fff; padding: 5px 10px; width:49%;}
  .action-buttons-1 .fa-solid{color: #fff;}
  .expert{margin-top: 15px;}
  .call-button{display: flex; justify-content:space-between; margin-top: 10px;padding: 15px;}
  .expert .fa-solid{color: #fff;}
  .call-button a{width: 32%; padding: 5px 10px; text-align: center; border-radius:var(--radius); color: #fff;}
  .call-button .whatsapp {background: #54cf61;}
  .call-button .viber {background: #9168ae;}
  .call-button .email {background: #df413d;}
  .pagination a{display:inline-block;margin-bottom:5px;}
  
  .it-head{padding-top: 30px; display: flex;align-items: center;justify-content: space-between;}
  .it-head span{display: block;color: #fff; font-size: 16px;font-weight: 600;padding: 5px 15px;border-radius: 4px;background-image: linear-gradient(to right, #003772 , #0368cd)!important;}
  .it-head .all-expan{transition: 0.4s all ease-in-out; cursor: pointer; font-weight: 500;background-image: linear-gradient(to right, #003772 , #0368cd)!important;font-size: 16px;padding: 5px 15px;border-radius: 21px;color: #fff;}
  .it-head .close-expan{transition: 0.4s all ease-in-out; display: none;cursor: pointer; font-weight: 500;background-image: linear-gradient(to right, #ff0000 , #0368cd)!important;font-size: 16px;padding: 5px 15px;border-radius: 21px;color: #fff;}
  .it-head .close-expan i{transition: 0.4s all ease-in-out; transform: rotate(45deg);}
.h1{font-size:2.25rem; font-weight: 700;}
.h2{font-size:1.5rem;}
.h3{font-size:1.25rem;}
.package-page .h1,
.package-page .h2,
.package-page .h3 {
    position: relative;
    padding-left: 15px; /* space for bar */
    color: #0076A3;
    margin-bottom: 20px;
}

.package-page .h1::before,
.package-page .h2::before,
.package-page .h3::before
{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 7px;
    background-color: var(--brand-2);
    border-radius: 2px;
    border-right: 3px solid var(--brand);
}
  table {width: 100%;border-collapse: collapse;margin-bottom: 1rem;  background-color: #fff;}
  table th,table td {padding: 5px 7px;border: 1px solid #efefef;text-align: left;}
  /* Striped rows */
  table tr:nth-of-type(odd) {background-color: #f9f9f9; /* light grey for odd rows */}
  /* Hover effect */
  table tr:hover {background-color: #f1f1f1;transition: background-color 0.2s ease;}
  .navbar-nav .nav-link.active, .navbar-nav .nav-link.show{color:#0f172a;}
  .fancybox__container{z-index:1061 !important;}
  .dropdown-menu{z-index:1062;min-width:200px;}
  .dropdown-item .fa-caret-right{float:right;position: relative;top: 6px;}
  #loader{display:none;}
  
  @media print {
      .not-on-print,.site-navbar,.offcanvas-90,.search-overlay,.pkg-nav-wrap,#photos,.quickbar{display:none !important;}
      .container{width:100%;max-width:100%;}
      #faqs .collapse,#info .collapse,#itinerary .collapse{display:block !important;}
      #ovText.ov-collapsed{max-height:auto;}
      #facts .col-12{width:33.33%;}
  }
  .inner p{text-align:center;}
  .post-media img{width:100%;height:300px;object-fit:cover}