/*
  CUPÁN STUDIO — brand tokens for the company site (cupanstudio.com).
  Drop-in replacement for the skeleton's assets/css/tokens.css on the company
  site only. Client sites keep their own tokens, derived from their own shopfront.

  Source: business/brand/logo.png, the owner's original. Hexes are SAMPLED
  from it (modal stroke and ground pixels), not matched by eye — corrected
  2026-09-08 when the file reached the repository. Green was #1b4d3b and
  cream #fbf6e8 by eye; both were off.

  Reasoning, usage rules and the contrast table: business/brand/README.md
*/
:root {
  /* Colour */
  --color-primary: #14452f;        /* the logo green, sampled: header, footer, headings, mark */
  --color-on-primary: #fefaf1;     /* cream on green — 10.49:1 */
  --color-accent: #a9552a;         /* terracotta: buttons, links, the one CTA */
  --color-on-accent: #ffffff;      /* white on terracotta — 5.22:1 */
  --color-bg: #fefaf1;             /* the logo's cream ground, sampled */
  --color-surface: #ffffff;        /* cards, panels, form fields */
  --color-ink: #1a2420;            /* body text — 15.3:1 on cream */
  --color-muted: #5f6b63;          /* secondary text — 5.35:1 on cream */
  --color-border: #e4dcc8;         /* warm hairlines */

  /* Type — self-host both faces; see fonts.css.
     Jost echoes the wordmark: light, geometric, widely tracked.
     Do NOT fall back to Fraunces here; it belongs to client brands, not this one. */
  --font-display: "Jost", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display-weight: 300;
  --display-tracking: 0.01em;      /* 0.06em at wordmark size */
  --display-transform: none;

  /* Shape and texture */
  --radius: 14px;                  /* the mark is all curves; nothing sharp */
  --radius-sm: 8px;
  --hero-overlay: linear-gradient(180deg, rgba(10, 28, 19, 0.2), rgba(10, 28, 19, 0.7));
  --shadow: 0 10px 30px rgba(20, 69, 47, 0.08);  /* green-tinted, not grey */
}