/* palette-source: sampled — written by palette.mjs on 2026-09-17 */
/*
  BRAND TOKENS — the only stylesheet the builder edits for colour and type.
  Colour is sampled from Hatch's own photographs (near-black cups, machines and
  window frames for the primary; the shop's own gold window lettering, cropped
  and fed back through palette.mjs --brand, for the accent). See
  company-profile.md -> Brand for the full run and every contrast check.
*/
:root {
  /* Colour */
  --color-primary: #120d0d; --color-on-primary: #f8f2f2; --color-accent: #826839; --color-on-accent: #ffffff; --color-bg: #f8f2f2; --color-surface: #fdfcfc; --color-ink: #231b1a; --color-muted: #766260; --color-border: #e7dbda;

  /* Type — a flat-serif Roman book face for the letter-spaced gold capitals on
     Hatch's own window, paired with a plain geometric sans for body text. */
  --font-display: "Arvo", Rockwell, Georgia, "Times New Roman", serif;
  --font-body: "Karla", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 700;
  --display-tracking: 0.02em;
  --display-transform: uppercase;

  /* Shape and texture */
  --radius: 10px;
  --radius-sm: 6px;
  --hero-overlay: linear-gradient(180deg, rgba(18, 13, 13, 0.16), rgba(18, 13, 13, 0.55));
  --shadow: 0 10px 30px rgba(18, 13, 13, 0.08);
}