/* Step by Stage Interiors brand tokens. THE single source of truth for color, type and shape.
   Read from sbs-interiors.com (Elementor kit 7 + Formidable form styles), 2026-11-01. Rules: brand/BRAND.md.
   web/app.css may only use var(--…) from here; scripts/check_brand.py enforces it in CI. */
:root{
  /* Brand palette (Elementor global colors) */
  --ink:#282727;      /* text, logo, primary buttons, stat band */
  --sand:#CCB99F;     /* accent fill, rules, script accent, form submit. Never body text on light. */
  --linen:#EDE6DB;    /* section bands, secondary buttons, current nav item */
  --paper:#F7F5F2;    /* page background, text on ink */
  --white:#FFFFFF;    /* cards and fields on paper */

  /* Derived (not on the site; chosen for contrast). Sand as text on light: 5.3:1 on white, 4.9:1 on paper. */
  --sand-deep:#7D6843;
  --stone:#9A948C;    /* warm grey, tertiary series */
  --night:#1C1B1B;    /* dark-mode page */
  --night-line:#3A3836;

  /* Functional status (earthy, muted; not brand colors, for state only) */
  --good:#36704A; --good-bg:#E3EFE6;
  --caution:#8A5A00; --caution-bg:#FFF1D6;
  --alert:#A63B39; --alert-bg:#F6E0DF;

  /* Type. Obviosa and Billion Miracles are licensed to SBS's website only; Forum and Waterfall
     (Google Fonts, OFL) are the closest free matches. Montserrat is the site's own body face. */
  --font-display:"Forum","Obviosa",Georgia,serif;
  --font-body:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-script:"Waterfall","Billion Miracles",cursive;
  --track-display:.08em;   /* site: 5px at 70px, uppercase */
  --track-eyebrow:.3em;    /* site: 4px at 12px, uppercase */
  --track-button:.2em;     /* site: 3px at 14px, uppercase */
  --track-label:.12em;

  /* Shape. The site is square and flat: 0 radius, no shadows, 1px rules. */
  --radius:0; --shadow:none;

  /* Semantic roles (light) */
  --bg:var(--paper); --card:var(--white); --text:var(--ink); --muted:#625E5A; --line:#E4DED3;
  --link:var(--ink); --link-hover:var(--sand-deep); --sand-text:var(--sand-deep);
  --focus:var(--ink); --nav-current-bg:var(--linen); --nav-current-text:var(--ink);
  --btn-bg:var(--ink); --btn-text:var(--paper); --btn-hover-bg:var(--sand); --btn-hover-text:var(--ink);
  --btn2-bg:var(--linen); --btn2-text:var(--ink); --btn2-hover-bg:var(--ink); --btn2-hover-text:var(--paper);
  --hero-bg:var(--ink); --hero-text:var(--paper); --hero-muted:var(--sand);
  --chip-bg:var(--linen); --chip-text:var(--ink);
  --series-a:var(--ink); --series-b:var(--sand); --series-c:var(--stone); --series-d:var(--sand-deep);
  --grid:var(--line); --heat-lo:#F3EEE6; --heat-hi:#6B5A3E;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:var(--night); --card:var(--ink); --text:var(--paper); --muted:#B8B2A9; --line:var(--night-line);
  --link:var(--paper); --link-hover:var(--sand); --sand-text:var(--sand); --focus:var(--sand);
  --nav-current-bg:var(--night-line); --nav-current-text:var(--paper);
  --btn-bg:var(--paper); --btn-text:var(--ink); --btn-hover-bg:var(--sand); --btn-hover-text:var(--ink);
  --btn2-bg:var(--night-line); --btn2-text:var(--paper); --btn2-hover-bg:var(--paper); --btn2-hover-text:var(--ink);
  --chip-bg:var(--night-line); --chip-text:var(--paper);
  --hero-bg:var(--sand); --hero-text:var(--ink); --hero-muted:var(--ink);
  --good:#8FCFA3; --good-bg:#24372B; --caution:#F3C46B; --caution-bg:#3D3120; --alert:#F0908E; --alert-bg:#432426;
  --series-a:var(--paper); --series-c:#7C7670; --series-d:#E4D5BE; --grid:var(--night-line); --heat-lo:#2E2C2A; --heat-hi:var(--sand);
}}
:root[data-theme="dark"]{
  --bg:var(--night); --card:var(--ink); --text:var(--paper); --muted:#B8B2A9; --line:var(--night-line);
  --link:var(--paper); --link-hover:var(--sand); --sand-text:var(--sand); --focus:var(--sand);
  --nav-current-bg:var(--night-line); --nav-current-text:var(--paper);
  --btn-bg:var(--paper); --btn-text:var(--ink); --btn-hover-bg:var(--sand); --btn-hover-text:var(--ink);
  --btn2-bg:var(--night-line); --btn2-text:var(--paper); --btn2-hover-bg:var(--paper); --btn2-hover-text:var(--ink);
  --chip-bg:var(--night-line); --chip-text:var(--paper);
  --hero-bg:var(--sand); --hero-text:var(--ink); --hero-muted:var(--ink);
  --good:#8FCFA3; --good-bg:#24372B; --caution:#F3C46B; --caution-bg:#3D3120; --alert:#F0908E; --alert-bg:#432426;
  --series-a:var(--paper); --series-c:#7C7670; --series-d:#E4D5BE; --grid:var(--night-line); --heat-lo:#2E2C2A; --heat-hi:var(--sand);
}