/* TheSefaWay design tokens. Dark is the default; light is opt-in via the header toggle.
   Change the brand here; site.css only references these variables.
   Previous warm-grey version: archive/v1-stone/. */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:          #0E1210;  /* near-black, faintly green */
  --bg-2:        #121815;  /* raised surface: cards, panels */
  --text:        #F3F5F0;
  --muted:       #9AA39C;  /* secondary text (AA on --bg and --bg-2) */
  --faint:       #67706A;  /* decorative labels, axis text: not for body copy */
  --dot:         #E9ECE6;  /* dot-matrix and dot-grid ink */
  --line:        rgb(233 236 230 / 0.12);  /* solid hairlines */
  --hud:         rgb(233 236 230 / 0.22);  /* dashed card and panel borders */
  --card-bg:     rgb(15 19 17 / 0.5);
  --nav-scrim:   rgb(14 18 16 / 0.78);
  --signal:      #F2620F;  /* safety orange: CTAs, gates, marks, focus */
  --signal-text: #FF7A33;  /* orange as text on --bg (AA) */
  --on-signal:   #140A03;  /* text on orange */
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg:          #F2F2EE;
  --bg-2:        #FAFAF7;
  --text:        #0E1316;
  --muted:       #5C6560;
  --faint:       #8E958F;
  --dot:         #14181A;
  --line:        rgb(20 24 26 / 0.12);
  --hud:         rgb(20 24 26 / 0.20);
  --card-bg:     rgb(249 249 245 / 0.62);
  --nav-scrim:   rgb(242 242 238 / 0.82);
  --signal:      #F2620F;
  --signal-text: #A8420A;
  --on-signal:   #140A03;
}

:root {
  /* Type */
  --font-sans: "Archivo", "Helvetica Neue", Arial, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --step--2: 0.75rem;   /* mono labels */
  --step--1: 0.875rem;
  --step-0:  1rem;
  --step-1:  1.3125rem;
  --step-2:  clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --step-3:  clamp(2rem, 1.4rem + 2.2vw, 2.85rem);
  --step-4:  clamp(2.75rem, 1.2rem + 6.4vw, 6.1rem);

  /* Space */
  --sp-1: 8px;
  --sp-2: 16px;
  --sp-3: 24px;
  --sp-4: 32px;
  --sp-5: 48px;
  --sp-6: clamp(72px, 48px + 6vw, 128px);

  --maxw: 1280px;
  --gutter: clamp(16px, 4vw, 48px);
  --measure: 38rem;
  --radius: 2px;      /* cards, panels, chips */
  --radius-btn: 10px;
  --radius-nav: 14px;
  --nav-h: 60px;
}