/* ============================================================
   TOUR PACKAGE PAGE  —  style.css
   Relies on root tokens from pub-header.php home.css
   Local additions only where pub-header tokens don't cover.
============================================================ */

/* ── LOCAL TOKEN EXTENSIONS ─────────────────────────────── */
:root {
  --gold-dk  : #a57520;
  --gold-dk  : #a57520;
  --gold-lt  : #fdf6e8;
  --gold  : #b83232;
  --red-lt   : #f9f0ef;
  --green    : #2d6a35;
  --nav-safe : 80px;          /* clearance below sticky tabs */
}

/* ── BASE RESET (page-scoped) ───────────────────────────── */
.hero-banner *, .gallery-mosaic *,
.main-section *, .related-section * {
  box-sizing: border-box;
}

/* ============================================================
   FLOATING CTA
============================================================ */
.floating-cta {
  position: fixed;
  right: 20px;
  bottom: 90px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.float-btn {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 21px;
  color: var(--white);
  box-shadow: var(--shadow-md);
  transition: var(--ease);
}
.float-btn:hover      { transform: scale(1.12); color: var(--white); }
.whatsapp-btn         { background: #25d366; }
.call-btn             { background: var(--gold); }

/* ============================================================
   HERO BANNER
============================================================ */
.hero-banner {
  position    : relative;
  background  : center / cover no-repeat;
  min-height  : 500px;
  display     : flex;
  align-items : flex-end;
  overflow    : hidden;
}

.hero-overlay {
  position : absolute;
  inset    : 0;
  background: linear-gradient(
    180deg,
    rgba(10,3,3,.15)  0%,
    rgba(10,3,3,.55) 45%,
    rgba(10,3,3,.88) 100%
  );
}

.hero-inner {
  position    : relative;
  z-index     : 2;
  padding-top : 110px;
  padding-bottom : 0;
  width       : 100%;
}

/* Breadcrumb */
.hero-breadcrumb { margin-bottom: 14px; }

.hero-breadcrumb .breadcrumb {
  background  : transparent;
  padding     : 0;
  font-size   : 12.5px;
  margin      : 0;
}
.hero-breadcrumb .breadcrumb-item,
.hero-breadcrumb .breadcrumb-item a    { color: rgba(255,255,255,.6); }
.hero-breadcrumb .breadcrumb-item a:hover { color: var(--gold); }
.hero-breadcrumb .breadcrumb-item.active  { color: var(--red); }
.hero-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.35); }

/* Category pill */
.hero-badge {
  display     : inline-flex;
  align-items : center;
  gap         : 6px;
  background  : var(--red);
  color       : var(--white);
  font-size   : 11px;
  font-weight : 700;
  letter-spacing: .9px;
  text-transform: uppercase;
  padding     : 5px 14px;
  border-radius: 20px;
  margin-bottom: 14px;
}

/* Title */
.hero-title {
  font-family  : 'Lora', serif;
  font-size    : clamp(24px, 4.2vw, 46px);
  font-weight  : 700;
  color        : var(--white);
  line-height  : 1.2;
  margin-bottom: 10px;
  max-width    : 740px;
}

/* Subtitle row */
.hero-subtitle {
  display     : flex;
  flex-wrap   : wrap;
  align-items : center;
  gap         : 8px;
  color       : rgba(255,255,255,.72);
  font-size   : 14px;
  margin-bottom: 30px;
}
.hero-dot { opacity: .4; }

/* ── HERO STAT STRIP ──────────────────────────────────────── */
.hero-stats {
  display        : flex;
  align-items    : stretch;
  flex-wrap      : wrap;
  gap            : 0;
  background     : rgba(0,0,0,.46);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius  : 14px 14px 0 0;
  padding        : 0;
  overflow       : hidden;
}

.hero-stat {
  display        : flex;
  align-items    : center;
  gap            : 12px;
  padding        : 18px 22px;
  flex           : 1;
  min-width      : 120px;
  border-right   : 1px solid rgba(255,255,255,.1);
}
.hero-stat:last-child { border-right: none; }

.hstat-divider {
  width     : 1px;
  background: rgba(255,255,255,.1);
  align-self: stretch;
  flex-shrink: 0;
}

.hstat-icon {
  width           : 40px;
  height          : 40px;
  border-radius   : 10px;
  background      : rgba(201,149,42,.25);
  border          : 1px solid rgba(201,149,42,.4);
  display         : flex;
  align-items     : center;
  justify-content : center;
  font-size       : 17px;
  color           : var(--gold);
  flex-shrink     : 0;
}

.hstat-info { display: flex; flex-direction: column; gap: 2px; }

.hstat-val {
  font-family  : 'Lora', serif;
  font-size    : 16px;
  font-weight  : 700;
  color        : var(--white);
  line-height  : 1;
}

.hstat-lbl {
  font-size     : 10px;
  color         : rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: .65px;
  font-weight   : 600;
}

/* Price stat (last) */
.hero-stat--price {
  background : rgba(201,149,42,.12);
  gap        : 16px;
  flex-wrap  : wrap;
}

.hstat-from {
  font-size     : 10px;
  text-transform: uppercase;
  letter-spacing: .65px;
  color         : rgba(255,255,255,.5);
  font-weight   : 600;
}

.hstat-price {
  font-family  : 'Lora', serif;
  font-size    : 24px;
  font-weight  : 700;
  color        : var(--gold);
  display      : block;
  line-height  : 1.1;
}

.hstat-book-btn {
  display        : inline-flex;
  align-items    : center;
  gap            : 6px;
  background     : var(--red);
  color          : var(--white);
  font-size      : 13px;
  font-weight    : 700;
  padding        : 9px 18px;
  border-radius  : 8px;
  white-space    : nowrap;
  transition     : var(--ease);
  flex-shrink    : 0;
}
.hstat-book-btn:hover { background: var(--red); color: var(--white); }

/* ============================================================
   IMAGE GALLERY — mosaic, zero gap, images fill cells
============================================================ */
.gallery-section {
  background : var(--white);
  padding    : 0 0 40px;
  line-height: 0; /* removes inline-block gap */
}

/* 5-cell CSS grid mosaic */
.gallery-mosaic {
  display              : grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows   : 280px 200px;
  gap                  : 3px;
  background           : var(--stone); /* gap colour */
  line-height          : 0;
}

/* Cell base */
.gm-cell {
  position   : relative;
  overflow   : hidden;
  cursor     : pointer;
  background : var(--stone);
}

.gm-cell img {
  display   : block;
  width     : 100%;
  height    : 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .5s ease;
}

.gm-cell:hover img { transform: scale(1.06); }

/* Grid placement */
.gm-large     { grid-column: 1 / 3; grid-row: 1; }   /* spans 2 cols, row 1 */
.gm-top-right { grid-column: 3;     grid-row: 1; }   /* top-right */
.gm-btm-left  { grid-column: 1;     grid-row: 2; }
.gm-mid-right { grid-column: 2;     grid-row: 2; }
.gm-btm-right { grid-column: 3;     grid-row: 2; }

/* Hover overlay */
.gm-hover {
  position      : absolute;
  inset         : 0;
  background    : rgba(0,0,0,.3);
  display       : flex;
  align-items   : center;
  justify-content: center;
  font-size     : 22px;
  color         : var(--white);
  opacity       : 0;
  transition    : var(--ease);
}
.gm-cell:hover .gm-hover { opacity: 1; }

/* "View All" last cell */
.gm-last .gm-viewall {
  position       : absolute;
  inset          : 0;
  background     : rgba(0,0,0,.52);
  display        : flex;
  flex-direction : column;
  align-items    : center;
  justify-content: center;
  gap            : 5px;
  color          : var(--white);
  opacity        : 1;
}
.gm-viewall i    { font-size: 26px; }
.gm-viewall span { font-size: 14px; font-weight: 700; line-height: 1.2; }
.gm-viewall small{ font-size: 11px; opacity: .7; }
.gm-last:hover .gm-viewall { background: rgba(0,0,0,.66); }

/* ============================================================
   MAIN SECTION
============================================================ */
.main-section {
  padding   : 36px 0 64px;
  background: var(--cream);
}

/* ============================================================
   TAB NAVIGATION — sticky, full labels, consistent active
============================================================ */
.pkg-tabs {
  display      : flex;
  gap          : 4px;
  flex-wrap    : nowrap;
  background   : var(--white);
  border-radius: var(--r, 12px);
  padding      : 6px;
  box-shadow   : var(--shadow-sm);
  border       : 1px solid var(--stone);
  position     : sticky;
  top          : 0;
  z-index      : 100;
  margin-bottom: 24px;
  overflow-x   : auto;
  scrollbar-width: none;
}
.pkg-tabs::-webkit-scrollbar { display: none; }

.pkg-tab {
  display        : flex;
  align-items    : center;
  justify-content: center;
  gap            : 6px;
  padding        : 9px 14px;
  border-radius  : 8px;
  font-size      : 13px;
  font-weight    : 700;
  color          : var(--muted);
  transition     : var(--ease);
  white-space    : nowrap;
  flex-shrink    : 0;
  text-decoration: none;
  font-family    : 'Nunito', sans-serif;
}
.pkg-tab i       { font-size: 12px; flex-shrink: 0; }
.pkg-tab:hover   { background: var(--gold-lt); color: var(--gold-dk); }
.pkg-tab.is-active {
  background : var(--gold);
  color      : var(--white);
  box-shadow : 0 2px 8px rgba(201,149,42,.35);
}

/* ============================================================
   PACKAGE SECTIONS (accordion cards)
============================================================ */
.pkg-section {
  background   : var(--white);
  border-radius: var(--r, 12px);
  margin-bottom: 20px;
  overflow     : hidden;
  box-shadow   : var(--shadow-sm);
  border       : 1px solid var(--stone);
  scroll-margin-top: 70px;
}

.pkg-section-head {
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  padding        : 20px 24px;
  cursor         : pointer;
  border-bottom  : 1px solid var(--stone);
  transition     : var(--ease);
  user-select    : none;
}
.pkg-section-head:hover { background: var(--gold-lt); }

.pkg-section-head h2 {
  font-family  : 'Lora', serif;
  font-size    : 18px;
  font-weight  : 700;
  margin       : 0;
  display      : flex;
  align-items  : center;
  gap          : 10px;
  color        : var(--ink);
}
.pkg-section-head h2 i { color: var(--gold); font-size: 16px; }

.toggle-arrow {
  color     : var(--gold);
  font-size : 13px;
  transition: transform .3s ease;
  flex-shrink: 0;
}

/* Body — collapsed / expanded */
.pkg-section-body {
  max-height : 0;
  overflow   : hidden;
  padding    : 0 24px;
  transition : max-height .5s ease, padding .3s ease;
}
.pkg-section-body.is-open {
  max-height : 9000px;
  padding    : 28px 24px;
}

/* ── PRICE STRIP ──────────────────────────────────────────── */
.price-strip {
  display      : flex;
  align-items  : stretch;
  gap          : 0;
  background   : var(--stone);
  border-radius: var(--r-sm, 8px);
  overflow     : hidden;
  margin-bottom: 28px;
}

.pstrip-item {
  flex         : 1;
  background   : var(--gold-lt);
  padding      : 16px 20px;
  display      : flex;
  flex-direction: column;
  gap          : 3px;
}
.pstrip-item.pstrip-rec { background: var(--red-lt); }

.pstrip-divider {
  width     : 1px;
  background: var(--stone);
  flex-shrink: 0;
}

.pstrip-lbl  { font-size: 10px; text-transform: uppercase; letter-spacing: .7px; color: var(--muted); font-weight: 700; }
.pstrip-val  { font-family: 'Lora', serif; font-size: 20px; font-weight: 700; color: var(--ink); }
.pstrip-note { font-size: 11px; color: var(--muted); }
.pstrip-badge{
  align-self  : flex-start;
  background  : var(--red);
  color       : var(--white);
  font-size   : 10px;
  font-weight : 700;
  padding     : 2px 9px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: .5px;
}

/* ── SUBSECTION TITLE ────────────────────────────────────── */
.subsection-title {
  font-family  : 'Lora', serif;
  font-size    : 17px;
  font-weight  : 700;
  color        : var(--ink);
  margin-bottom: 14px;
  position     : relative;
  padding-left : 14px;
}
.subsection-title::before {
  content      : '';
  position     : absolute;
  left         : 0;
  top          : 50%;
  transform    : translateY(-50%);
  width        : 4px;
  height       : 66%;
  background   : var(--gold);
  border-radius: 2px;
}

/* Paragraph text */
.pkg-section-body p,
.overview-desc p {
  font-size  : 15px;
  color      : #484040;
  line-height: 1.8;
  margin-bottom: 14px;
}

.section-intro {
  font-size    : 14px;
  color        : var(--muted);
  margin-bottom: 20px;
}

.price-em { color: var(--gold); font-weight: 700; }

/* ── DETAILS TABLE ───────────────────────────────────────── */
.details-table-wrap {
  border-radius: var(--r-sm, 8px);
  overflow     : hidden;
  border       : 1px solid var(--stone);
}

.details-table {
  width      : 100%;
  font-size  : 14px;
  border-collapse: collapse;
}

.details-table th,
.details-table td {
  padding    : 11px 16px;
  border-bottom: 1px solid var(--stone);
  vertical-align: middle;
}

.details-table tbody tr:last-child th,
.details-table tbody tr:last-child td { border-bottom: none; }

.details-table th {
  background  : var(--gold-lt);
  font-weight : 700;
  width       : 36%;
  color       : var(--ink);
}

.details-table tbody tr:hover th,
.details-table tbody tr:hover td { background: var(--cream); }

/* ── HIGHLIGHTS ──────────────────────────────────────────── */
.highlights-grid {
  list-style  : none;
  padding     : 0;
  margin      : 0;
  display     : grid;
  grid-template-columns: repeat(2, 1fr);
  gap         : 10px;
}

.highlight-item {
  display    : flex;
  align-items: center;
  gap        : 10px;
  background : var(--gold-lt);
  border     : 1px solid rgba(201,149,42,.2);
  border-radius: var(--r-sm, 8px);
  padding    : 11px 15px;
  font-size  : 13.5px;
  font-weight: 600;
  color      : var(--ink);
  transition : var(--ease);
}
.highlight-item i         { color: var(--gold); font-size: 15px; flex-shrink: 0; }
.highlight-item:hover     { background: var(--gold); color: var(--white); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.highlight-item:hover i   { color: var(--white); }

/* ============================================================
   ITINERARY
============================================================ */

/* Route track */
.route-track {
  display    : flex;
  align-items: center;
  flex-wrap  : wrap;
  gap        : 0;
  background : var(--ink);
  border-radius: var(--r-sm, 8px);
  padding    : 16px 20px;
  margin-bottom: 18px;
}

.route-stop-wrap {
  display    : flex;
  flex-direction: column;
  align-items: center;
  gap        : 5px;
  color      : var(--white);
  font-size  : 13px;
  font-weight: 700;
  flex-shrink: 0;
}

.rt-dot {
  width        : 10px;
  height       : 10px;
  border-radius: 50%;
  background   : var(--gold);
  border       : 2px solid rgba(255,255,255,.4);
}
.rt-dot--start { background: #6fcf97; }
.rt-dot--end   { background: #6fcf97; }

.route-line {
  flex       : 1;
  min-width  : 50px;
  height     : 2px;
  background : rgba(201,149,42,.5);
  position   : relative;
  margin     : -6px 4px 0;
}
.route-line--return { background: rgba(111,207,151,.4); }

.route-km {
  position   : absolute;
  top        : -18px;
  left       : 50%;
  transform  : translateX(-50%);
  font-size  : 10px;
  color      : rgba(255,255,255,.5);
  white-space: nowrap;
  font-weight: 600;
}

/* Distance chips */
.dist-row {
  display  : flex;
  gap      : 10px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}

.dist-chip {
  flex         : 1;
  min-width    : 130px;
  background   : var(--cream);
  border       : 1px solid var(--stone);
  border-radius: var(--r-sm, 8px);
  padding      : 12px 14px;
  display      : flex;
  flex-direction: column;
  align-items  : center;
  text-align   : center;
  gap          : 3px;
}
.dist-chip i      { color: var(--gold); font-size: 18px; }
.dist-chip span   { font-size: 12px; color: var(--muted); }
.dist-chip strong { font-size: 14.5px; font-weight: 800; color: var(--ink); }

/* Day card */
.day-card {
  border       : 1px solid var(--stone);
  border-radius: var(--r-sm, 8px);
  margin-bottom: 12px;
  overflow     : hidden;
}

.day-card-head {
  display    : flex;
  align-items: center;
  gap        : 14px;
  padding    : 16px 20px;
  cursor     : pointer;
  background : var(--white);
  transition : var(--ease);
  user-select: none;
}
.day-card-head:hover { background: var(--gold-lt); }

.day-badge {
  width          : 50px;
  height         : 50px;
  border-radius  : 12px;
  background     : var(--gold);
  display        : flex;
  flex-direction : column;
  align-items    : center;
  justify-content: center;
  flex-shrink    : 0;
}
.day-num  { font-family: 'Lora', serif; font-size: 20px; font-weight: 700; color: var(--white); line-height: 1; }
.day-word { font-size: 9px; color: rgba(255,255,255,.8); text-transform: uppercase; letter-spacing: .5px; font-weight: 700; }

.day-meta     { flex: 1; }
.day-meta h4  { font-size: 15px; font-weight: 700; margin: 0; }
.day-meta p   { font-size: 12px; color: var(--muted); margin: 3px 0 0; }
.day-arrow    { color: var(--gold); transition: transform .3s ease; flex-shrink: 0; }

.day-card-body {
  max-height: 0;
  overflow  : hidden;
  padding   : 0 20px;
  transition: max-height .4s ease, padding .3s ease;
}
.day-card-body.is-open {
  max-height: 2000px;
  padding   : 16px 20px 20px;
  border-top: 1px solid var(--stone);
}
.day-card-body p { font-size: 14px; color: var(--muted); line-height: 1.75; margin-bottom: 12px; }

.stop-list {
  padding-left: 20px;
  display     : flex;
  flex-direction: column;
  gap         : 8px;
}
.stop-list li { font-size: 14px; line-height: 1.55; }

/* Places covered */
.place-card {
  border       : 1px solid var(--stone);
  border-radius: var(--r-sm, 8px);
  overflow     : hidden;
  background   : var(--white);
  transition   : var(--ease);
  height       : 100%;
}
.place-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }

.place-img {
  height           : 150px;
  background-size  : cover;
  background-position: center;
}
.place-body        { padding: 14px; }
.place-body h5     { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.place-body p      { font-size: 13px; color: var(--muted); margin-bottom: 10px; line-height: 1.6; }

.place-tags        { display: flex; flex-wrap: wrap; gap: 6px; }
.place-tags span   { background: var(--gold-lt); color: var(--gold-dk); font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 20px; }

.optional-badge    { background: var(--stone); color: var(--muted); font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 10px; vertical-align: middle; margin-left: 6px; }

/* ============================================================
   VEHICLE CARDS
============================================================ */
.vehicle-card {
  border       : 1.5px solid var(--stone);
  border-radius: var(--r, 12px);
  background   : var(--white);
  overflow     : hidden;
  transition   : var(--ease);
  position     : relative;
  height       : 100%;
}
.vehicle-card:hover      { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--gold); }
.vehicle-card.is-popular { border-color: var(--gold); }

.vc-popular-badge {
  position    : absolute;
  top         : 12px;
  right       : 12px;
  z-index     : 2;
  background  : var(--gold);
  color       : var(--white);
  font-size   : 11px;
  font-weight : 700;
  padding     : 4px 12px;
  border-radius: 20px;
}

.vc-img { height: 175px; overflow: hidden; }
.vc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.vehicle-card:hover .vc-img img { transform: scale(1.05); }

.vc-body      { padding: 16px 18px; }
.vc-body h4   { font-size: 17px; font-weight: 700; margin-bottom: 10px; }

.vc-specs {
  list-style: none;
  padding   : 0;
  margin    : 0 0 14px;
  display   : flex;
  gap       : 14px;
  flex-wrap : wrap;
}
.vc-specs li { display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--muted); font-weight: 600; }
.vc-specs li i { color: var(--gold); }

.vc-footer {
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  padding-top    : 12px;
  border-top     : 1px solid var(--stone);
}
.vc-price       { font-family: 'Lora', serif; font-size: 22px; font-weight: 700; color: var(--gold-dk); }
.vc-price small { font-size: 12px; color: var(--muted); font-family: 'Nunito', sans-serif; font-weight: 400; }

.vc-book-btn {
  background   : var(--gold);
  color        : var(--white);
  font-size    : 13px;
  font-weight  : 700;
  padding      : 9px 18px;
  border-radius: var(--r-sm, 8px);
  transition   : var(--ease);
  display      : inline-block;
  border       : none;
}
.vc-book-btn:hover { background: var(--gold-dk); color: var(--white); }

/* ============================================================
   INCLUSIONS / EXCLUSIONS
============================================================ */
.inc-card {
  border-radius: var(--r, 12px);
  overflow     : hidden;
  border       : 1px solid var(--stone);
  height       : 100%;
}
.inc-card--yes { border-color: rgba(45,106,53,.25); }
.inc-card--no  { border-color: rgba(184,50,50,.25); }

.inc-head {
  display    : flex;
  align-items: center;
  gap        : 10px;
  padding    : 14px 18px;
  font-size  : 15px;
  font-weight: 700;
}
.inc-card--yes .inc-head { background: rgba(45,106,53,.08); color: var(--green); }
.inc-card--no  .inc-head { background: rgba(184,50,50,.08); color: var(--red); }
.inc-head i    { font-size: 18px; }
.inc-head h4   { margin: 0; font-size: 14.5px; }

.inc-card ul {
  list-style: none;
  padding   : 14px 18px;
  margin    : 0;
  display   : flex;
  flex-direction: column;
  gap       : 9px;
}
.inc-card ul li {
  display    : flex;
  align-items: center;
  gap        : 10px;
  font-size  : 13.5px;
}
.inc-card--yes ul li i { color: var(--green); font-size: 13px; }
.inc-card--no  ul li i { color: var(--red);   font-size: 13px; }

/* ============================================================
   FAQ
============================================================ */
.faq-list     { display: flex; flex-direction: column; gap: 10px; }

.faq-item     { border: 1px solid var(--stone); border-radius: var(--r-sm, 8px); overflow: hidden; }

.faq-q {
  width          : 100%;
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  padding        : 15px 18px;
  background     : var(--white);
  border         : none;
  cursor         : pointer;
  font-family    : 'Nunito', sans-serif;
  font-size      : 14px;
  font-weight    : 700;
  color          : var(--ink);
  text-align     : left;
  gap            : 12px;
  line-height    : 1.5;
  transition     : var(--ease);
}
.faq-q:hover  { background: var(--gold-lt); }
.faq-icon     { color: var(--gold); font-size: 13px; flex-shrink: 0; transition: transform .3s ease; }

.faq-a {
  max-height: 0;
  overflow  : hidden;
  padding   : 0 18px;
  transition: max-height .4s ease, padding .3s ease;
}
.faq-a.is-open { max-height: 500px; padding: 0 18px 16px; border-top: 1px solid var(--stone); }
.faq-a p       { font-size: 14px; color: var(--muted); margin: 14px 0 0; line-height: 1.75; }

/* ============================================================
   TRAVEL TIPS
============================================================ */
.tips-grid {
  list-style  : none;
  padding     : 0;
  margin      : 0;
  display     : grid;
  grid-template-columns: repeat(2, 1fr);
  gap         : 12px;
}
.tip-item {
  display    : flex;
  align-items: flex-start;
  gap        : 12px;
  background : var(--cream);
  border     : 1px solid var(--stone);
  border-radius: var(--r-sm, 8px);
  padding    : 13px;
  font-size  : 13.5px;
  font-weight: 600;
  line-height: 1.5;
  color      : var(--ink);
}
.tip-item i { color: var(--gold); font-size: 17px; margin-top: 1px; flex-shrink: 0; }

/* ============================================================
   SIDEBAR
============================================================ */
.sidebar-sticky {
  position: sticky;
  top     : 70px;
  display : flex;
  flex-direction: column;
  gap     : 18px;
}

.sidebar-card {
  background   : var(--white);
  border-radius: var(--r-xl, 20px);
  box-shadow   : var(--shadow-md);
  overflow     : hidden;
  border       : 1px solid var(--stone);
}

/* Booking card header */
.sc-header {
  background: var(--ink);
  padding   : 20px 22px;
}
.sc-header h3 {
  font-family  : 'Lora', serif;
  font-size    : 17px;
  color        : var(--white);
  margin-bottom: 4px;
  display      : flex;
  align-items  : center;
  gap          : 8px;
}
.sc-header h3 i { color: var(--gold); }
.sc-header p    { font-size: 12px; color: rgba(255,255,255,.55); margin: 0; }

.sc-body { padding: 18px 20px; }

/* Price pill */
.sc-price-pill {
  display      : flex;
  flex-direction: column;
  gap          : 2px;
  background   : var(--gold-lt);
  border       : 1px solid rgba(201,149,42,.25);
  border-radius: var(--r-sm, 8px);
  padding      : 12px 16px;
  margin-bottom: 18px;
}
.scp-from   { font-size: 10px; text-transform: uppercase; letter-spacing: .7px; color: var(--muted); font-weight: 700; }
.scp-amount { font-family: 'Lora', serif; font-size: 28px; font-weight: 700; color: var(--gold-dk); line-height: 1.1; }
.scp-note   { font-size: 11px; color: var(--muted); }

/* Form fields */
.field-row {
  display       : flex;
  flex-direction: column;
  gap           : 5px;
  margin-bottom : 13px;
}
.field-row label {
  font-size     : 11px;
  font-weight   : 700;
  color         : var(--ink);
  text-transform: uppercase;
  letter-spacing: .5px;
  display       : flex;
  align-items   : center;
  gap           : 5px;
}
.field-row label i { color: var(--gold); font-size: 12px; }
.req               { color: var(--red); }

.field-row input,
.field-row select,
.field-row textarea {
  width       : 100%;
  padding     : 10px 13px;
  border      : 1.5px solid var(--stone);
  border-radius: var(--r-sm, 8px);
  font-family : 'Nunito', sans-serif;
  font-size   : 14px;
  color       : var(--ink);
  background  : var(--cream);
  transition  : var(--ease);
  appearance  : none;
  -webkit-appearance: none;
}
.field-row input:focus,
.field-row select:focus,
.field-row textarea:focus {
  outline   : none;
  border-color: var(--gold);
  background: var(--white);
  box-shadow: 0 0 0 3px rgba(201,149,42,.12);
}
.field-row select { cursor: pointer; }
.field-row textarea { resize: vertical; min-height: 78px; }

.field-row-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

/* Quick-contact buttons */
.sc-quick-btns { display: flex; gap: 10px; margin-bottom: 12px; }

.sc-btn {
  flex           : 1;
  display        : flex;
  align-items    : center;
  justify-content: center;
  gap            : 7px;
  padding        : 11px;
  border-radius  : var(--r-sm, 8px);
  font-size      : 13px;
  font-weight    : 700;
  transition     : var(--ease);
  border         : 1.5px solid transparent;
  text-decoration: none;
}
.sc-btn--call { background: var(--cream); border-color: var(--stone); color: var(--ink); }
.sc-btn--call:hover { border-color: var(--gold); color: var(--gold); }
.sc-btn--wa   { background: #25d366; color: var(--white); }
.sc-btn--wa:hover { background: #1db954; color: var(--white); }

/* Submit */
.sc-submit-btn {
  width          : 100%;
  background     : var(--red);
  color          : var(--white);
  border         : none;
  padding        : 13px;
  border-radius  : var(--r-sm, 8px);
  font-family    : 'Nunito', sans-serif;
  font-size      : 15px;
  font-weight    : 800;
  cursor         : pointer;
  transition     : var(--ease);
  display        : flex;
  align-items    : center;
  justify-content: center;
  gap            : 8px;
}
.sc-submit-btn:hover {
  background: var(--gold-dk);
  transform : translateY(-2px);
  box-shadow: 0 6px 18px rgba(201,149,42,.36);
}
.sc-submit-btn:disabled { opacity: .75; cursor: not-allowed; transform: none; }

/* Why card */
.sidebar-card--why .sc-why-header {
  background  : var(--gold);
  color       : var(--white);
  padding     : 14px 20px;
  font-family : 'Lora', serif;
  font-size   : 15px;
  font-weight : 700;
  display     : flex;
  align-items : center;
  gap         : 8px;
}

.why-list {
  list-style: none;
  padding   : 14px 18px;
  margin    : 0;
  display   : flex;
  flex-direction: column;
  gap       : 10px;
}
.why-list li    { display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 600; color: var(--ink); }
.why-list li i  { color: var(--green); font-size: 14px; }

/* Contact card */
.sidebar-card--contact { padding: 24px; text-align: center; }

.sc-contact-icon {
  width          : 56px;
  height         : 56px;
  border-radius  : 50%;
  background     : var(--gold-lt);
  display        : flex;
  align-items    : center;
  justify-content: center;
  font-size      : 24px;
  color          : var(--gold);
  margin         : 0 auto 12px;
}
.sidebar-card--contact h5 { font-size: 16px; margin-bottom: 8px; }
.sidebar-card--contact p  { font-size: 13px; color: var(--muted); margin-bottom: 14px; line-height: 1.6; }

.sc-phone {
  display      : block;
  font-family  : 'Lora', serif;
  font-size    : 19px;
  font-weight  : 700;
  color        : var(--gold-dk);
  margin-bottom: 6px;
  transition   : var(--ease);
}
.sc-phone:hover { color: var(--gold); }
.sc-email { display: block; font-size: 13px; color: var(--muted); transition: var(--ease); }
.sc-email:hover { color: var(--gold); }

/* ============================================================
   RELATED PACKAGES
============================================================ */
.related-section {
  background : var(--white);
  padding    : 60px 0;
  border-top : 1px solid var(--stone);
}

.section-head    { margin-bottom: 40px; }

.section-eyebrow {
  display       : inline-block;
  background    : var(--gold-lt);
  color         : var(--gold-dk);
  font-size     : 11px;
  font-weight   : 700;
  text-transform: uppercase;
  letter-spacing: .9px;
  padding       : 5px 16px;
  border-radius : 20px;
  margin-bottom : 10px;
}
.section-title {
  font-family  : 'Lora', serif;
  font-size    : clamp(22px, 3vw, 34px);
  font-weight  : 700;
  margin-bottom: 8px;
}
.section-desc { color: var(--muted); font-size: 15px; }

/* Related card */
.related-card {
  display      : block;
  border-radius: var(--r, 12px);
  overflow     : hidden;
  border       : 1px solid var(--stone);
  background   : var(--white);
  transition   : var(--ease);
  text-decoration: none;
  color        : inherit;
  height       : 100%;
}
.related-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); color: inherit; }

.rc-img { position: relative; overflow: hidden; height: 190px; }
.rc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.related-card:hover .rc-img img { transform: scale(1.07); }

.rc-duration {
  position    : absolute;
  top         : 12px;
  left        : 12px;
  background  : rgba(0,0,0,.58);
  color       : var(--white);
  font-size   : 11px;
  font-weight : 700;
  padding     : 4px 12px;
  border-radius: 20px;
}

.rc-body   { padding: 14px 16px; }
.rc-body h5 { font-size: 14px; font-weight: 700; margin-bottom: 10px; line-height: 1.45; }

.rc-footer { display: flex; align-items: center; justify-content: space-between; }

.rc-price  { font-family: 'Lora', serif; font-size: 18px; font-weight: 700; color: var(--gold-dk); }

.rc-cta    { font-size: 12px; font-weight: 700; color: var(--gold-dk); background: var(--gold-lt); padding: 5px 12px; border-radius: 8px; transition: var(--ease); }
.related-card:hover .rc-cta { background: var(--gold); color: var(--white); }

/* Swiper */
.related-swiper      { padding-bottom: 32px !important; }
.related-swiper-dots .swiper-pagination-bullet-active { background: var(--gold); }

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

/* ≤ 992px — unstick sidebar */
@media (max-width: 992px) {
  .sidebar-sticky { position: static; }
  .hero-stat { min-width: 110px; }
}

/* ≤ 768px */
@media (max-width: 768px) {
  .hero-banner    { min-height: 420px; }
  .hero-title     { font-size: 26px; }
  .hero-subtitle  { font-size: 13px; }

  /* Hero stats: 2-column grid */
  .hero-stats {
    display             : grid;
    grid-template-columns: 1fr 1fr;
    border-radius       : 10px 10px 0 0;
  }
  .hero-stat  { border-right: 1px solid rgba(255,255,255,.1) !important; border-bottom: 1px solid rgba(255,255,255,.08); }
  .hero-stat:nth-child(2n) { border-right: none !important; }
  .hero-stat:nth-last-child(-n+2) { border-bottom: none; }
  .hstat-divider { display: none; }
  .hero-stat--price { grid-column: 1 / -1; }

  /* Gallery — 2 columns on tablet */
  .gallery-mosaic {
    grid-template-columns: 1fr 1fr;
    grid-template-rows   : 200px 160px 160px;
  }
  .gm-large     { grid-column: 1 / 3; grid-row: 1; }
  .gm-top-right { grid-column: 1;     grid-row: 2; }
  .gm-mid-right { grid-column: 2;     grid-row: 2; }
  .gm-btm-left  { grid-column: 1;     grid-row: 3; }
  .gm-btm-right { grid-column: 2;     grid-row: 3; }

  .pkg-tab span    { font-size: 12px; }
  .highlights-grid { grid-template-columns: 1fr; }
  .tips-grid       { grid-template-columns: 1fr; }
  .price-strip     { flex-direction: column; }
  .pstrip-divider  { width: auto; height: 1px; }
  .dist-row        { flex-direction: column; }
  .field-row-2col  { grid-template-columns: 1fr; }
  .sc-quick-btns   { flex-direction: column; }
}

/* ≤ 576px — mobile */
@media (max-width: 576px) {
  .hero-banner { min-height: 380px; }
  .hero-inner  { padding-top: 90px; }
  .hero-title  { font-size: 22px; }

  /* Gallery single column */
  .gallery-mosaic {
    grid-template-columns: 1fr;
    grid-template-rows   : 220px 140px 140px 0 0;
  }
  .gm-large     { grid-column: 1; grid-row: 1; }
  .gm-top-right { grid-column: 1; grid-row: 2; }
  .gm-mid-right { grid-column: 1; grid-row: 3; }
  .gm-btm-left  { display: none; }
  .gm-btm-right { display: none; }

  /* Tabs — icon only on very small */
  .pkg-tab span { display: none; }
  .pkg-tab i    { font-size: 16px; }
  .pkg-tab      { padding: 10px 14px; }

  .pkg-section-body.is-open { padding: 18px 16px; }
  .pkg-section-head         { padding: 16px 18px; }
}

/*tab*/
 .main-section {
       padding: 36px 0 64px;
       background: var(--cream);
     }

     /* ============================================================
       PRICE STRIP  (inside Overview)
    ============================================================ */
     .price-strip {
       display: flex;
       align-items: stretch;
       background: var(--stone);
       border-radius: var(--r-sm);
       overflow: hidden;
       margin-bottom: 28px;
       gap: 1px;
     }

     .pstrip-item {
       flex: 1;
       background: var(--gold-lt);
       padding: 16px 20px;
       display: flex;
       flex-direction: column;
       gap: 3px;
     }

     .pstrip-item.pstrip-rec {
       background: var(--red-lt);
     }

     .pstrip-lbl {
       font-size: 10px;
       text-transform: uppercase;
       letter-spacing: .7px;
       color: var(--muted);
       font-weight: 700;
     }

     .pstrip-val {
       font-family: 'Lora', serif;
       font-size: 20px;
       font-weight: 700;
       color: var(--ink);
     }

     .pstrip-note {
       font-size: 11px;
       color: var(--muted);
     }

     .pstrip-badge {
       align-self: flex-start;
       background: var(--red);
       color: var(--white);
       font-size: 10px;
       font-weight: 700;
       padding: 2px 9px;
       border-radius: 20px;
       text-transform: uppercase;
       letter-spacing: .5px;
     }

     /* ============================================================
       SUBSECTION TITLE
    ============================================================ */
     .subsection-title {
       font-family: 'Lora', serif;
       font-size: 17px;
       font-weight: 700;
       color: var(--ink);
       margin-bottom: 14px;
       position: relative;
       padding-left: 14px;
     }

     .subsection-title::before {
       content: '';
       position: absolute;
       left: 0;
       top: 50%;
       transform: translateY(-50%);
       width: 4px;
       height: 66%;
       background: var(--gold);
       border-radius: 2px;
     }

     /* ============================================================
       TAB SYSTEM  — THE CORE REDESIGN
    ============================================================ */

     /* Outer wrapper that sticks */
     .pkg-tabs-wrapper {
       position: sticky;
       top: 0;
       z-index: 200;
       background: var(--white);
       box-shadow: 0 2px 0 var(--stone), var(--shadow-sm);
       border-radius: var(--r) var(--r) 0 0;
       margin-bottom: 2px;
       overflow: hidden;
     }

     /* Tab rail */
     .pkg-tab-rail {
       display: flex;
       align-items: stretch;
       gap: 0;
       position: relative;
       overflow-x: auto;
       scrollbar-width: none;
       -ms-overflow-style: none;
       /* pill-style padding on sides */
       padding: 0 6px;
     }

     .pkg-tab-rail::-webkit-scrollbar {
       display: none;
     }

     /* Sliding indicator */
     .pkg-tab-indicator {
       position: absolute;
       bottom: 0;
       left: 0;
       height: var(--indicator-h);
       background: var(--gold);
       border-radius: var(--indicator-h) var(--indicator-h) 0 0;
       transition: left .25s cubic-bezier(.4, 0, .2, 1),
         width .25s cubic-bezier(.4, 0, .2, 1);
       will-change: left, width;
       pointer-events: none;
     }

     /* Individual tab button */
     .pkg-tab-btn {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 7px;
       padding: 10px 18px;
       height: var(--tab-bar-h);
       border: none;
       background: transparent;
       color: var(--muted);
       font-family: 'Nunito', sans-serif;
       font-size: 13.5px;
       font-weight: 700;
       white-space: nowrap;
       flex-shrink: 0;
       cursor: pointer;
       position: relative;
       transition: color .2s ease, background .2s ease;
       border-radius: 0;
       outline: none;
     }

     .pkg-tab-btn i {
       font-size: 13px;
       flex-shrink: 0;
       transition: color .2s ease;
     }

     .pkg-tab-btn:hover {
       color: var(--gold-dk);
       background: var(--gold-lt);
     }

     .pkg-tab-btn:focus-visible {
       outline: 2px solid var(--gold);
       outline-offset: -2px;
     }

     .pkg-tab-btn[aria-selected="true"] {
       color: var(--gold-dk);
     }

     .pkg-tab-btn[aria-selected="true"] i {
       color: var(--gold);
     }

     /* Active background pill behind the active tab */
     .pkg-tab-btn::after {
       content: '';
       position: absolute;
       inset: 8px 4px;
       border-radius: var(--r-sm);
       background: var(--gold-lt);
       opacity: 0;
       transition: opacity .2s ease;
     }

     .pkg-tab-btn[aria-selected="true"]::after,
     .pkg-tab-btn:hover::after {
       opacity: 1;
     }

     .pkg-tab-btn>* {
       position: relative;
       z-index: 1;
     }

     /* ── Tab panels container ─────────────────────────────── */
     .pkg-panels-wrap {
       background: var(--white);
       border-radius: 0 0 var(--r) var(--r);
       box-shadow: var(--shadow-sm);
       border: 1px solid var(--stone);
       border-top: none;
       min-height: 300px;
       position: relative;
       overflow: hidden;
     }

     /* Panel */
     .pkg-panel {
       padding: 32px 28px;
       display: none;
       animation: panelIn .18s ease forwards;
       will-change: opacity, transform;
     }

     .pkg-panel.is-active {
       display: block;
     }

     @keyframes panelIn {
       from {
         opacity: 0;
         transform: translateY(6px);
       }

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

     /* ── Content specific to panels ─────────────────────── */
     .pkg-panel p {
       font-size: 15px;
       color: #484040;
       line-height: 1.8;
       margin-bottom: 14px;
     }

     .price-em {
       color: var(--gold);
       font-weight: 700;
     }

     /* Details table */
     .details-table-wrap {
       border-radius: var(--r-sm);
       overflow: hidden;
       border: 1px solid var(--stone);
     }

     .details-table {
       width: 100%;
       font-size: 14px;
       border-collapse: collapse;
     }

     .details-table th,
     .details-table td {
       padding: 11px 16px;
       border-bottom: 1px solid var(--stone);
       vertical-align: middle;
     }

     .details-table tbody tr:last-child th,
     .details-table tbody tr:last-child td {
       border-bottom: none;
     }

     .details-table th {
       background: var(--gold-lt);
       font-weight: 700;
       width: 36%;
       color: var(--ink);
     }

     .details-table tbody tr:hover th,
     .details-table tbody tr:hover td {
       background: var(--cream);
     }

     /* Highlights grid */
     .highlights-grid {
       list-style: none;
       padding: 0;
       margin: 0;
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       gap: 10px;
     }

     .highlight-item {
       display: flex;
       align-items: center;
       gap: 10px;
       background: var(--gold-lt);
       border: 1px solid rgba(201, 149, 42, .2);
       border-radius: var(--r-sm);
       padding: 11px 15px;
       font-size: 13.5px;
       font-weight: 600;
       color: var(--ink);
       transition: var(--ease);
     }

     .highlight-item i {
       color: var(--gold);
       font-size: 15px;
       flex-shrink: 0;
     }

     .highlight-item:hover {
       background: var(--gold);
       color: var(--white);
       transform: translateY(-2px);
       box-shadow: var(--shadow-sm);
     }

     .highlight-item:hover i {
       color: var(--white);
     }

     /* ── ITINERARY PANEL ─────────────────────────────────── */
     .route-track {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
       background: var(--ink);
       border-radius: var(--r-sm);
       padding: 16px 20px;
       margin-bottom: 18px;
     }

     .route-stop-wrap {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 5px;
       color: var(--white);
       font-size: 13px;
       font-weight: 700;
       flex-shrink: 0;
     }

     .rt-dot {
       width: 10px;
       height: 10px;
       border-radius: 50%;
       background: var(--gold);
       border: 2px solid rgba(255, 255, 255, .4);
     }

     .rt-dot--start,
     .rt-dot--end {
       background: #6fcf97;
     }

     .route-line {
       flex: 1;
       min-width: 40px;
       height: 2px;
       background: rgba(201, 149, 42, .5);
       position: relative;
       margin: -6px 4px 0;
     }

     .route-line--return {
       background: rgba(111, 207, 151, .4);
     }

     .route-km {
       position: absolute;
       top: -18px;
       left: 50%;
       transform: translateX(-50%);
       font-size: 10px;
       color: rgba(255, 255, 255, .5);
       white-space: nowrap;
       font-weight: 600;
     }

     .dist-row {
       display: flex;
       gap: 10px;
       flex-wrap: wrap;
       margin-bottom: 22px;
     }

     .dist-chip {
       flex: 1;
       min-width: 120px;
       background: var(--cream);
       border: 1px solid var(--stone);
       border-radius: var(--r-sm);
       padding: 12px 14px;
       display: flex;
       flex-direction: column;
       align-items: center;
       text-align: center;
       gap: 3px;
     }

     .dist-chip i {
       color: var(--gold);
       font-size: 18px;
     }

     .dist-chip span {
       font-size: 12px;
       color: var(--muted);
     }

     .dist-chip strong {
       font-size: 14.5px;
       font-weight: 800;
       color: var(--ink);
     }

     /* Day card (non-accordion — expanded by default) */
     .day-card {
       border: 1px solid var(--stone);
       border-radius: var(--r-sm);
       margin-bottom: 12px;
       overflow: hidden;
     }

     .day-card-head {
       display: flex;
       align-items: center;
       gap: 14px;
       padding: 16px 20px;
       background: var(--white);
     }

     .day-badge {
       width: 50px;
       height: 50px;
       border-radius: 12px;
       background: var(--gold);
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       flex-shrink: 0;
     }

     .day-num {
       font-family: 'Lora', serif;
       font-size: 20px;
       font-weight: 700;
       color: var(--white);
       line-height: 1;
     }

     .day-word {
       font-size: 9px;
       color: rgba(255, 255, 255, .8);
       text-transform: uppercase;
       letter-spacing: .5px;
       font-weight: 700;
     }

     .day-meta {
       flex: 1;
     }

     .day-meta h4 {
       font-size: 15px;
       font-weight: 700;
       margin: 0;
     }

     .day-meta p {
       font-size: 12px;
       color: var(--muted);
       margin: 3px 0 0;
     }

     .day-card-body {
       padding: 0 20px 20px;
       border-top: 1px solid var(--stone);
       background: var(--cream);
     }

     .day-card-body>p {
       font-size: 14px;
       color: var(--muted);
       line-height: 1.75;
       margin: 14px 0 12px;
     }

     .stop-list {
       padding-left: 20px;
       display: flex;
       flex-direction: column;
       gap: 8px;
       margin: 0;
     }

     .stop-list li {
       font-size: 14px;
       line-height: 1.55;
     }

     /* Place cards */
     .place-card {
       border: 1px solid var(--stone);
       border-radius: var(--r-sm);
       overflow: hidden;
       background: var(--white);
       transition: var(--ease);
       height: 100%;
     }

     .place-card:hover {
       box-shadow: var(--shadow-md);
       transform: translateY(-3px);
     }

     .place-img {
       height: 150px;
       background-size: cover;
       background-position: center;
     }

     .place-body {
       padding: 14px;
     }

     .place-body h5 {
       font-size: 15px;
       font-weight: 700;
       margin-bottom: 6px;
     }

     .place-body p {
       font-size: 13px;
       color: var(--muted);
       margin-bottom: 10px;
       line-height: 1.6;
     }

     .place-tags {
       display: flex;
       flex-wrap: wrap;
       gap: 6px;
     }

     .place-tags span {
       background: var(--gold-lt);
       color: var(--gold-dk);
       font-size: 11px;
       font-weight: 700;
       padding: 3px 10px;
       border-radius: 20px;
     }

     .optional-badge {
       background: var(--stone);
       color: var(--muted);
       font-size: 10px;
       font-weight: 700;
       padding: 2px 8px;
       border-radius: 10px;
       vertical-align: middle;
       margin-left: 6px;
     }

     /* ── VEHICLE PANEL ───────────────────────────────────── */
     .vehicle-card {
       border: 1.5px solid var(--stone);
       border-radius: var(--r);
       background: var(--white);
       overflow: hidden;
       transition: var(--ease);
       position: relative;
       height: 100%;
     }

     .vehicle-card:hover {
       transform: translateY(-4px);
       box-shadow: var(--shadow-lg);
       border-color: var(--gold);
     }

     .vehicle-card.is-popular {
       border-color: var(--gold);
     }

     .vc-popular-badge {
       position: absolute;
       top: 12px;
       right: 12px;
       z-index: 2;
       background: var(--gold);
       color: var(--white);
       font-size: 11px;
       font-weight: 700;
       padding: 4px 12px;
       border-radius: 20px;
     }

     .vc-img {
       height: 175px;
       overflow: hidden;
     }

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

     .vehicle-card:hover .vc-img img {
       transform: scale(1.05);
     }

     .vc-body {
       padding: 16px 18px;
     }

     .vc-body h4 {
       font-size: 17px;
       font-weight: 700;
       margin-bottom: 10px;
     }

     .vc-specs {
       list-style: none;
       padding: 0;
       margin: 0 0 14px;
       display: flex;
       gap: 14px;
       flex-wrap: wrap;
     }

     .vc-specs li {
       display: flex;
       align-items: center;
       gap: 5px;
       font-size: 13px;
       color: var(--muted);
       font-weight: 600;
     }

     .vc-specs li i {
       color: var(--gold);
     }

     .vc-footer {
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding-top: 12px;
       border-top: 1px solid var(--stone);
     }

     .vc-price {
       font-family: 'Lora', serif;
       font-size: 22px;
       font-weight: 700;
       color: var(--gold-dk);
     }

     .vc-price small {
       font-size: 12px;
       color: var(--muted);
       font-family: 'Nunito', sans-serif;
       font-weight: 400;
     }

     .vc-book-btn {
       background: var(--gold);
       color: var(--white);
       font-size: 13px;
       font-weight: 700;
       padding: 9px 18px;
       border-radius: var(--r-sm);
       transition: var(--ease);
       display: inline-block;
       text-decoration: none;
     }

     .vc-book-btn:hover {
       background: var(--gold-dk);
       color: var(--white);
     }

     .section-intro {
       font-size: 14px;
       color: var(--muted);
       margin-bottom: 20px;
     }

     /* ── INCLUSIONS PANEL ────────────────────────────────── */
     .inc-card {
       border-radius: var(--r);
       overflow: hidden;
       border: 1px solid var(--stone);
       height: 100%;
     }

     .inc-card--yes {
       border-color: rgba(45, 106, 53, .25);
     }

     .inc-card--no {
       border-color: rgba(184, 50, 50, .25);
     }

     .inc-head {
       display: flex;
       align-items: center;
       gap: 10px;
       padding: 14px 18px;
       font-size: 15px;
       font-weight: 700;
     }

     .inc-card--yes .inc-head {
       background: rgba(45, 106, 53, .08);
       color: var(--green);
     }

     .inc-card--no .inc-head {
       background: rgba(184, 50, 50, .08);
       color: var(--red);
     }

     .inc-head i {
       font-size: 18px;
     }

     .inc-head h4 {
       margin: 0;
       font-size: 14.5px;
     }

     .inc-card ul {
       list-style: none;
       padding: 14px 18px;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 9px;
     }

     .inc-card ul li {
       display: flex;
       align-items: center;
       gap: 10px;
       font-size: 13.5px;
     }

     .inc-card--yes ul li i {
       color: var(--green);
       font-size: 13px;
     }

     .inc-card--no ul li i {
       color: var(--red);
       font-size: 13px;
     }

     /* ── FAQ PANEL ───────────────────────────────────────── */
     .faq-list {
       display: flex;
       flex-direction: column;
       gap: 10px;
     }

     .faq-item {
       border: 1px solid var(--stone);
       border-radius: var(--r-sm);
       overflow: hidden;
     }

     .faq-q {
       width: 100%;
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding: 15px 18px;
       background: var(--white);
       border: none;
       cursor: pointer;
       font-family: 'Nunito', sans-serif;
       font-size: 14px;
       font-weight: 700;
       color: var(--ink);
       text-align: left;
       gap: 12px;
       line-height: 1.5;
       transition: var(--ease);
     }

     .faq-q:hover {
       background: var(--gold-lt);
     }

     .faq-icon {
       color: var(--gold);
       font-size: 13px;
       flex-shrink: 0;
       transition: transform .3s ease;
     }

     .faq-a {
       max-height: 0;
       overflow: hidden;
       padding: 0 18px;
       transition: max-height .4s ease, padding .3s ease;
     }

     .faq-a.is-open {
       max-height: 500px;
       padding: 0 18px 16px;
       border-top: 1px solid var(--stone);
     }

     .faq-a p {
       font-size: 14px;
       color: var(--muted);
       margin: 14px 0 0;
       line-height: 1.75;
     }

     /* ── TRAVEL TIPS PANEL ───────────────────────────────── */
     .tips-grid {
       list-style: none;
       padding: 0;
       margin: 0;
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       gap: 12px;
     }

     .tip-item {
       display: flex;
       align-items: flex-start;
       gap: 12px;
       background: var(--cream);
       border: 1px solid var(--stone);
       border-radius: var(--r-sm);
       padding: 13px;
       font-size: 13.5px;
       font-weight: 600;
       line-height: 1.5;
       color: var(--ink);
     }

     .tip-item i {
       color: var(--gold);
       font-size: 17px;
       margin-top: 1px;
       flex-shrink: 0;
     }

     /* ============================================================
       SIDEBAR (unchanged from original)
    ============================================================ */
     .sidebar-sticky {
       position: sticky;
       top: 70px;
       display: flex;
       flex-direction: column;
       gap: 18px;
     }

     .sidebar-card {
       background: var(--white);
       border-radius: var(--r-xl);
       box-shadow: var(--shadow-md);
       overflow: hidden;
       border: 1px solid var(--stone);
     }

     .sc-header {
       background: var(--ink);
       padding: 20px 22px;
     }

     .sc-header h3 {
       font-family: 'Lora', serif;
       font-size: 17px;
       color: var(--white);
       margin-bottom: 4px;
       display: flex;
       align-items: center;
       gap: 8px;
     }

     .sc-header h3 i {
       color: var(--gold);
     }

     .sc-header p {
       font-size: 12px;
       color: rgba(255, 255, 255, .55);
       margin: 0;
     }

     .sc-body {
       padding: 18px 20px;
     }

     .sc-price-pill {
       display: flex;
       flex-direction: column;
       gap: 2px;
       background: var(--gold-lt);
       border: 1px solid rgba(201, 149, 42, .25);
       border-radius: var(--r-sm);
       padding: 12px 16px;
       margin-bottom: 18px;
     }

     .scp-from {
       font-size: 10px;
       text-transform: uppercase;
       letter-spacing: .7px;
       color: var(--muted);
       font-weight: 700;
     }

     .scp-amount {
       font-family: 'Lora', serif;
       font-size: 28px;
       font-weight: 700;
       color: var(--gold-dk);
       line-height: 1.1;
     }

     .scp-note {
       font-size: 11px;
       color: var(--muted);
     }

     .field-row {
       display: flex;
       flex-direction: column;
       gap: 5px;
       margin-bottom: 13px;
     }

     .field-row label {
       font-size: 11px;
       font-weight: 700;
       color: var(--ink);
       text-transform: uppercase;
       letter-spacing: .5px;
       display: flex;
       align-items: center;
       gap: 5px;
     }

     .field-row label i {
       color: var(--gold);
       font-size: 12px;
     }

     .req {
       color: var(--red);
     }

     .field-row input,
     .field-row select,
     .field-row textarea {
       width: 100%;
       padding: 10px 13px;
       border: 1.5px solid var(--stone);
       border-radius: var(--r-sm);
       font-family: 'Nunito', sans-serif;
       font-size: 14px;
       color: var(--ink);
       background: var(--cream);
       transition: var(--ease);
       appearance: none;
       -webkit-appearance: none;
     }

     .field-row input:focus,
     .field-row select:focus,
     .field-row textarea:focus {
       outline: none;
       border-color: var(--gold);
       background: var(--white);
       box-shadow: 0 0 0 3px rgba(201, 149, 42, .12);
     }

     .field-row textarea {
       resize: vertical;
       min-height: 78px;
     }

     .field-row-2col {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 10px;
     }

     .sc-quick-btns {
       display: flex;
       gap: 10px;
       margin-bottom: 12px;
     }

     .sc-btn {
       flex: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 7px;
       padding: 11px;
       border-radius: var(--r-sm);
       font-size: 13px;
       font-weight: 700;
       transition: var(--ease);
       border: 1.5px solid transparent;
       text-decoration: none;
     }

     .sc-btn--call {
       background: var(--cream);
       border-color: var(--stone);
       color: var(--ink);
     }

     .sc-btn--call:hover {
       border-color: var(--gold);
       color: var(--gold);
     }

     .sc-btn--wa {
       background: #25d366;
       color: var(--white);
     }

     .sc-btn--wa:hover {
       background: #1db954;
       color: var(--white);
     }

     .sc-submit-btn {
       width: 100%;
       background: var(--red);
       color: var(--white);
       border: none;
       padding: 13px;
       border-radius: var(--r-sm);
       font-family: 'Nunito', sans-serif;
       font-size: 15px;
       font-weight: 800;
       cursor: pointer;
       transition: var(--ease);
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 8px;
     }

     .sc-submit-btn:hover {
       background: var(--gold-dk);
       transform: translateY(-2px);
       box-shadow: 0 6px 18px rgba(201, 149, 42, .36);
     }

     .sc-submit-btn:disabled {
       opacity: .75;
       cursor: not-allowed;
       transform: none;
     }

     .sidebar-card--why .sc-why-header {
       background: var(--red);
       color: var(--white);
       padding: 14px 20px;
       font-family: 'Lora', serif;
       font-size: 15px;
       font-weight: 700;
       display: flex;
       align-items: center;
       gap: 8px;
     }

     .why-list {
       list-style: none;
       padding: 14px 18px;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 10px;
     }

     .why-list li {
       display: flex;
       align-items: center;
       gap: 10px;
       font-size: 13.5px;
       font-weight: 600;
       color: var(--ink);
     }

     .why-list li i {
       color: var(--green);
       font-size: 14px;
     }

     .sidebar-card--contact {
       padding: 24px;
       text-align: center;
     }

     .sc-contact-icon {
       width: 56px;
       height: 56px;
       border-radius: 50%;
       background: var(--gold-lt);
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 24px;
       color: var(--gold);
       margin: 0 auto 12px;
     }

     .sidebar-card--contact h5 {
       font-size: 16px;
       margin-bottom: 8px;
     }

     .sidebar-card--contact p {
       font-size: 13px;
       color: var(--muted);
       margin-bottom: 14px;
       line-height: 1.6;
     }

     .sc-phone {
       display: block;
       font-family: 'Lora', serif;
       font-size: 19px;
       font-weight: 700;
       color: var(--gold-dk);
       margin-bottom: 6px;
       transition: var(--ease);
     }

     .sc-phone:hover {
       color: var(--gold);
     }

     .sc-email {
       display: block;
       font-size: 13px;
       color: var(--muted);
       transition: var(--ease);
       text-decoration: none;
     }

     .sc-email:hover {
       color: var(--gold);
     }

     /* ============================================================
       RESPONSIVE
    ============================================================ */
     @media (max-width: 992px) {
       .sidebar-sticky {
         position: static;
       }
     }

     @media (max-width: 768px) {
       .main-section {
         padding: 20px 0 48px;
       }

       .pkg-panel {
         padding: 20px 16px;
       }

       .pkg-tab-btn {
         padding: 0 12px;
         font-size: 12.5px;
         gap: 5px;
       }

       .highlights-grid {
         grid-template-columns: 1fr;
       }

       .tips-grid {
         grid-template-columns: 1fr;
       }

       .price-strip {
         flex-direction: column;
       }

       .dist-row {
         flex-direction: column;
       }

       .field-row-2col {
         grid-template-columns: 1fr;
       }

       .sc-quick-btns {
         flex-direction: column;
       }
     }

     @media (max-width: 576px) {
       .pkg-tab-btn span {
         display: none;
       }

       .pkg-tab-btn i {
         font-size: 16px;
       }

       .pkg-tab-btn {
         padding: 0 14px;
       }

       .pkg-tab-rail {
         padding: 0 2px;
       }
     }