/* palette-source: sampled — written by palette.mjs on 2026-09-11, accent overridden by hand (see 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.

  McCabes Deli. Both brand colours are measured from photographs of the shop's
  own premises, not chosen for them:

  --color-primary  #274260  The illuminated navy fascia over the door, "McCabe's
                            Deli" in white script. palette.mjs read it at h211 s43
                            l26 and 21% of the sign band, the only chromatic colour
                            there; everything else in frame is street, brick and sky.
  --color-accent   #8e6629  The gold chalk the boards are titled and priced in,
                            measured at #dbbf9d (h33 s46 l74) on the SPECIALITY
                            CIABATTAS board. That reading is chalk catching a warm
                            bulb, far too light to sit on a page, so it is kept at
                            its own hue and darkened to l36 until link text on the
                            background reaches 4.5:1 (it makes 4.70:1).

  OVERRIDE, recorded on purpose. Run over the sign and a board together, palette.mjs
  made chalkboard black the primary and the navy the accent. That is backwards for
  this shop: every deli has a blackboard, and the navy is the only colour on Tara
  Street. Run over the sign alone it chose the navy correctly but, finding no second
  colour, fell back to terracotta #a95328 — which is byte-identical to the accent
  already used for Ernesto's. The gold is theirs and the terracotta is not, so the
  gold wins.

  Background stays the navy hue at S30 L96 rather than a warm cream: the gold is 178°
  from the navy, and design.md's rule is that a light colour may only set the
  background hue within 60° of the primary. A cream page under navy headings reads as
  two brands.
*/
:root {
  /* Colour */
  --color-primary: #274260;        /* the fascia navy: headings, header, footer */
  --color-on-primary: #f2f5f8;     /* text on primary — 9.39:1 */
  --color-accent: #8e6629;         /* the boards' gold chalk: buttons, links, prices */
  --color-on-accent: #ffffff;      /* text on accent — 5.14:1 */
  --color-bg: #f2f5f8;             /* page background, primary hue at S30 L96 */
  --color-surface: #fcfcfd;        /* cards, menu panels */
  --color-ink: #1a1e23;            /* body text — 15.21:1 on bg */
  --color-muted: #606b76;          /* secondary text — 4.97:1 on bg */
  --color-border: #dae0e7;         /* hairlines */

  /* The chalkboard the menu is actually written on, measured at #1d1310 on the
     board crop and used only for the menu panel. Not a role colour. */
  --board: #1f1512;
  --board-chalk: #f4efe9;

  /* Type — set the Google Fonts import in fonts.css to match.
     The fascia is a signwriter's connected script with heavy ornate capitals:
     formal, old-fashioned, white on navy. Playfair Display is the closest legible
     match in the design.md table ("classic sign-painter serif, high contrast").
     Source Sans 3 for body because the menu is the product and has to be read
     standing up. */
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 700;
  --display-tracking: 0;
  --display-transform: none;       /* the fascia is mixed case, not caps */

  /* Shape and texture — square, like a printed menu card. */
  --radius: 0px;
  --radius-sm: 0px;
  --hero-overlay: linear-gradient(180deg, rgba(10, 18, 28, 0.42), rgba(10, 18, 28, 0.62));
  --shadow: 0 10px 30px rgba(26, 30, 35, 0.08);
}