/* Datum+Grain / Kora Kitchens — brand tokens, from the 9 Oct 2026 design
   handoff (UXUI_improvements_assets/October 9 - Design system ...zip).
   Scoped to [data-brand="kora"] / [data-brand="dg"], deliberately distinct
   from the configurator app's own [data-brand="kora-kitchens"|"datum-grain"]
   themes (theme-*.css), which use a different token vocabulary. Consumed by
   brand-site.css for the marketing pages and the printable quote. */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wdth,wght@0,75..100,400..700;1,75..100,400..700&display=swap');

:root {
  --font-family: 'Instrument Sans', system-ui, sans-serif;
  --radius: 0;
  --grid-columns: 12;
  --grid-gutter: 24px;
  --page-pad: clamp(20px, 4vw, 56px);
  --section-pad: clamp(48px, 6vw, 96px);
  --oak: #B07A3C; /* shared between brands */
}

/* Kora Kitchens (B2C) */
[data-brand="kora"] {
  --color-bg: #F4F0E8;          /* Chalk */
  --color-surface: #FBF9F5;     /* Chalk 50 — inputs, cards */
  --color-tint: #E8E1D4;        /* Chalk 200 — tags, hover fills */
  --color-rule-soft: #D9D1C2;
  --color-text: #22201C;        /* Flint */
  --color-text-muted: #5A554C;
  --color-text-on-dark-muted: #C9C0B0;
  --color-rule: #22201C;
  --color-accent: #B07A3C;      /* Oak — marks, fields, large type only */
  --color-accent-on-dark: #C99558;
  --color-accent-strong: #7E5420; /* Oak 700 — primary buttons, accent text */
  --color-accent-strong-hover: #8E6230;
  --color-accent-strong-active: #6A4518;
  --color-on-accent-strong: #F4F0E8;
  --rule-width: 1px;
  --font-stretch-display: 100%;
  --font-stretch-body: 100%;
  --weight-display: 550;
  --tracking-display: -0.03em;
  --text-transform-display: none;
}

/* Datum+Grain (B2B) — v2 calmer direction */
[data-brand="dg"] {
  --color-bg: #F5F6F4;          /* Paper */
  --color-surface: #FFFFFF;
  --color-tint: #E3E5E7;
  --color-rule-soft: #C9CCCF;   /* Rule */
  --color-text: #18191B;        /* Graphite */
  --color-text-muted: #55585C;
  --color-rule: #18191B;
  --color-accent: #2C4A9A;      /* Datum blue (v2) */
  --color-accent-hover: #3A5AAE;
  --color-on-accent: #F5F6F4;
  --rule-width: 1px;
  --font-stretch-display: 87.5%;
  --font-stretch-body: 87.5%;
  --font-stretch-label: 75%;
  --weight-display: 550;
  --tracking-display: -0.025em;
  --text-transform-display: none;
}