/* Diversified Kitchen Solutions — design tokens.
   Thesis: one continuous steel-toned off-white ground, photographs of
   working kitchens break full-bleed across it. The accent is the worn brass
   ring of a drain strainer photographed in one of the source images, a
   tarnished bronze-amber against brushed steel.

   Contrast pairs (WCAG, computed):
     ink #262421 on paper #F3F4F3            14.0:1  body text
     muted #5F5B54 on paper #F3F4F3           6.1:1  secondary text
     ink #262421 on steel-100 #E6E8E7        12.6:1  body text on panels
     white #FFFFFF on brass #8A5A22           5.9:1  primary button
     brass-press #6E4519 on paper #F3F4F3     7.5:1  links, accents on light
     white #FFFFFF on ink-panel #211F1C      16.4:1  dark section text
     brass-bright #C68A3E on ink-panel #211F1C  5.6:1  accents on dark
     muted-on-dark #B4AEA3 on ink-panel #211F1C 7.5:1  secondary text on dark
*/
:root {
  /* grounds: cool off-white, not cream — steel-tinted rather than warm-tinted */
  --paper: #F3F4F3;
  --steel-100: #E6E8E7;
  --steel-200: #D7DAD8;
  --panel-dark: #211F1C;
  --panel-dark-2: #2A2723;

  /* ink */
  --ink: #262421;
  --muted: #5F5B54;
  --ink-on-dark: #F3F1EC;
  --muted-on-dark: #B4AEA3;

  /* brand: brass pulled from the drain-ring photograph */
  --brass: #8A5A22;
  --brass-press: #6E4519;
  --brass-bright: #C68A3E;
  --steel-accent: #55636A;

  /* rules and furniture */
  --rule: #D6D2C9;
  --rule-strong: #C1BCB0;
  --rule-dark: #3A362F;

  /* type: not used on the previous build — warm serif display against a
     plain grotesque body, no monospace anywhere */
  --display: "Fraunces", Georgia, "Times New Roman", serif;
  --body: "Public Sans", "Segoe UI", system-ui, sans-serif;

  /* spacing scale, 8px base, used asymmetrically */
  --s1: 8px;  --s2: 16px; --s3: 24px; --s4: 32px;
  --s5: 40px; --s6: 48px; --s8: 64px; --s10: 80px; --s12: 96px;

  /* motion: one easing token, one reveal */
  --t-med: 520ms;
  --t-ease: cubic-bezier(.16, 1, .3, 1);

  --radius: 3px;
  --max: 1180px;
}
