/* palette-source: sampled — from the shop's own Google photos, accent matched to the sign; see the comment below */
/*
  BRAND TOKENS — the only stylesheet the builder edits for colour and type.
  Everything in base.css reads from these variables. Keep every value here
  traceable to the shop's own branding (logo, shopfront, Instagram grid) or to
  the design-system run recorded in company-profile.md.

  palette-source: sampled from Nico's own Google-attributed photos with
  scripts/palette.mjs (clients/nicos-clondalkin/assets/google/owner-01/02/08/10.jpg),
  with two deliberate overrides recorded in company-profile.md → Brand:
  primary uses the second-darkest legitimate cluster the tool found (not its
  first pick) to keep clear of an already very similarly-hued build elsewhere
  in the portfolio; accent replaces the tool's literal top pick (a magenta
  sampled from a carnival ride reflected in the shop's window, not the shop's
  own colour) with the conventional warm terracotta, matching the orange
  lettering visible through the glass in owner-01.jpg.
*/
:root {
  /* Colour */
  --color-primary: #383415;        /* toasted-crust brown, sampled from the sandwich/counter photos (owner-02.jpg cluster, 17.5% presence), darkened to heading weight */
  --color-on-primary: #f8f7f2;     /* text on primary */
  --color-accent: #a3421f;         /* terracotta — the sign's orange lettering (owner-01.jpg), not the incidental carnival-reflection magenta the tool first found */
  --color-on-accent: #ffffff;      /* text on accent */
  --color-bg: #f8f7f2;             /* page background */
  --color-surface: #fdfdfc;        /* cards, menu panels */
  --color-ink: #23221a;            /* body text */
  --color-muted: #6d6b5a;          /* secondary text */
  --color-border: #e7e6da;         /* hairlines */

  /* Type — set the Google Fonts import in fonts.css to match */
  --font-display: "Baloo 2", "Fredoka", system-ui, sans-serif;
  --font-body: "Karla", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 700;
  --display-tracking: 0em;
  --display-transform: none;       /* uppercase for shouty brands, none otherwise */

  /* Shape and texture */
  --radius: 4px;                   /* old-shop, printed-card feel; the archetype squares most components off explicitly */
  --radius-sm: 4px;
  --hero-overlay: linear-gradient(180deg, rgba(30, 24, 10, 0.28), rgba(30, 24, 10, 0.68));
  --shadow: 0 10px 30px rgba(35, 34, 26, 0.08);
}