/* site-base.css — split from shared.css (lines 67-139), 2026-08-17.
   reset, html/body, :root design tokens, element defaults, focus rings, scrollbars
   LOAD ORDER IS LOAD-BEARING. Link in this exact sequence, after nothing and
   before the engine-*.css layer:
     site-fonts.css -> site-base.css -> site-atoms.css -> site-chrome.css -> site-page-furniture.css -> site-footer-forms.css -> site-marketing.css -> site-extras.css
   Slices are CONTIGUOUS: rule order is unchanged from shared.css, so the cascade is
   equivalent by construction. Some selectors are redefined in a later module on
   purpose — do not reorder, and do not "tidy" rules between files.
   shared.css itself is UNTOUCHED on disk and still serves the other 17 pages. */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

:root {
  /* v4 PREVIEW palette (2026-07-18): slate + stone-band leaders flowing over a
     navy-charcoal base. Panels carry ALPHA so the navy base blends through;
     --mottle adds the stone texture. Production still ships the green palette. */
  --forest:    #0D1119;
  --parchment: #F5F0E8;
  --gold:      #C9A96E;
  --pine:      rgba(54,66,83,0.40);
  --sage:      #929AA0;
  --mist:      #3A4149;
  --slate:     #364253;
  --mottle: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='420' height='420'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='3' seed='7' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='linear' slope='0.07'/></feComponentTransfer></filter><rect width='100%25' height='100%25' filter='url(%23m)' fill='white'/></svg>"),
            url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='3' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='linear' slope='0.035'/></feComponentTransfer></filter><rect width='100%25' height='100%25' filter='url(%23g)' fill='white'/></svg>");
  --gold-dim:  rgba(201,169,110,0.12);
  --gold-line: rgba(201,169,110,0.35);

  --display: 'Cormorant Garamond', Georgia, serif;
  --body:    'Inter', system-ui, -apple-system, sans-serif;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --radius: 14px;
  --radius-sm: 10px;
  --gold-border: rgba(201,169,110,0.62);
  --highlight:   #D2CC78;  /* meadow gold — champagne with green undertone */
}

body {
  background: var(--forest);
  background-image: var(--mottle);
  color: var(--parchment);
  font-family: var(--body);
  font-weight: 500;
  font-size: 19px;
  line-height: 1.68;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font-family: var(--body); cursor: pointer; }

/* ── HEADING FONT INHERITANCE ── */
/* h2/h3 inherit Inter from body by default — force display font site-wide */
h1, h2, h3 { font-family: var(--display); }

/* ── TAP HIGHLIGHT ── */
* { -webkit-tap-highlight-color: rgba(0,0,0,0); }

/* ── FOCUS STYLES (keyboard navigation) ── */
:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}
:focus:not(:focus-visible) { outline: none; }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--forest); }
::-webkit-scrollbar-thumb { background: var(--mist); }
::-webkit-scrollbar-thumb:hover { background: var(--gold); }
* { scrollbar-width: thin; scrollbar-color: var(--mist) var(--forest); }

/* ── UTILITY ── */