* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Manrope', sans-serif;
  background: var(--ivory);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  position: relative;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.serif { font-family: 'Fraunces', serif; }
.mono { font-family: 'JetBrains Mono', monospace; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

/* Horizontal padding is intentionally small — it's just a minimal true-edge margin.
   The real outer reservation is --navie-lane, applied by .section-inner below, so the
   two don't double up and squeeze the content column. */
section { position: relative; padding: 130px 3vw; z-index: 2; }

/* ================= Navie travel lane =================
   Every section's actual content sits inside .section-inner, which caps its own width
   so a guaranteed-empty strip (--navie-lane) remains on both outer edges of the section,
   all the way down the page. Navie travels through that strip — see js/navie.js — without
   ever needing to detect or dodge content, because content structurally can't reach it. */
.section-inner {
  max-width: min(var(--content-max), calc(100% - 2 * var(--navie-lane)));
  margin-inline: auto;
}

h1, h2, h3 { font-family: 'Fraunces', serif; font-weight: 500; line-height: 1.08; letter-spacing: -0.01em; color: var(--ink); }
/* Phase 4B: re-tuned for the new headline ("Explore real places." is longer than the
   previous longest line, "Travel smarter.") using the same empirical per-width safe-size
   measurement as the original tuning — see the two tiers in responsive.css this pairs
   with for the 981-1439px two-column band. */
h1 { font-size: clamp(36px, 4.7vw, 50px); }
h2 { font-size: clamp(32px, 4.4vw, 48px); }
h3 { font-size: 21px; font-weight: 600; }
.on-navy h1, .on-navy h2, .on-navy h3, section.navy h1, section.navy h2, section.navy h3 { color: var(--paper); }

p { line-height: 1.7; color: var(--ink-soft); font-size: 17px; }
section.navy p { color: var(--navy-soft); }
