/* =============================================================================
   HIH THEME — main.css  (Trevana-matched design)
   Replaces previous version. Design tokens now match the approved HTML mockup.
   Font: Jost (body) + Playfair Display (headings)
   Palette: Teal #1a9e75, Gold #e8a020, Dark #1a1a2e
   ============================================================================= */

/* =============================================================================
   DESIGN TOKEN OVERRIDES
   These override the generic variables in style.css to match the approved design.
   ============================================================================= */
:root {
  --hih-green:        #1a9e75;
  --hih-green-mid:    #0f6e56;
  --hih-green-light:  #e1f5ee;
  --hih-green-pale:   #f0faf6;
  --hih-orange:       #e8a020;
  --hih-orange-dark:  #c4860e;
  --hih-dark:         #1a1a2e;
  --hih-mid:          #636e72;
  --hih-muted:        #b2bec3;
  --hih-border:       #e8ecef;
  --hih-surface:      #ffffff;
  --hih-bg:           #f8f9fa;
  --font-body:        'Jost', -apple-system, sans-serif;
  --font-heading:     'Playfair Display', Georgia, serif;
  --radius:           12px;
  --radius-sm:        8px;
  --radius-full:      9999px;
  --shadow:           0 4px 20px rgba(0,0,0,0.08);
  --shadow-md:        0 8px 30px rgba(0,0,0,0.10);
  --shadow-lg:        0 16px 40px rgba(0,0,0,0.12);
  --nav-height:       70px;
}

/* =============================================================================
   BASE
   ============================================================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); color: var(--hih-dark); background: var(--hih-surface); line-height: 1.6; overflow-x: hidden; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
ul { list-style: none; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); color: var(--hih-dark); line-height: 1.2; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; top: -100%; left: 16px; z-index: 9999; padding: 8px 20px; background: var(--hih-dark); color: #fff; border-radius: var(--radius-sm); font-weight: 600; }
.skip-link:focus { top: 16px; color: #fff; }

/* =============================================================================
   SITE LAYOUT
   ============================================================================= */
.site-wrapper { display: flex; flex-direction: column; min-height: 100vh; }
.site-content { flex: 1; }
/* Header is position:sticky (in normal flow), so no padding-top offset needed on any page */
.section { padding: 72px 0; }
.section.bg-pale { background: var(--hih-bg); }
.section.bg-dark { background: var(--hih-dark); }

/* Section headers */
.section-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 36px; }
.section-eyebrow { font-size: 12px; font-weight: 600; color: var(--hih-green); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 8px; display: block; font-family: var(--font-body); }
.section-title { font-family: var(--font-heading); font-size: clamp(24px, 3vw, 32px); font-weight: 700; color: var(--hih-dark); line-height: 1.25; }

/* =============================================================================
   TOP BAR
   ============================================================================= */
.topbar { background: var(--hih-dark); color: rgba(255,255,255,0.75); font-size: 13px; padding: 8px 0; }
.topbar .container { display: flex; justify-content: space-between; align-items: center; }
.topbar-left { display: flex; gap: 20px; }
.topbar-left span { display: flex; align-items: center; gap: 6px; }
.topbar-right { display: flex; gap: 14px; }
.topbar-right a { color: rgba(255,255,255,0.6); font-size: 13px; transition: color .2s; }
.topbar-right a:hover { color: var(--hih-green); }

/* =============================================================================
   HEADER & NAV
   ============================================================================= */
.site-header {
  position: sticky; top: 0; z-index: 999;
  background: var(--hih-surface);
  border-bottom: 1px solid var(--hih-border);
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  transition: box-shadow .3s;
}
.site-header.scrolled { box-shadow: 0 4px 24px rgba(0,0,0,0.12); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; height: var(--nav-height); gap: 24px; }

/* Logo */
.site-header__brand a { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 700; color: var(--hih-green-mid); letter-spacing: -0.3px; text-decoration: none; font-family: var(--font-body); }
.site-header__brand .custom-logo { height: 44px; width: auto; }
.logo-icon { width: 38px; height: 38px; background: var(--hih-green); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: white; font-size: 18px; flex-shrink: 0; }
.logo-text span { color: var(--hih-orange); }

/* Nav */
.main-nav { display: flex; align-items: center; gap: 4px; }
.main-nav > ul { display: flex; align-items: center; gap: 4px; }
.main-nav .menu-item { position: relative; }
.main-nav .menu-item > a {
  display: flex; align-items: center; gap: 4px;
  padding: 8px 14px; font-size: 14.5px; font-weight: 500;
  color: #2d3436; border-radius: var(--radius-sm); transition: all .2s; cursor: pointer; font-family: var(--font-body);
}
.main-nav .menu-item > a:hover,
.main-nav .current-menu-item > a,
.main-nav .current-page-ancestor > a { color: var(--hih-green); background: var(--hih-green-light); }
.main-nav .menu-item-has-children > a::after { content: ''; display: inline-block; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; margin-left: 2px; transition: transform .2s; }
.main-nav .menu-item-has-children:hover > a::after { transform: rotate(180deg); }

/* Dropdown */
.main-nav .sub-menu { position: absolute; top: calc(100% + 8px); left: 0; min-width: 200px; background: var(--hih-surface); border: 1px solid var(--hih-border); border-radius: var(--radius); box-shadow: 0 12px 40px rgba(0,0,0,0.12); padding: 8px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .2s; z-index: 100; }
.main-nav .menu-item-has-children:hover > .sub-menu, .main-nav .menu-item-has-children:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.main-nav .sub-menu .menu-item a { display: block; padding: 8px 12px; font-size: 14px; color: #2d3436; border-radius: var(--radius-sm); transition: all .15s; font-family: var(--font-body); font-weight: 400; }
.main-nav .sub-menu .menu-item a:hover { background: var(--hih-green-light); color: var(--hih-green); padding-left: 16px; }

/* Nav CTA */
.nav-cta-btn { padding: 9px 22px; background: var(--hih-green); color: #fff !important; border-radius: var(--radius-full); font-size: 14px; font-weight: 600; transition: all .2s; white-space: nowrap; font-family: var(--font-body); }
.nav-cta-btn:hover { background: var(--hih-green-mid); transform: translateY(-1px); color: #fff !important; }

/* Mobile toggle */
.nav-toggle { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 40px; height: 40px; padding: 8px; background: transparent; border-radius: var(--radius-sm); flex-shrink: 0; transition: background .2s; }
.nav-toggle:hover { background: var(--hih-green-light); }
.nav-toggle__bar { display: block; height: 2px; background: var(--hih-dark); border-radius: 2px; transition: transform .25s, opacity .25s; transform-origin: center; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* =============================================================================
   MOBILE NAV
   ============================================================================= */
@media (max-width: 768px) {
  .nav-toggle { display: flex; }
  .topbar { display: none; }
  .nav-cta-btn { display: none; }  /* Hide Book Now on mobile */
  .main-nav {
    position: fixed; top: var(--nav-height); left: 0; right: 0; bottom: 0;
    background: var(--hih-surface); padding: 24px 24px 48px; overflow-y: auto;
    flex-direction: column; justify-content: flex-start; align-items: stretch;
    transform: translateX(100%); transition: transform .3s; z-index: var(--z-overlay, 300);
  }
  .main-nav.is-open { transform: translateX(0); }
  .main-nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
  .main-nav .menu-item > a { font-size: 16px; padding: 16px 8px; border-bottom: 1px solid var(--hih-border); border-radius: 0; }
  .main-nav .sub-menu { position: static; box-shadow: none; border: none; border-radius: 0; opacity: 1; visibility: visible; transform: none; padding: 0 0 0 16px; background: var(--hih-bg); display: none; }
  .main-nav .sub-menu.is-open { display: flex; flex-direction: column; }
  .main-nav .sub-menu .menu-item a { border-radius: 0; border-bottom: 1px solid var(--hih-border); }
}

/* =============================================================================
   BUTTONS
   ============================================================================= */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 24px; font-family: var(--font-body); font-size: 15px; font-weight: 600; border-radius: var(--radius-full); border: 1.5px solid transparent; cursor: pointer; text-decoration: none; transition: all .2s; white-space: nowrap; }
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--hih-green); color: #fff; border-color: var(--hih-green); }
.btn--primary:hover { background: var(--hih-green-mid); border-color: var(--hih-green-mid); color: #fff; }
.btn--outline { background: transparent; color: var(--hih-green); border-color: var(--hih-green); }
.btn--outline:hover { background: var(--hih-green); color: #fff; }
.btn--outline-white { background: transparent; color: #fff; border-color: rgba(255,255,255,0.7); }
.btn--outline-white:hover { background: #fff; color: var(--hih-dark); border-color: #fff; }
.btn--white { background: #fff; color: var(--hih-green-mid); border-color: #fff; }
.btn--white:hover { background: var(--hih-orange); color: var(--hih-dark); border-color: var(--hih-orange); }
.btn--gold { background: var(--hih-orange); color: var(--hih-dark); border-color: var(--hih-orange); }
.btn--gold:hover { background: var(--hih-orange-dark); border-color: var(--hih-orange-dark); }
.btn--whatsapp { background: #25d366; color: #fff; border-color: #25d366; }
.btn--whatsapp:hover { background: #1db954; border-color: #1db954; color: #fff; }
.btn--sm { font-size: 13px; padding: 7px 18px; }
.btn--lg { font-size: 16px; padding: 14px 32px; }
.btn--full { width: 100%; justify-content: center; }

/* Search button (square, inside search box) */
.btn-search { padding: 12px 28px; background: var(--hih-green); color: white; border: none; border-radius: var(--radius); font-family: var(--font-body); font-size: 15px; font-weight: 600; cursor: pointer; transition: all .2s; white-space: nowrap; display: flex; align-items: center; gap: 8px; }
.btn-search:hover { background: var(--hih-green-mid); }

/* WhatsApp Float */
.wa-float { position: fixed; bottom: 32px; right: 32px; z-index: 9000; width: 56px; height: 56px; background: #25d366; color: #fff; border-radius: var(--radius-full); display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 24px rgba(37,211,102,.4); transition: transform .25s, box-shadow .25s; opacity: 0; pointer-events: none; font-size: 26px; text-decoration: none; }
.wa-float.is-visible { opacity: 1; pointer-events: auto; }
.wa-float:hover { transform: scale(1.1); box-shadow: 0 10px 32px rgba(37,211,102,.5); color: #fff; }

/* =============================================================================
   HERO
   ============================================================================= */
.hero { position: relative; min-height: 620px; display: flex; align-items: center; overflow: hidden; background: var(--hih-dark); }
.hero__bg { position: absolute; inset: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(10,20,15,0.75) 0%, rgba(15,110,86,0.50) 60%, rgba(10,20,15,0.4) 100%); }
.hero__content { position: relative; z-index: 2; max-width: 680px; padding: 80px 0 60px; }
.hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.15); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,0.3); color: #fff; font-size: 13px; font-weight: 500; padding: 6px 14px; border-radius: var(--radius-full); margin-bottom: 20px; font-family: var(--font-body); }
.hero-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--hih-orange); flex-shrink: 0; }
.hero__title { font-family: var(--font-heading); font-size: clamp(38px, 5vw, 58px); line-height: 1.12; color: #fff; margin-bottom: 18px; }
.hero__title em { font-style: italic; color: var(--hih-orange); }
.hero__subtitle { font-size: 17px; color: rgba(255,255,255,0.85); max-width: 520px; margin-bottom: 32px; line-height: 1.7; }
.hero__stats { display: flex; gap: 28px; margin-top: 28px; }
.hero-stat { color: white; }
.hero-stat__num { font-size: 24px; font-weight: 700; display: block; font-family: var(--font-body); }
.hero-stat__label { font-size: 12px; color: rgba(255,255,255,0.65); }

/* Hero search box */
.hero-search { background: var(--hih-surface); border-radius: 16px; padding: 8px; display: flex; align-items: center; gap: 0; box-shadow: 0 8px 40px rgba(0,0,0,0.25); max-width: 640px; }
.search-field { flex: 1; display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-right: 1px solid var(--hih-border); }
.search-field:last-of-type { border-right: none; }
.search-field svg { color: var(--hih-green); flex-shrink: 0; }
.search-field__label { font-size: 11px; color: var(--hih-muted); font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px; line-height: 1; font-family: var(--font-body); }
.search-field select, .search-field input { border: none; outline: none; font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--hih-dark); background: transparent; cursor: pointer; width: 100%; padding: 0; }

/* Page hero (inner pages) */
.page-hero { position: relative; min-height: 320px; display: flex; align-items: flex-end; padding-bottom: 48px; background: var(--hih-dark); overflow: hidden; }
.page-hero__bg { position: absolute; inset: 0; }
.page-hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.page-hero__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(27,27,47,0.85) 0%, rgba(27,27,47,0.3) 100%); }
.page-hero__content { position: relative; z-index: 2; color: #fff; }
.page-hero__title { font-size: clamp(28px, 4vw, 46px); color: #fff; margin-bottom: 12px; }

/* =============================================================================
   BADGES
   ============================================================================= */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; font-size: 11px; font-weight: 600; border-radius: var(--radius-full); line-height: 1.4; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.5px; font-family: var(--font-body); }
.badge--green  { background: var(--hih-green); color: #fff; }
.badge--gold   { background: var(--hih-orange); color: var(--hih-dark); }
.badge--dark   { background: var(--hih-dark); color: #fff; }
.badge--muted  { background: #f3f4f6; color: var(--hih-mid); }
.badge--save   { background: #fef2f2; color: #e74c3c; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 4px; text-transform: none; letter-spacing: 0; }

/* =============================================================================
   TREK CARDS
   ============================================================================= */
.trek-card { background: var(--hih-surface); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--hih-border); transition: all .25s; position: relative; display: flex; flex-direction: column; }
.trek-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(0,0,0,0.12); border-color: transparent; }
.trek-card__image { position: relative; height: 200px; overflow: hidden; }
.trek-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.trek-card:hover .trek-card__image img { transform: scale(1.06); }
.trek-card__badges { position: absolute; top: 12px; left: 12px; display: flex; gap: 6px; }
.trek-card__wishlist { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--hih-muted); transition: color .2s; font-size: 16px; border: none; }
.trek-card__wishlist:hover, .trek-card__wishlist.is-wishlisted { color: #e74c3c; }
.trek-card__body { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.trek-card__meta { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--hih-mid); }
.trek-card__location, .trek-card__duration { display: flex; align-items: center; gap: 4px; }
.trek-card__title { font-size: 15px; font-weight: 600; color: var(--hih-dark); line-height: 1.4; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-family: var(--font-body); }
.trek-card__title a:hover { color: var(--hih-green); }
.trek-card__footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--hih-border); }
.trek-card__rating { display: flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 600; color: var(--hih-dark); }
.trek-card__stars { color: var(--hih-orange); font-size: 12px; }
.trek-card__price { text-align: right; }
.trek-card__price-from,
.trek-price-from { font-size: 11px; color: var(--hih-mid); }
.trek-card__price-value { font-size: 18px; font-weight: 700; color: var(--hih-green-mid); font-family: var(--font-body); }

/* Trek grid */
.trek-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.trek-grid--3col { grid-template-columns: repeat(3, 1fr); }

/* =============================================================================
   SPECIAL OFFERS
   ============================================================================= */
.offers-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.offer-card { position: relative; border-radius: var(--radius); overflow: hidden; height: 200px; cursor: pointer; }
.offer-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.offer-card:hover img { transform: scale(1.06); }
.offer-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.1) 60%); display: flex; flex-direction: column; justify-content: flex-end; padding: 20px; }
.offer-badge { display: inline-block; background: var(--hih-orange); color: var(--hih-dark); font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: var(--radius-full); margin-bottom: 8px; text-transform: uppercase; font-family: var(--font-body); }
.offer-title { font-size: 18px; font-weight: 700; color: white; margin-bottom: 4px; font-family: var(--font-heading); }
.offer-subtitle { font-size: 13px; color: rgba(255,255,255,0.8); margin-bottom: 10px; }
.offer-link { font-size: 13px; font-weight: 600; color: var(--hih-green-light); display: flex; align-items: center; gap: 4px; font-family: var(--font-body); }

/* =============================================================================
   WHY BOOK / FEATURES
   ============================================================================= */
.features-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.feature-item { text-align: center; padding: 32px 20px; background: var(--hih-surface); border: 1px solid var(--hih-border); border-radius: var(--radius); transition: all .25s; }
.feature-item:hover { box-shadow: var(--shadow); border-color: var(--hih-green-light); transform: translateY(-4px); }
.feature-icon { width: 60px; height: 60px; background: var(--hih-green-light); border-radius: 16px; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; font-size: 26px; }
.feature-title { font-size: 15px; font-weight: 600; color: var(--hih-dark); margin-bottom: 8px; font-family: var(--font-body); }
.feature-desc { font-size: 13.5px; color: var(--hih-mid); line-height: 1.6; }

/* =============================================================================
   CATEGORY TABS + CARDS
   ============================================================================= */
.cat-tabs { display: flex; gap: 8px; margin-bottom: 28px; flex-wrap: wrap; }
.cat-tab { padding: 8px 20px; border: 1.5px solid var(--hih-border); border-radius: var(--radius-full); font-size: 14px; font-weight: 500; color: var(--hih-mid); cursor: pointer; transition: all .2s; font-family: var(--font-body); }
.cat-tab.active, .cat-tab:hover { background: var(--hih-green); color: white; border-color: var(--hih-green); }
.cat-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.cat-card { position: relative; border-radius: var(--radius); overflow: hidden; height: 240px; cursor: pointer; }
.cat-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.cat-card:hover img { transform: scale(1.08); }
.cat-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 55%); display: flex; flex-direction: column; justify-content: flex-end; padding: 18px; }
.cat-card-label { font-size: 15px; font-weight: 700; color: white; font-family: var(--font-body); }
.cat-card-count { font-size: 12px; color: rgba(255,255,255,0.7); }

/* =============================================================================
   EXPERT CTA BANNER
   ============================================================================= */
.expert-banner { background: linear-gradient(135deg, var(--hih-green-mid) 0%, var(--hih-green) 60%, #1aab80 100%); border-radius: var(--radius); padding: 48px; display: flex; align-items: center; justify-content: space-between; overflow: hidden; position: relative; gap: 24px; }
.expert-banner::before { content: ''; position: absolute; right: -60px; top: -60px; width: 280px; height: 280px; border-radius: 50%; background: rgba(255,255,255,0.06); }
.expert-banner::after  { content: ''; position: absolute; right: 80px; bottom: -80px; width: 200px; height: 200px; border-radius: 50%; background: rgba(255,255,255,0.04); }
.expert-text { position: relative; z-index: 1; }
.expert-text h2 { font-family: var(--font-heading); font-size: 30px; color: white; margin-bottom: 10px; }
.expert-text p { font-size: 16px; color: rgba(255,255,255,0.85); max-width: 480px; }

/* =============================================================================
   DESTINATIONS GRID
   ============================================================================= */
.dest-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; grid-template-rows: auto auto; gap: 16px; }
.dest-card { position: relative; border-radius: var(--radius); overflow: hidden; cursor: pointer; }
.dest-card.featured { grid-row: span 2; height: 400px; }
.dest-card:not(.featured) { height: 190px; }
.dest-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.dest-card:hover img { transform: scale(1.06); }
.dest-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 50%); display: flex; flex-direction: column; justify-content: flex-end; padding: 18px; }
.dest-name { font-size: 16px; font-weight: 700; color: white; font-family: var(--font-body); }
.dest-sub  { font-size: 12px; color: rgba(255,255,255,0.8); }
.dest-explore { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--hih-green-light); margin-top: 6px; font-family: var(--font-body); }

/* =============================================================================
   FLASH DEALS
   ============================================================================= */
.flash-header { background: linear-gradient(135deg, var(--hih-dark) 0%, #2d3436 100%); border-radius: var(--radius) var(--radius) 0 0; padding: 32px 40px; display: flex; align-items: center; justify-content: space-between; }
.flash-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--hih-orange); color: var(--hih-dark); font-size: 11px; font-weight: 700; padding: 4px 12px; border-radius: var(--radius-full); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 10px; font-family: var(--font-body); }
.flash-header h2 { font-family: var(--font-heading); font-size: 26px; color: white; }
.flash-header p { color: rgba(255,255,255,0.7); font-size: 14px; margin-top: 6px; }
.flash-body { background: var(--hih-bg); border-radius: 0 0 var(--radius) var(--radius); padding: 28px 40px; }
.flash-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.flash-card { background: white; border-radius: var(--radius-sm); overflow: hidden; border: 1px solid var(--hih-border); transition: all .2s; }
.flash-card:hover { box-shadow: var(--shadow); border-color: transparent; transform: translateY(-4px); }
.flash-card img { width: 100%; height: 160px; object-fit: cover; }
.flash-card-info { padding: 14px; }
.flash-card-title { font-size: 14px; font-weight: 600; color: var(--hih-dark); margin-bottom: 8px; line-height: 1.4; font-family: var(--font-body); }
.flash-card-price { font-size: 17px; font-weight: 700; color: var(--hih-green-mid); font-family: var(--font-body); }
.flash-card-old { font-size: 12px; color: var(--hih-muted); text-decoration: line-through; margin-left: 6px; }
.flash-card-meta { font-size: 12px; color: var(--hih-mid); display: flex; gap: 8px; margin-top: 4px; }

/* =============================================================================
   ADVENTURE / VIDEO BANNER
   ============================================================================= */
.adventure-section { position: relative; background: url('') center/cover no-repeat; padding: 100px 0; text-align: center; }
.adventure-overlay { position: absolute; inset: 0; background: rgba(10,25,20,0.72); }
.adventure-content { position: relative; z-index: 2; }
.play-btn { width: 72px; height: 72px; border-radius: 50%; background: var(--hih-orange); display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; cursor: pointer; transition: all .2s; font-size: 24px; color: var(--hih-dark); border: none; }
.play-btn:hover { transform: scale(1.1); box-shadow: 0 0 0 12px rgba(232,160,32,0.2); }
.adventure-content h2 { font-family: var(--font-heading); font-size: 38px; color: white; margin-bottom: 16px; max-width: 500px; margin-left: auto; margin-right: auto; }
.adventure-content p { color: rgba(255,255,255,0.8); font-size: 16px; max-width: 480px; margin: 0 auto 28px; }

/* =============================================================================
   ABOUT SECTION
   ============================================================================= */
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.about-text { min-width: 0; }
.about-img-stack { position: relative; }
.about-img-main { width: 100%; height: 420px; object-fit: cover; border-radius: var(--radius); }
.about-img-inset { position: absolute; bottom: -24px; right: -24px; width: 200px; height: 160px; object-fit: cover; border-radius: var(--radius); border: 5px solid white; box-shadow: 0 8px 30px rgba(0,0,0,0.15); }
.about-tag { display: inline-flex; align-items: center; gap: 8px; background: var(--hih-green-light); color: var(--hih-green-mid); font-size: 12px; font-weight: 600; padding: 6px 14px; border-radius: var(--radius-full); margin-bottom: 16px; text-transform: uppercase; letter-spacing: 1px; font-family: var(--font-body); }
.about-text h2 { font-family: var(--font-heading); font-size: 34px; line-height: 1.2; color: var(--hih-dark); margin-bottom: 16px; }
.about-text p { color: var(--hih-mid); font-size: 15px; line-height: 1.8; margin-bottom: 20px; }
.stats-row { display: flex; gap: 32px; margin-top: 32px; }
.stat-item { text-align: center; }
.stat-num { font-size: 34px; font-weight: 700; color: var(--hih-green); line-height: 1; font-family: var(--font-body); }
.stat-label { font-size: 13px; color: var(--hih-mid); margin-top: 4px; }
.tag-scroll { display: flex; gap: 10px; margin-top: 20px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.tag-scroll::-webkit-scrollbar { display: none; }
.tag-chip { padding: 6px 16px; background: var(--hih-green-light); color: var(--hih-green-mid); border-radius: var(--radius-full); font-size: 13px; font-weight: 500; white-space: nowrap; transition: all .2s; cursor: pointer; font-family: var(--font-body); }
.tag-chip:hover { background: var(--hih-green); color: white; }

/* =============================================================================
   TESTIMONIALS
   ============================================================================= */
.testi-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px; }
.testi-card { background: var(--hih-surface); border: 1px solid var(--hih-border); border-radius: var(--radius); padding: 28px; transition: all .2s; }
.testi-card:hover { box-shadow: var(--shadow); border-color: var(--hih-green-light); }
.testi-stars { color: var(--hih-orange); font-size: 14px; margin-bottom: 14px; }
.testi-text { font-size: 14.5px; color: var(--hih-mid); line-height: 1.75; margin-bottom: 20px; font-style: italic; }
.testi-author { display: flex; align-items: center; gap: 12px; }
.testi-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--hih-green-light); color: var(--hih-green-mid); display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; flex-shrink: 0; font-family: var(--font-body); }
.testi-name { font-size: 14px; font-weight: 600; color: var(--hih-dark); font-family: var(--font-body); }
.testi-role { font-size: 12px; color: var(--hih-muted); }

/* =============================================================================
   BLOG
   ============================================================================= */
.blog-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 24px; }
.blog-card { background: var(--hih-surface); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--hih-border); transition: all .2s; }
.blog-card:hover { box-shadow: var(--shadow); transform: translateY(-4px); }
.blog-card.featured .blog-img { height: 280px; }
.blog-img { height: 180px; overflow: hidden; }
.blog-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.blog-card:hover .blog-img img { transform: scale(1.05); }
.blog-info { padding: 18px; }
.blog-cat { font-size: 11px; font-weight: 700; color: var(--hih-green); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; display: block; font-family: var(--font-body); }
.blog-title { font-size: 16px; font-weight: 600; color: var(--hih-dark); line-height: 1.4; margin-bottom: 10px; font-family: var(--font-body); }
.blog-title a:hover { color: var(--hih-green); }
.blog-meta { font-size: 12px; color: var(--hih-muted); display: flex; gap: 12px; }

/* =============================================================================
   FOOTER
   ============================================================================= */
.site-footer { background: var(--hih-dark); color: rgba(255,255,255,0.65); padding: 64px 0 0; }
.site-footer__grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 48px; padding-bottom: 48px; }
.footer-logo { font-size: 22px; font-weight: 700; color: white; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; font-family: var(--font-body); }
.footer-logo span { color: var(--hih-orange); }
.footer-about { font-size: 14px; line-height: 1.7; margin-bottom: 20px; }
.footer-socials { display: flex; gap: 10px; }
.social-btn { width: 36px; height: 36px; border: 1px solid rgba(255,255,255,0.2); border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 14px; color: rgba(255,255,255,0.6); transition: all .2s; cursor: pointer; text-decoration: none; }
.social-btn:hover { background: var(--hih-green); border-color: var(--hih-green); color: white; }
.footer-heading { font-size: 15px; font-weight: 600; color: white; margin-bottom: 18px; font-family: var(--font-body); }
.footer-links li { margin-bottom: 10px; }
.footer-links a { font-size: 14px; color: rgba(255,255,255,0.55); transition: color .2s; }
.footer-links a:hover { color: var(--hih-green); padding-left: 4px; }
.footer-contact-item { display: flex; gap: 12px; margin-bottom: 14px; font-size: 13.5px; align-items: flex-start; line-height: 1.5; }
.footer-contact-icon { color: var(--hih-green); flex-shrink: 0; margin-top: 2px; }
.newsletter-form { display: flex; margin-top: 10px; border-radius: var(--radius-sm); overflow: hidden; }
.newsletter-form input { flex: 1; padding: 11px 14px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-right: none; color: white; font-family: var(--font-body); font-size: 13px; outline: none; }
.newsletter-form input::placeholder { color: rgba(255,255,255,0.4); }
.newsletter-form button { padding: 11px 18px; background: var(--hih-green); color: white; border: none; cursor: pointer; font-family: var(--font-body); font-weight: 600; font-size: 13px; transition: background .2s; }
.newsletter-form button:hover { background: var(--hih-green-mid); }
.site-footer__bottom { border-top: 1px solid rgba(255,255,255,0.08); padding: 20px 0; display: flex; align-items: center; justify-content: space-between; font-size: 13px; flex-wrap: wrap; gap: 12px; }
.footer-legal { display: flex; gap: 20px; }
.footer-legal a { color: rgba(255,255,255,0.45); transition: color .2s; }
.footer-legal a:hover { color: var(--hih-green); }

/* =============================================================================
   SINGLE TREK PAGE
   ============================================================================= */
.single-trek-layout { display: grid; grid-template-columns: 1fr 340px; gap: 48px; align-items: start; padding-block: 48px; }
.trek-section { margin-bottom: 48px; }
.trek-section__title { font-size: 22px; font-weight: 700; color: var(--hih-dark); margin-bottom: 24px; padding-bottom: 12px; border-bottom: 2px solid var(--hih-green-light); font-family: var(--font-heading); }
.trek-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; background: var(--hih-bg); border-radius: var(--radius); padding: 24px; margin-bottom: 32px; }
.trek-fact { text-align: center; }
.trek-fact__icon { font-size: 1.5rem; margin-bottom: 8px; }
.trek-fact__value { font-size: 20px; font-weight: 700; color: var(--hih-dark); display: block; margin-bottom: 4px; font-family: var(--font-body); }
.trek-fact__label { font-size: 12px; color: var(--hih-muted); text-transform: uppercase; letter-spacing: 0.05em; }

/* Booking sidebar */
.booking-sidebar { position: sticky; top: calc(var(--nav-height) + 24px); background: var(--hih-surface); border: 1px solid var(--hih-border); border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow-lg); }
.booking-sidebar__price { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--hih-border); }
.booking-sidebar__price-label { font-size: 13px; color: var(--hih-muted); margin-bottom: 4px; }
.booking-sidebar__price-amount { font-family: var(--font-heading); font-size: 38px; font-weight: 700; color: var(--hih-dark); }
.booking-sidebar__price-note { font-size: 12px; color: var(--hih-muted); margin-top: 4px; }
.booking-sidebar__meta { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.booking-sidebar__meta-row { display: flex; align-items: center; justify-content: space-between; font-size: 14px; }
.booking-sidebar__meta-label { color: var(--hih-muted); }
.booking-sidebar__meta-value { font-weight: 600; color: var(--hih-dark); }
.booking-sidebar__actions { display: flex; flex-direction: column; gap: 12px; }
.booking-sidebar__note { font-size: 12px; color: var(--hih-muted); text-align: center; margin-top: 8px; }

/* Itinerary */
.itinerary-list { display: flex; flex-direction: column; gap: 12px; }
.itinerary-day { border: 1px solid var(--hih-border); border-radius: var(--radius); overflow: hidden; }
.itinerary-day__header { display: flex; align-items: center; gap: 16px; padding: 16px 20px; background: var(--hih-bg); cursor: pointer; transition: background .2s; user-select: none; }
.itinerary-day__header:hover { background: var(--hih-green-light); }
.itinerary-day__num { width: 32px; height: 32px; background: var(--hih-green); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; font-family: var(--font-body); }
.itinerary-day__title { font-size: 15px; font-weight: 600; color: var(--hih-dark); flex: 1; font-family: var(--font-body); }
.itinerary-day__arrow { width: 18px; height: 18px; color: var(--hih-muted); transition: transform .25s; flex-shrink: 0; }
.itinerary-day.is-open .itinerary-day__arrow { transform: rotate(180deg); }
.itinerary-day__body { padding: 0 20px; max-height: 0; overflow: hidden; transition: max-height .4s ease, padding .3s; font-size: 14px; color: var(--hih-mid); line-height: 1.75; }
.itinerary-day.is-open .itinerary-day__body { max-height: 600px; padding-block: 16px; }
.itinerary-day__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }

/* FAQs */
.faq-list { display: flex; flex-direction: column; gap: 12px; }
.faq-item { border: 1px solid var(--hih-border); border-radius: var(--radius); }
.faq-item__question { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; cursor: pointer; font-size: 15px; font-weight: 600; color: var(--hih-dark); transition: color .2s; user-select: none; font-family: var(--font-body); }
.faq-item__question:hover { color: var(--hih-green); }
.faq-item__arrow { width: 16px; height: 16px; flex-shrink: 0; color: var(--hih-muted); transition: transform .25s; }
.faq-item.is-open .faq-item__arrow { transform: rotate(180deg); }
.faq-item__answer { max-height: 0; overflow: hidden; transition: max-height .4s ease, padding .3s; font-size: 14px; color: var(--hih-mid); line-height: 1.75; padding-inline: 20px; }
.faq-item.is-open .faq-item__answer { max-height: 400px; padding-block: 16px; }

/* Inc/Exc */
.inc-exc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.inc-exc-block__title { font-size: 15px; font-weight: 700; margin-bottom: 16px; font-family: var(--font-body); }
.inc-exc-block__title--inc { color: #15803d; }
.inc-exc-block__title--exc { color: #b91c1c; }
.inc-exc-list { display: flex; flex-direction: column; gap: 8px; }
.inc-exc-list li { display: flex; gap: 10px; font-size: 14px; color: var(--hih-mid); align-items: flex-start; }
.inc-exc-list--inc li::before { content: '✓'; color: #15803d; font-weight: 700; flex-shrink: 0; }
.inc-exc-list--exc li::before { content: '✗'; color: #b91c1c; font-weight: 700; flex-shrink: 0; }

/* =============================================================================
   ACCOMMODATION CARDS
   ============================================================================= */
.stay-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.stay-card { background: var(--hih-surface); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--hih-border); box-shadow: 0 2px 8px rgba(0,0,0,0.04); transition: all .25s; display: flex; flex-direction: column; }
.stay-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: transparent; }
.stay-card__image { aspect-ratio: 4/3; overflow: hidden; position: relative; }
.stay-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.stay-card:hover .stay-card__image img { transform: scale(1.06); }
.stay-card__body { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.stay-card__location { font-size: 12px; font-weight: 600; color: var(--hih-green); text-transform: uppercase; letter-spacing: 0.06em; font-family: var(--font-body); }
.stay-card__title { font-size: 15px; font-weight: 600; color: var(--hih-dark); margin: 0; line-height: 1.4; font-family: var(--font-body); }
.stay-card__title a:hover { color: var(--hih-green); }
.stay-card__amenities { display: flex; flex-wrap: wrap; gap: 6px; font-size: 12px; color: var(--hih-muted); }
.stay-card__footer { padding: 12px 16px; border-top: 1px solid var(--hih-border); display: flex; align-items: center; justify-content: space-between; }
.stay-card__price { font-size: 18px; font-weight: 700; color: var(--hih-green-mid); font-family: var(--font-body); }
.stay-card__price small { font-size: 11px; font-weight: 400; color: var(--hih-muted); }

/* =============================================================================
   PAGINATION
   ============================================================================= */
.hih-pagination { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 48px; }
.hih-pagination a, .hih-pagination span { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding-inline: 12px; border: 1px solid var(--hih-border); border-radius: var(--radius-sm); font-size: 14px; font-weight: 500; color: var(--hih-mid); transition: all .2s; font-family: var(--font-body); }
.hih-pagination a:hover { background: var(--hih-green-light); border-color: var(--hih-green-light); color: var(--hih-green); }
.hih-pagination .current { background: var(--hih-green); border-color: var(--hih-green); color: #fff; }

/* =============================================================================
   FORMS
   ============================================================================= */
.hih-form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 20px; }
.hih-form-label { font-size: 14px; font-weight: 600; color: var(--hih-dark); font-family: var(--font-body); }
.hih-form-input, .hih-form-select, .hih-form-textarea { width: 100%; padding: 12px 16px; border: 1px solid var(--hih-border); border-radius: var(--radius-sm); font-size: 15px; color: var(--hih-dark); background: var(--hih-surface); transition: border-color .2s, box-shadow .2s; outline: none; font-family: var(--font-body); }
.hih-form-input:focus, .hih-form-select:focus, .hih-form-textarea:focus { border-color: var(--hih-green); box-shadow: 0 0 0 3px rgba(26,158,117,0.12); }
.hih-form-textarea { resize: vertical; min-height: 120px; }

/* =============================================================================
   MISC
   ============================================================================= */
.breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; font-size: 13px; color: var(--hih-muted); margin-bottom: 24px; font-family: var(--font-body); }
.breadcrumb a { color: var(--hih-muted); }
.breadcrumb a:hover { color: var(--hih-green); }
.breadcrumb__sep { color: var(--hih-border); }
.map-embed-wrap { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--hih-border); }
.map-embed-wrap iframe { width: 100%; height: 350px; border: none; display: block; }
.highlights-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.highlights-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--hih-mid); }
.highlights-list li::before { content: '✦'; color: var(--hih-orange); font-size: 11px; margin-top: 3px; flex-shrink: 0; }

/* WP required */
.alignleft  { float: left;  margin-right: 24px; margin-bottom: 16px; }
.alignright { float: right; margin-left: 24px;  margin-bottom: 16px; }
.aligncenter { display: block; margin-inline: auto; margin-bottom: 16px; }

/* =============================================================================
   RESPONSIVE — consolidated, mobile-first
   ============================================================================= */

/* --- Tablet: 1024px and below -------------------------------------------- */
@media (max-width: 1024px) {
  .trek-grid, .cat-cards         { grid-template-columns: repeat(2, 1fr); }
  .dest-grid                     { grid-template-columns: 1fr 1fr 1fr; }
  .dest-card.featured            { grid-column: span 2; height: 260px; }
  .about-grid                    { gap: 40px; }
  .site-footer__grid             { grid-template-columns: 1fr 1fr; gap: 32px; }
  .single-trek-layout            { grid-template-columns: 1fr; }
  .booking-sidebar               { position: static; }
  .trek-facts                    { grid-template-columns: repeat(2, 1fr); }
  .inc-exc-grid                  { grid-template-columns: 1fr; }
}

/* --- Mobile: 768px and below --------------------------------------------- */
@media (max-width: 768px) {

  /* Global */
  body                           { overflow-x: hidden; }
  .site-wrapper                  { overflow-x: hidden; }
  .section                       { padding: 48px 0; }
  .container                     { padding: 0 16px; }
  .section-header                { flex-direction: column; align-items: flex-start; gap: 12px; }

  /* Topbar + nav */
  .topbar                        { display: none; }
  nav                            { display: none; }

  /* Typography */
  .hero__title                   { font-size: clamp(28px, 7vw, 36px); }
  .hero__subtitle                { font-size: 15px; }
  .hero__content                 { padding: 48px 0 40px; }
  .hero__stats                   { gap: 16px; flex-wrap: wrap; }
  .adventure-content h2          { font-size: clamp(24px, 6vw, 32px); }
  .adventure-content p           { font-size: 14px; }
  .adventure-section             { padding: 72px 16px; }
  .section-title                 { font-size: clamp(22px, 5vw, 28px); }

  /* Hero search */
  .hero-search                   { flex-direction: column; border-radius: var(--radius); gap: 2px; width: 100%; max-width: 100%; }
  .search-field                  { border-right: none; border-bottom: 1px solid var(--hih-border); width: 100%; box-sizing: border-box; }
  .search-field:last-of-type     { border-bottom: none; }
  .search-field select,
  .search-field input            { max-width: 100%; }
  .btn-search                    { width: 100%; justify-content: center; border-radius: var(--radius-sm); }

  /* Grids */
  .trek-grid, .cat-cards,
  .testi-grid, .blog-grid,
  .flash-grid, .stay-grid        { grid-template-columns: 1fr 1fr; }
  .features-grid, .offers-grid   { grid-template-columns: 1fr 1fr; }
  .dest-grid                     { grid-template-columns: 1fr 1fr; }
  .dest-card.featured            { grid-column: span 2; height: 220px; }

  /* About section — single column, clip inset overflow */
  .about-grid                    { grid-template-columns: 1fr; gap: 28px; }
  .about-text                    { min-width: 0; width: 100%; }
  .about-text p                  { word-break: break-word; overflow-wrap: break-word; }
  .about-img-inset               { display: none !important; }
  .about-img-stack               { overflow: hidden; }
  .about-img-main                { height: 240px; }
  .about-text h2                 { font-size: 26px; }
  .stats-row                     { gap: 16px; flex-wrap: wrap; }
  .stat-num                      { font-size: 26px; }

  /* Expert banner */
  .expert-banner                 { flex-direction: column; gap: 20px; text-align: center; padding: 32px 20px; }

  /* Flash deals */
  .flash-header, .flash-body     { padding: 20px; }
  .flash-header                  { border-radius: var(--radius) var(--radius) 0 0; }

  /* Page hero */
  .page-hero                     { min-height: 220px; padding-bottom: 32px; }
  .page-hero__title              { font-size: clamp(24px, 5vw, 34px); }

  /* Footer */
  .site-footer__grid             { grid-template-columns: 1fr 1fr; gap: 28px; }
  .footer-legal                  { flex-direction: column; gap: 8px; }

  /* Single trek */
  .highlights-list               { grid-template-columns: 1fr; }

  /* Contact */
  .hih-contact-two-col           { grid-template-columns: 1fr !important; gap: 32px; }
}

/* --- Small mobile: 480px and below --------------------------------------- */
@media (max-width: 480px) {

  /* Tighter horizontal padding */
  .container                     { padding: 0 14px; }
  .section                       { padding: 40px 0; }

  /* 2-column cards on small mobile — better density */
  .trek-grid, .cat-cards         { grid-template-columns: 1fr 1fr; gap: 12px; }
  .features-grid                 { grid-template-columns: 1fr 1fr; gap: 12px; }
  .offers-grid                   { grid-template-columns: 1fr 1fr; gap: 12px; }
  /* Tall/text-heavy cards keep single column */
  .testi-grid, .blog-grid,
  .flash-grid, .stay-grid        { grid-template-columns: 1fr; }
  .dest-grid                     { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dest-card.featured            { grid-column: span 2; height: 190px; }

  /* Footer single column */
  .site-footer__grid             { grid-template-columns: 1fr; }

  /* Stats row wraps with equal spacing */
  .stats-row                     { gap: 12px; }
  .stat-item                     { min-width: calc(50% - 8px); }

  /* WhatsApp button position */
  .wa-float                      { bottom: 20px; right: 14px; width: 50px; height: 50px; }

  /* Adventure section */
  .adventure-section             { padding: 60px 14px; }
  .adventure-content h2          { font-size: 24px; }

  /* Expert banner */
  .expert-banner                 { padding: 24px 16px; }

  /* Flash deals full width */
  .flash-header, .flash-body     { padding: 16px; }

  /* Hero */
  .hero__title                   { font-size: clamp(26px, 8vw, 32px); }
  .hero__stats                   { gap: 12px; }
  .hero-stat__num                { font-size: 18px; }

  /* About */
  .about-img-main                { height: 200px; }
  .about-text                    { min-width: 0; width: 100%; overflow: hidden; }

  /* Tag chips scroll */
  .tag-scroll                    { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 6px; }
}

/* ============================================================
   TRIPADVISOR REVIEWS SECTION
   ============================================================ */
.ta-section { background: var(--hih-dark); padding: 72px 0; overflow: hidden; }
.ta-section .section-eyebrow { color: var(--hih-orange); }
.ta-section .section-title { color: #fff; }
.ta-section .section-header { margin-bottom: 40px; }

.ta-badge {
  display: inline-flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-full); padding: 10px 18px; margin-bottom: 28px;
}
.ta-badge__owl { font-size: 22px; }
.ta-badge__text { font-size: 13px; color: rgba(255,255,255,0.75); font-weight: 500; line-height: 1.3; }
.ta-badge__text strong { color: #fff; display: block; font-size: 14px; }
.ta-badge__score {
  background: #34d679; color: #fff; border-radius: 8px; padding: 4px 10px;
  font-size: 20px; font-weight: 800; font-family: var(--font-body); line-height: 1;
}

/* Slider wrapper */
.ta-slider-wrapper { position: relative; }
.ta-slider-track {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  transition: transform 0.45s cubic-bezier(.4,0,.2,1);
}
.ta-review-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--radius);
  padding: 26px;
  display: flex; flex-direction: column; gap: 14px;
  transition: background .2s, border-color .2s;
}
.ta-review-card:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.2);
}

/* Round avatar */
.ta-review-header { display: flex; align-items: center; gap: 14px; }
.ta-avatar {
  width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 700; font-family: var(--font-body);
  color: #fff; border: 2px solid rgba(255,255,255,0.15);
}
.ta-avatar--a { background: linear-gradient(135deg, #1a9e75, #0f6e56); }
.ta-avatar--b { background: linear-gradient(135deg, #e8a020, #c4860e); }
.ta-avatar--c { background: linear-gradient(135deg, #6c5ce7, #4a3ab5); }
.ta-avatar--d { background: linear-gradient(135deg, #e17055, #c0392b); }
.ta-avatar--e { background: linear-gradient(135deg, #00b894, #00796b); }
.ta-avatar--f { background: linear-gradient(135deg, #fd79a8, #c0392b); }

.ta-reviewer-info { flex: 1; min-width: 0; }
.ta-reviewer-name { font-size: 14px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: var(--font-body); }
.ta-reviewer-location { font-size: 12px; color: rgba(255,255,255,0.45); margin-top: 2px; }
.ta-trip-label { font-size: 11px; background: rgba(26,158,117,0.25); color: #34d679; border-radius: 20px; padding: 2px 10px; white-space: nowrap; }

.ta-stars { color: #34d679; font-size: 13px; letter-spacing: 1px; }
.ta-review-title { font-size: 15px; font-weight: 600; color: #fff; font-family: var(--font-body); }
.ta-review-text { font-size: 13.5px; color: rgba(255,255,255,0.60); line-height: 1.7; flex: 1; }
.ta-review-date { font-size: 11px; color: rgba(255,255,255,0.30); margin-top: auto; }

/* Slider dots */
.ta-dots { display: none; justify-content: center; gap: 8px; margin-top: 24px; }
.ta-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,0.2); border: none; cursor: pointer; padding: 0;
  transition: background .2s, width .2s;
}
.ta-dot.active { background: var(--hih-green); width: 24px; border-radius: 4px; }

/* Slider arrows */
.ta-arrows { display: none; gap: 10px; margin-top: 20px; justify-content: center; }
.ta-arrow {
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.06);
  color: #fff; font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, border-color .2s;
}
.ta-arrow:hover { background: var(--hih-green); border-color: var(--hih-green); }
.ta-arrow:disabled { opacity: 0.3; cursor: default; }

/* Mobile: carousel mode */
@media (max-width: 768px) {
  .ta-section { padding: 56px 0; }
  .ta-slider-wrapper { overflow: hidden; }
  .ta-slider-track {
    display: flex;
    gap: 14px;
    width: max-content;
  }
  .ta-review-card {
    width: calc(85vw - 28px);
    max-width: 320px;
    flex-shrink: 0;
  }
  .ta-dots { display: flex; }
  .ta-arrows { display: flex; }
}

@media (max-width: 480px) {
  .ta-review-card {
    width: calc(82vw);
    max-width: 300px;
    padding: 20px;
  }
  .ta-badge { flex-wrap: wrap; gap: 8px; }
}

/* ============================================================
   LEGAL CONTENT PAGES (Privacy, Terms, Refund)
   ============================================================ */
.legal-content { max-width: 800px; }
.legal-content h2 { font-family: var(--font-heading); font-size: 22px; color: var(--hih-dark); margin: 40px 0 14px; border-bottom: 2px solid var(--hih-border); padding-bottom: 10px; }
.legal-content h2:first-of-type { margin-top: 8px; }
.legal-content p { color: var(--hih-mid); font-size: 15px; line-height: 1.85; margin-bottom: 16px; }
.legal-content ul { color: var(--hih-mid); font-size: 15px; line-height: 1.85; margin: 0 0 20px 20px; padding: 0; }
.legal-content ul li { margin-bottom: 8px; }
.legal-content a { color: var(--hih-green-mid); }
.legal-intro { font-size: 16px; color: var(--hih-mid); line-height: 1.9; padding: 20px 24px; background: var(--hih-surface); border-left: 4px solid var(--hih-green); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin-bottom: 40px; }

/* ============================================================
   CONTACT PAGE TWO-COLUMN RESPONSIVE
   ============================================================ */
.hih-contact-two-col { display: grid; grid-template-columns: 1fr 1.4fr; gap: 56px; align-items: start; }
@media (max-width: 768px) {
  .hih-contact-two-col { grid-template-columns: 1fr !important; gap: 36px; }
}

/* ============================================================
   ARCHIVE LAYOUT — Sidebar + Content Grid
   Used by: archive-hih_trip.php, archive-hih_accommodation.php
   ============================================================ */
.archive-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 40px;
  align-items: start;
}

/* ── Filter Sidebar ── */
.filters-sidebar {
  position: sticky;
  top: calc(var(--nav-height, 72px) + 24px);
  background: var(--hih-surface, #fff);
  border: 1px solid var(--hih-border, #e5e7eb);
  border-radius: var(--radius, 10px);
  padding: 20px;
  box-shadow: var(--shadow, 0 2px 12px rgba(0,0,0,.08));
}

.filters-sidebar__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.filters-sidebar__title {
  font-size: 15px;
  font-weight: 700;
  font-family: var(--font-body, sans-serif);
  margin: 0;
}
.filters-sidebar__clear {
  font-size: 12px;
  color: var(--hih-muted, #6b7280);
  text-decoration: underline;
}
.filters-sidebar__clear:hover { color: var(--hih-dark, #111); }

/* ── Filter Groups ── */
.filter-group { margin-bottom: 24px; }
.filter-group__label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--hih-muted, #6b7280);
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-bottom: 10px;
}
.filter-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 14px;
  color: var(--hih-mid, #4b5563);
  cursor: pointer;
  border-radius: 4px;
  transition: color .15s;
}
.filter-option:hover { color: var(--hih-dark, #111); }
.filter-option input[type="radio"] { accent-color: var(--hih-green, #16a34a); flex-shrink: 0; }
.filter-option__count {
  margin-left: auto;
  font-size: 12px;
  color: var(--hih-muted, #6b7280);
  background: var(--hih-bg, #f9fafb);
  border: 1px solid var(--hih-border, #e5e7eb);
  border-radius: 20px;
  padding: 1px 7px;
}

/* ── Mobile filter toggle — hidden on desktop ── */
.filters-mobile-toggle { display: none; }

/* ============================================================
   TREK / STAY PHOTO GRID  (single-hih_trip.php)
   ============================================================ */
.trek-photo-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: 200px 200px;
  gap: 8px;
  border-radius: var(--radius, 10px);
  overflow: hidden;
  margin-bottom: 32px;
}
.trek-photo-grid__item { overflow: hidden; }
.trek-photo-grid__item--hero { grid-row: span 2; }
.trek-photo-grid__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.trek-photo-grid__item:hover img { transform: scale(1.04); }

/* ============================================================
   RESPONSIVE — TABLETS (≤ 900px)
   ============================================================ */
@media (max-width: 900px) {
  .archive-layout {
    grid-template-columns: 1fr;
  }

  /* Filter sidebar collapses into an off-canvas drawer */
  .filters-mobile-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: var(--hih-surface, #fff);
    border: 1px solid var(--hih-border, #e5e7eb);
    border-radius: var(--radius, 10px);
    font-size: 14px;
    font-weight: 600;
    color: var(--hih-dark, #111);
    cursor: pointer;
    margin-bottom: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    position: relative;
  }
  .filters-mobile-toggle:hover { background: var(--hih-bg, #f9fafb); }

  .filters-mobile-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hih-orange, #f97316);
    border: 2px solid #fff;
  }

  .filters-sidebar {
    position: static;
    display: none;                /* hidden until toggle opens it */
    margin-bottom: 24px;
  }
  .filters-sidebar.is-open {
    display: block;
  }

  /* Photo grid: single-column strip on tablet */
  .trek-photo-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 200px;
  }
  .trek-photo-grid__item--hero { grid-row: span 1; }
  .trek-photo-grid__item:nth-child(3) { display: none; } /* hide 3rd on tablet */
}

/* ============================================================
   RESPONSIVE — MOBILE (≤ 600px)
   ============================================================ */
@media (max-width: 600px) {
  /* Full-width single photo on mobile */
  .trek-photo-grid {
    grid-template-columns: 1fr;
    grid-template-rows: 240px;
  }
  .trek-photo-grid__item { display: none; }
  .trek-photo-grid__item--hero {
    display: block;
    grid-row: span 1;
  }

  /* trek-facts: single column */
  .trek-facts { grid-template-columns: 1fr 1fr; }

  /* Booking sidebar price smaller */
  .booking-sidebar__price-amount { font-size: 28px; }
}

@media (max-width: 480px) {
  .trek-facts { grid-template-columns: 1fr 1fr; }
}

/* ============================================================
   BLOG ARCHIVE  (index.php)
   ============================================================ */

/* Shorter hero for blog/category pages */
.page-hero--short { min-height: 260px; }
.page-hero--short .page-hero__content { padding-bottom: 40px; }

/* Archive grid: featured card spans full width, rest 3-col */
.blog-archive-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

/* First post: spans full 3 columns as featured */
.blog-archive-card--featured {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 0;
}
.blog-archive-card--featured .blog-archive-card__img-wrap {
  height: 340px;
  border-radius: var(--radius) 0 0 var(--radius);
}
.blog-archive-card--featured .blog-archive-card__body {
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.blog-archive-card--featured .blog-archive-card__title {
  font-size: 26px;
  margin-bottom: 14px;
}
.blog-archive-card--featured .blog-archive-card__excerpt {
  font-size: 15px;
  -webkit-line-clamp: 4;
}

/* Regular card */
.blog-archive-card {
  background: var(--hih-surface, #fff);
  border: 1px solid var(--hih-border, #e5e7eb);
  border-radius: var(--radius, 10px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .25s, transform .25s;
}
.blog-archive-card:hover {
  box-shadow: var(--shadow-lg, 0 8px 30px rgba(0,0,0,.12));
  transform: translateY(-4px);
}

/* Image */
.blog-archive-card__img-wrap {
  display: block;
  height: 200px;
  overflow: hidden;
  background: var(--hih-bg, #f9fafb);
  text-decoration: none;
  flex-shrink: 0;
}
.blog-archive-card__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.blog-archive-card:hover .blog-archive-card__img-wrap img {
  transform: scale(1.05);
}
.blog-archive-card__img-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  background: linear-gradient(135deg, #f0fdf4, #d1fae5);
}

/* Body */
.blog-archive-card__body {
  padding: 20px 20px 18px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.blog-archive-card__cat {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: var(--hih-green, #16a34a);
  text-transform: uppercase;
  letter-spacing: .7px;
  margin-bottom: 8px;
  text-decoration: none;
}
.blog-archive-card__cat:hover { text-decoration: underline; }

.blog-archive-card__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--hih-dark, #111827);
  line-height: 1.35;
  margin: 0 0 10px;
  font-family: var(--font-heading, serif);
}
.blog-archive-card__title a {
  color: inherit;
  text-decoration: none;
}
.blog-archive-card__title a:hover { color: var(--hih-green, #16a34a); }

.blog-archive-card__excerpt {
  font-size: 14px;
  color: var(--hih-mid, #4b5563);
  line-height: 1.7;
  margin: 0 0 14px;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.blog-archive-card__meta {
  display: flex;
  gap: 14px;
  font-size: 12px;
  color: var(--hih-muted, #9ca3af);
  margin-bottom: 14px;
}

.blog-archive-card__read-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--hih-green, #16a34a);
  text-decoration: none;
  margin-top: auto;
  transition: gap .2s;
}
.blog-archive-card__read-more:hover { gap: 10px; }

/* ── Blog archive responsive ── */
@media (max-width: 1024px) {
  .blog-archive-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-archive-card--featured {
    grid-column: 1 / -1;
    grid-template-columns: 1.4fr 1fr;
  }
  .blog-archive-card--featured .blog-archive-card__img-wrap { height: 280px; }
}

@media (max-width: 768px) {
  .blog-archive-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .blog-archive-card--featured {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;      /* stack vertically */
  }
  .blog-archive-card--featured .blog-archive-card__img-wrap {
    height: 220px;
    border-radius: var(--radius) var(--radius) 0 0;
  }
  .blog-archive-card--featured .blog-archive-card__body { padding: 20px; }
  .blog-archive-card--featured .blog-archive-card__title { font-size: 20px; }
}

@media (max-width: 480px) {
  .blog-archive-grid { grid-template-columns: 1fr; }
  .blog-archive-card--featured { grid-column: 1; }
  .page-hero--short { min-height: 200px; }
}

/* ============================================================
   SINGLE TREK PAGE — ENHANCEMENTS
   ============================================================ */

/* Taller hero for trek pages */
.page-hero--trek { min-height: 440px; }
@media (max-width: 768px) { .page-hero--trek { min-height: 300px; } }
@media (max-width: 480px) { .page-hero--trek { min-height: 240px; } }

.trek-hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

/* ── Section Nav (sticky scroll tabs) ─────────────────────── */
.trek-section-nav {
  position: sticky;
  top: var(--nav-height, 72px);
  z-index: 200;
  background: var(--hih-surface, #fff);
  border-bottom: 1px solid var(--hih-border, #e5e7eb);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.trek-section-nav .container { padding-block: 0; }
.trek-section-nav__list {
  display: flex;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.trek-section-nav__list::-webkit-scrollbar { display: none; }
.trek-section-nav__link {
  display: inline-block;
  padding: 14px 18px;
  font-size: 14px;
  font-weight: 500;
  color: var(--hih-mid, #6b7280);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s;
  font-family: var(--font-body, sans-serif);
}
.trek-section-nav__link:hover { color: var(--hih-dark, #111); }
.trek-section-nav__link.is-active {
  color: var(--hih-green, #16a34a);
  border-bottom-color: var(--hih-green, #16a34a);
  font-weight: 600;
}
@media (max-width: 768px) {
  .trek-section-nav__link { padding: 12px 14px; font-size: 13px; }
}

/* ── Overview text ────────────────────────────────────────── */
.trek-overview-text {
  font-size: 15px;
  color: var(--hih-mid, #6b7280);
  line-height: 1.85;
}
.trek-overview-text p { margin-bottom: 14px; }

/* ── Itinerary day description ────────────────────────────── */
.itinerary-day__desc {
  font-size: 14px;
  color: var(--hih-mid, #6b7280);
  line-height: 1.75;
  margin-bottom: 12px;
}

/* ── Meeting point callout ────────────────────────────────── */
.trek-meeting-point {
  background: var(--hih-green-pale, #f0faf6);
  border-left: 4px solid var(--hih-green, #16a34a);
  padding: 16px 20px;
  border-radius: 0 var(--radius-sm, 6px) var(--radius-sm, 6px) 0;
  margin-bottom: 20px;
}
.trek-meeting-point__label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--hih-green, #16a34a);
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-bottom: 4px;
}
.trek-meeting-point p { margin: 0; font-size: 14px; color: var(--hih-dark, #111); }

.trek-how-to-reach { font-size: 14px; color: var(--hih-mid, #6b7280); line-height: 1.8; }

/* ── Batch Dates Table ────────────────────────────────────── */
.batch-table-wrap {
  overflow-x: auto;
  border-radius: var(--radius, 10px);
  border: 1px solid var(--hih-border, #e5e7eb);
  -webkit-overflow-scrolling: touch;
}
.batch-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  min-width: 520px;
}
.batch-table thead tr { background: var(--hih-bg, #f9fafb); }
.batch-table th {
  padding: 12px 16px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--hih-muted, #9ca3af);
  border-bottom: 1px solid var(--hih-border, #e5e7eb);
  white-space: nowrap;
}
.batch-table td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--hih-border, #e5e7eb);
  color: var(--hih-mid, #6b7280);
  vertical-align: middle;
}
.batch-table tbody tr:last-child td { border-bottom: none; }
.batch-table tbody tr:hover td { background: var(--hih-bg, #f9fafb); }
.batch-price { font-weight: 700; color: var(--hih-green-mid, #15803d) !important; }

/* Mobile: card-style rows (stacked) */
@media (max-width: 600px) {
  .batch-table-wrap { border: none; }
  .batch-table,
  .batch-table thead,
  .batch-table tbody,
  .batch-table th,
  .batch-table td,
  .batch-table tr { display: block; }

  .batch-table thead { display: none; } /* hide header row */

  .batch-table tbody tr {
    background: var(--hih-surface, #fff);
    border: 1px solid var(--hih-border, #e5e7eb);
    border-radius: var(--radius, 10px);
    margin-bottom: 12px;
    padding: 4px 0;
  }
  .batch-table td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid var(--hih-border, #e5e7eb);
    font-size: 13px;
  }
  .batch-table td:last-child { border-bottom: none; }
  .batch-table td::before {
    content: attr(data-label);
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--hih-muted, #9ca3af);
    flex-shrink: 0;
    margin-right: 8px;
  }
  /* Action cell (no label) */
  .batch-table td:last-child::before { content: none; }
  .batch-table td:last-child { justify-content: flex-end; }
}

/* ── Packing List Grid ────────────────────────────────────── */
.packing-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.packing-group__label {
  font-size: 14px;
  font-weight: 700;
  color: var(--hih-dark, #111827);
  margin-bottom: 12px;
  font-family: var(--font-body, sans-serif);
}
.packing-group__list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.packing-group__list li {
  font-size: 13px;
  color: var(--hih-mid, #6b7280);
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
.packing-group__list li::before {
  content: '✓';
  color: var(--hih-green, #16a34a);
  font-weight: 700;
  flex-shrink: 0;
}
@media (max-width: 600px) {
  .packing-grid { grid-template-columns: 1fr; gap: 20px; }
}

/* ── Booking Trust Grid ───────────────────────────────────── */
.booking-trust-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  border-top: 1px solid var(--hih-border, #e5e7eb);
  margin-top: 20px;
  padding-top: 16px;
}
.booking-trust-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--hih-mid, #6b7280);
}

/* ── No Results State ─────────────────────────────────────── */
.no-results-state {
  text-align: center;
  padding: 64px 20px;
  color: var(--hih-muted, #9ca3af);
}
.no-results-state h2 { font-size: 22px; color: var(--hih-dark, #111); margin-bottom: 8px; }
.no-results-state p  { color: var(--hih-mid, #6b7280); margin-bottom: 24px; font-size: 15px; }

/* ── Mobile Sticky Booking Bar ────────────────────────────── */
.mobile-book-bar {
  display: none; /* hidden on desktop */
}
@media (max-width: 1024px) {
  .mobile-book-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 500;
    background: var(--hih-surface, #fff);
    border-top: 1px solid var(--hih-border, #e5e7eb);
    padding: 12px 20px;
    box-shadow: 0 -4px 20px rgba(0,0,0,.10);
    /* Push footer content up */
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }
  /* Add padding to the bottom of main so content isn't hidden behind bar */
  .single-trek-layout { padding-bottom: 80px; }

  .mobile-book-bar__price {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
  }
  .mobile-book-bar__label {
    font-size: 11px;
    color: var(--hih-muted, #9ca3af);
    text-transform: uppercase;
    letter-spacing: .4px;
  }
  .mobile-book-bar__amount {
    font-size: 20px;
    font-weight: 800;
    color: var(--hih-dark, #111827);
    font-family: var(--font-heading, serif);
  }
  .mobile-book-bar__actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
  }
}
@media (max-width: 480px) {
  .mobile-book-bar { padding: 10px 16px; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  .mobile-book-bar__amount { font-size: 18px; }
}

/* ── Single trek responsive fixes ────────────────────────── */
@media (max-width: 768px) {
  .trek-section { margin-bottom: 36px; }
  .trek-section__title { font-size: 19px; margin-bottom: 18px; }
  .faq-list { gap: 8px; display: flex; flex-direction: column; }
  .inc-exc-grid { gap: 20px; }
}
@media (max-width: 480px) {
  .trek-section { margin-bottom: 28px; }
  .highlights-list { grid-template-columns: 1fr; gap: 8px; }
  .trek-facts { gap: 10px; padding: 16px; }
  .trek-fact__value { font-size: 16px; }
}