/*
  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: archetype navy-classic (navy + coral-red) — no usable brand
   imagery exists for The Coffee Shot (see company-profile.md, Brand: zero
   owner-attributed photos, no logo, no legible signage anywhere). Not sampled from
   the shop's own branding. Chosen from the profile: a plain, everyday working café
   in a business-park unit, not a room or product photo to draw on. */
:root {
  /* Colour */
  --color-primary: #1e2f48;        /* navy — headings, header, footer */
  --color-on-primary: #f2f4f8;     /* text on primary */
  --color-accent: #bf4622;         /* coral-red — buttons, links, highlights */
  --color-on-accent: #ffffff;      /* text on accent */
  --color-bg: #f2f4f8;             /* page background, navy hue at s30 l96 */
  --color-surface: #fcfcfd;        /* cards, menu panels */
  --color-ink: #1a1e23;            /* body text */
  --color-muted: #606976;          /* secondary text */
  --color-border: #dadfe7;         /* hairlines */

  /* Type — set the Google Fonts import in fonts.css to match */
  --font-display: "DM Serif Display", Georgia, "Times New Roman", serif;
  --font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 400;
  --display-tracking: -0.01em;
  --display-transform: none;       /* uppercase for shouty brands, none otherwise */

  /* Shape and texture */
  --radius: 0px;                   /* square, plain working café */
  --radius-sm: 0px;
  --hero-overlay: linear-gradient(90deg, rgba(8, 12, 18, 0.78), rgba(8, 12, 18, 0.55) 45%, rgba(8, 12, 18, 0.2));
  --shadow: 0 10px 30px rgba(26, 30, 35, 0.08);
}