/*
  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: no usable brand colour in the shop's own photo (a single window-lettering
   close-up dominated by reflected red brick, see company-profile.md Brand section); the
   name "Green Bench" is taken as a deliberate editorial colour choice, shifted off the
   generic green-natural archetype hue to avoid repeating busyfeet-and-coco-cafe's palette
   (see Decisions). Override, not sampled. */
:root {
  /* Colour */
  --color-primary: #1c3a18;        /* moss/forest green, chosen from the shop's own name — no green was visible in the one available photo */
  --color-on-primary: #f3f7f3;     /* text on primary */
  --color-accent: #ba4f2c;         /* terracotta, warmed/reddened per the design method for a green primary */
  --color-on-accent: #ffffff;      /* text on accent */
  --color-bg: #f3f8f2;             /* page background: primary hue, s30 l96 */
  --color-surface: #fcfdfc;        /* cards, menu panels */
  --color-ink: #1b231a;            /* body text */
  --color-muted: #637660;          /* secondary text */
  --color-border: #dbe7da;         /* hairlines */

  /* Type — set the Google Fonts import in fonts.css to match */
  --font-display: "Archivo Black", "Arial Black", sans-serif;
  --font-body: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 400;
  --display-tracking: -0.005em;
  --display-transform: uppercase;  /* the shopfront's own vinyl lettering is bold, condensed caps */

  /* Shape and texture */
  --radius: 4px;                   /* square-ish, plain counter-service café, not soft or playful */
  --radius-sm: 2px;
  --hero-overlay: linear-gradient(180deg, rgba(10, 18, 8, 0.3), rgba(10, 18, 8, 0.7));
  --shadow: 0 10px 30px rgba(15, 25, 12, 0.1);
}