/* Shared spacing and responsive layout. Loaded after page-specific styles. */
:root { --dark: var(--black); }
body { line-height: 1.6; }
h1, h2 { line-height: 1.15; }
h3, h4, h5, h6 { line-height: 1.35; }
.site-nav, .home-page .site-nav {
  position: absolute; inset: 20px clamp(16px, 3vw, 48px) auto;
  height: 76px; padding: 0 26px; gap: 22px;
  background: #fff; border: 1px solid #e7eeeb; border-radius: 999px;
  box-shadow: 0 8px 28px #102f3312;
}
.site-nav.scrolled { box-shadow: 0 8px 28px #102f3312; }
.site-links { gap: clamp(18px, 2vw, 30px); }
.site-links a, .site-nav-actions a { font-size: 14px; font-weight: 500; line-height: 1.4; }
.site-nav-actions { gap: 20px; }
.site-brand span { font-size: clamp(21px, 2vw, 28px); }
.site-nav-actions .site-plan-link { padding: 12px 20px; }
.page-hero, .post-hero { padding-top: 160px; padding-bottom: 64px; }
.page-hero h1, .post-hero h1 { margin-bottom: 22px; }
.page-hero p, .post-hero p { margin-top: 16px; }
body:has(.coming-soon) .coming-soon { padding-top: 170px; }
.escape-hero { min-height: 560px; }
.escape-copy { top: max(145px, 25.3%); }
.tour-hero { height: auto; min-height: clamp(580px, 78svh, 820px); display: flex; }
.tour-hero > .container { position: relative; display: flex; width: 100%; }
.tour-hero-content { height: auto; width: 100%; padding-top: 150px; padding-bottom: clamp(36px, 5vw, 72px); justify-content: flex-end; }
.tour-hero-content h1 { line-height: 1.15; margin: 0; }
.tour-hero-meta { gap: 10px; margin-top: 24px; }
.tour-badge { line-height: 1.5; }
.dest-hero { height: auto; min-height: 580px; display: flex; align-items: flex-end; }
.dest-hero-content { position: relative; width: 100%; padding-top: 150px; }
.tour-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(28px, 4vw, 56px); }
.dest-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; }
.tour-layout > *, .dest-layout > *, .itinerary-day > *, .accom-body,
.includes-grid > *, .get-here-grid > *, .get-here-items > *, .tour-card-body, .mini-tour-body { min-width: 0; }
.tour-highlights { gap: 20px 24px; padding: 28px; }
.tour-highlights li.hi-check {
  width: auto; height: auto; min-width: 0; margin: 0; padding: 0;
  border-radius: 0; background: transparent; color: var(--black);
  justify-content: flex-start; font-weight: 400; line-height: 1.7;
}
.tour-highlights li.hi-check::before { margin-top: 3px; }
.route-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
.route-stats .stat, .route-stat { min-width: 0; padding: 20px 12px; gap: 8px; }
.stat-val, .rs-val { line-height: 1.3; margin: 0; font-weight: 400; }
.stat-label, .rs-key { line-height: 1.5; overflow-wrap: anywhere; }
.tour-section, .dest-section { margin-bottom: 52px; }
.tour-section h2, .dest-section h2 { margin-bottom: 20px; }
.tour-section h4 { margin-bottom: 10px; }
.tour-section p, .accom-body p { line-height: 1.8; }
.itinerary-day { gap: 24px; padding: 24px 0; }
.day-num { line-height: 1.5; }
.includes-grid { gap: 18px 24px; }
.include-item { line-height: 1.7; }
.booking-detail { gap: 20px; align-items: flex-start; padding: 12px 0; }
.booking-detail .val { text-align: right; }
.booking-card .btn { white-space: normal; line-height: 1.5; }
.booking-guarantee { line-height: 1.6; }
div.season-pricing table, table.season-pricing { table-layout: fixed; }
.season-pricing th, .season-pricing td { overflow-wrap: anywhere; line-height: 1.6; }
.faq-question { text-align: left; line-height: 1.6; }
.faq-item.open .faq-answer { max-height: none; }
.tour-card, .mini-tour-card { display: flex; flex-direction: column; height: 100%; }
.tour-card-img, .mini-tour-img { flex-shrink: 0; }
.tour-card-body, .mini-tour-body { flex: 1; display: flex; flex-direction: column; gap: 12px; }
.tour-card-body h4, .mini-tour-body h4 { margin: 0; line-height: 1.4; }
.tour-card-top { gap: 12px; flex-wrap: wrap; }
.tour-card-body .tour-card-description, .mini-tour-body .tour-card-description { margin: 0; font: 400 14px/1.75 var(--font-body); color: #52605d; }
.tour-card-body .tour-card-availability, .mini-tour-body .tour-card-availability { align-self: flex-start; margin: 0; padding: 5px 10px; border-radius: 7px; background: #edf4f1; color: var(--accent); font: 500 12px/1.5 var(--font-body); }
.tour-card-footer, .mini-tour-price { margin-top: auto; padding-top: 16px; }
.tour-card-footer { flex-wrap: wrap; gap: 12px; }
.tour-card-body .meta { line-height: 1.6; flex-wrap: wrap; }
.post-tours-grid { align-items: stretch; }
.footer-bottom { gap: 20px; flex-wrap: wrap; }
.has-sticky-bar { padding-bottom: 76px; }
@media (max-width: 1200px) {
  .site-links { display: none !important; }
  .site-nav .nav-hamburger { display: flex; }
  .site-nav-actions { margin-left: auto; }
  .site-nav-actions > a:not(.site-plan-link) { display: none; }
}
@media (max-width: 1000px) {
  .tour-layout, .dest-layout { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .booking-card { position: static; }
}
@media (max-width: 600px) {
  .site-nav, .home-page .site-nav { inset: 14px 14px auto; height: 64px; padding: 0 18px; gap: 12px; }
  .site-brand span { font-size: 21px; }
  .site-nav-actions { display: none; }
  .page-hero, .post-hero { padding-top: 125px; padding-bottom: 44px; }
  .tour-hero, .dest-hero { min-height: 660px; }
  .tour-hero-content { padding-top: 120px; padding-bottom: 34px; }
  .tour-hero-content h1, .dest-hero-content h1 { font-size: clamp(36px, 10vw, 52px); }
  .tour-badge { padding: 7px 11px; font-size: 12px; }
  .tour-highlights { grid-template-columns: 1fr; padding: 22px; gap: 18px; }
  .itinerary-day { grid-template-columns: 1fr; gap: 10px; }
  .accom-block { padding: 22px; gap: 14px; }
  .accom-body p { font-size: 14px; }
  .get-here-grid, .get-here-items { grid-template-columns: 1fr; }
  .sp-row { padding: 12px; gap: 10px; }
  div.season-pricing th, div.season-pricing td, table.season-pricing th, table.season-pricing td { padding: 12px 8px; font-size: 12px; }
  .tour-card-body, .mini-tour-body { padding: 22px; }
  .home-page .why-grid { grid-template-columns: 1fr !important; }
}

/* Space between section labels and large text; stable image slots on phones. */
.label { margin-bottom: 16px; line-height: 1.6; }
.booking-price { padding-top: 8px; line-height: 1.3; }
.booking-card .label { margin-bottom: 4px; }
.mini-tour-body p.tour-card-description, .mini-tour-body p.tour-card-availability { flex: none; }
.tour-highlights li.hi-check::before { display: none; }
.tour-highlights li.hi-check > .lucide { color: var(--accent); width: 20px; height: 20px; margin-top: 3px; }
@media (max-width: 600px) {
  .tour-gallery .g-img { min-height: 210px; }
  .tour-gallery .g-img img { min-height: 210px; }
  .site-nav .site-brand span { font-size: clamp(18px, 5.4vw, 21px); }
}

/* Header logo and readable, three-field trip planner. */
.site-nav .brand-mark, .mobile-nav-header .brand-mark { width: 52px; height: 52px; object-fit: contain; flex-shrink: 0; }
.site-brand .brand-wordmark { display: flex; align-items: baseline; font-family: var(--font-head); font-weight: 400; letter-spacing: -.6px; }
.site-brand .brand-wordmark strong { font-weight: 700; }
.site-brand .brand-wordmark > span { font: inherit; letter-spacing: inherit; }
.trip-planner { padding: 28px; }
.trip-planner h2 { font-size: 28px; margin-bottom: 22px; }
.planner-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.planner-field { padding: 18px; grid-template-columns: 22px minmax(0, 1fr); grid-template-rows: 24px 30px; gap: 8px 12px; }
.planner-field > span:first-of-type { font-size: 14px; font-weight: 500; }
.planner-field select, .planner-field input { height: 30px; font-size: 16px; line-height: 1.5; }
.planner-date input { grid-area: 2 / 2; }
.planner-field .date-placeholder { position: static; grid-area: 2 / 2; font-size: 16px; line-height: 30px; z-index: 1; }
.planner-field > .lucide { width: 22px; height: 22px; }
.find-trip { padding: 18px 22px; font-size: 15px; }
@media (max-width: 1100px) {
  #trip-planner-form { flex-direction: column; align-items: stretch; }
  .planner-fields { grid-template-columns: 1fr; }
  .planner-field + .planner-field { border-left: 0; border-top: 1px solid #eef0ef; }
  .find-trip { align-self: stretch; }
}
@media (max-width: 600px) {
  .site-nav .brand-mark, .mobile-nav-header .brand-mark { width: 40px; height: 40px; }
  .site-brand .brand-wordmark { font-size: 21px; }
  .mobile-nav-header .site-brand { gap: 4px; }
  .mobile-nav-header .brand-wordmark { font-size: 19px; }
  .trip-planner { padding: 22px 18px; }
  .trip-planner h2 { font-size: 26px; }
  .planner-field { padding: 16px 12px; }
}