/* palette-source: sampled from the shop's own shopfront (charcoal fascia and the gold
   script lettered on the window), recorded by scripts/palette.mjs on 2026-09-11 and
   set here as a deliberate override of the automatic run across the food photography,
   which read coffee-brown. Derivation, contrast fixes and reasons: company-profile.md
   → Brand. */
/*
  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.
*/
:root {
  /* Colour */
  --color-primary: #28262b;        /* the charcoal of the shopfront fascia, as sampled */
  --color-on-primary: #f5f4f6;     /* text on primary: the page off-white, 13.6:1 */
  --color-accent: #866a3d;         /* the gold window script #b6955e, darkened to clear 4.5:1 as link text */
  --color-on-accent: #ffffff;      /* text on accent, 5.06:1 */
  --color-bg: #f5f4f6;             /* primary hue at L96; saturation held to 12 because the primary is a near-neutral charcoal */
  --color-surface: #fcfcfd;        /* cards, menu panels */
  --color-ink: #1e1a23;            /* body text */
  --color-muted: #696076;          /* secondary text */
  --color-border: #e0dde3;         /* hairlines; s10 rather than s22 so the letterpress rules read grey, not lilac */

  /* Type — set the Google Fonts import in fonts.css to match */
  --font-display: "Cormorant Infant", Georgia, "Times New Roman", serif;
  --font-body: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 500;
  --display-tracking: 0.005em;
  --display-transform: none;       /* the shopfront name is script, not capitals */

  /* Shape and texture */
  --radius: 0;                     /* nothing on this shopfront is rounded */
  --radius-sm: 0;
  --hero-overlay: linear-gradient(180deg, rgba(28, 26, 32, 0.46), rgba(28, 26, 32, 0.62));
  --shadow: none;
}