/* palette-source: sampled — written by palette.mjs on 2026-09-24 */
/* 2026-09-24: primary moved from sampled roast brown #3a2e22 to the badge slate: tiles + brown collided with coffee-breaks-skerries in variety-check. */
/*
  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.

  Provenance note (honest, not just "sampled"): --color-primary/--color-bg/
  --color-ink etc. are genuinely sampled from the shop's only photo (a Google
  owner-attributed collage) and from a crop of its logo badge. --color-accent
  is NOT a measured brand colour: the source photo has no second saturated
  hue (the logo's script is a desaturated slate-grey, below the tool's own
  chromatic threshold even sampled on its own), so palette.mjs fell back to
  its conventional terracotta café default. Re-run palette.mjs if the shop
  ever supplies a cleaner shopfront/signage/cup photo.
*/
:root {
  /* Colour */
  --color-primary: #3d4347;        /* main brand colour: the slate of the badge's "River" script (#5a5d60, sampled from the logo crop), deepened for contrast */
  --color-on-primary: #f8f5f2;     /* text on primary */
  --color-accent: #b2572a;         /* buttons, links, highlights — template fallback, not measured, see note above */
  --color-on-accent: #ffffff;      /* text on accent */
  --color-bg: #f8f5f2;             /* page background */
  --color-surface: #fdfcfc;        /* cards, menu panels */
  --color-ink: #231f1a;            /* body text */
  --color-muted: #766b60;          /* secondary text */
  --color-border: #e7e1da;         /* hairlines */

  /* Type — set the Google Fonts import in fonts.css to match.
     Nunito: rounded and friendly, echoing the loose, hand-drawn "River" script
     and small tracked-out "CAFE" caps on the shop's own badge (see profile
     Brand). No script face is used for on-page headings, for legibility. */
  --font-display: "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 800;
  --display-tracking: -0.01em;
  --display-transform: none;       /* uppercase for shouty brands, none otherwise */

  /* Shape and texture */
  --radius: 18px;                  /* 0 for sharp brands, 999px for pill brands */
  --radius-sm: 10px;
  --hero-overlay: linear-gradient(180deg, rgba(20, 12, 6, 0.25), rgba(20, 12, 6, 0.65));
  --shadow: 0 10px 30px rgba(33, 27, 22, 0.08);
}