/* palette-source: sampled — written by palette.mjs on 2026-10-01 */
/*
  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: #323c1b;        /* pistachio on the truffles, taken dark (override of palette.mjs brown) */
  --color-on-primary: #f6f7f1;
  --color-accent: #8c4a2b;         /* chocolate ganache #8c5c3d from owner-05, darkened for contrast */
  --color-on-accent: #ffffff;
  --color-bg: #f6f7f1;
  --color-surface: #fbfbf8;
  --color-ink: #1f2118;
  --color-muted: #686b5c;
  --color-border: #e2e5d6;

  /* 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: 12px;                  /* soft, hand-made */
  --radius-sm: 8px;
  --hero-overlay: linear-gradient(180deg, rgba(25, 30, 12, 0.25), rgba(25, 30, 12, 0.7));
  --shadow: 0 10px 30px rgba(33, 27, 22, 0.08);
}