/* ============================================================================
   BRACKET DESIGN TOKENS — single source of brand truth.
   Brutalist/industrial system: dark ground, red accent, bone support.
   Style with role tokens (var(--ink), var(--accent)...), NEVER raw hex.
   Load order: tokens.css → base.css → components.css
   ============================================================================ */

@font-face { font-family:"Archivo"; src:url("fonts/Archivo-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Archivo"; src:url("fonts/Archivo-Medium.woff2")  format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"Archivo"; src:url("fonts/Archivo-Bold.woff2")    format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"Archivo"; src:url("fonts/Archivo-Black.woff2")   format("woff2"); font-weight:900; font-style:normal; font-display:swap; }

/* Space Mono — the SKU/spec-sheet signal. Labels, prices, rev numbers ONLY. Never body. */
@font-face { font-family:"Space Mono"; src:url("fonts/SpaceMono-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Space Mono"; src:url("fonts/SpaceMono-Bold.woff2")    format("woff2"); font-weight:700; font-style:normal; font-display:swap; }

:root {
  /* ---- PRIMARY PALETTE (locked identity) --------------------------------- */
  --bracket-dark:  #0D0D0D;   /* signature ground */
  --bracket-red:   #C1121F;   /* signature accent — ONE lead, never decorative */
  --bracket-bone:  #EDEBE6;   /* support / inverse ground */
  --bracket-white: #FFFFFF;

  /* ---- Tints & lifts (derived — for surfaces/hairlines on each ground) --- */
  --surface-on-dark:   rgba(237,235,230,0.06);
  --surface-on-bone:   rgba(13,13,13,0.04);
  --hairline-on-dark:  rgba(237,235,230,0.18);
  --hairline-on-bone:  rgba(13,13,13,0.16);
  --ink-muted-on-dark: rgba(237,235,230,0.60);
  --ink-muted-on-bone: rgba(13,13,13,0.58);

  /* ---- Semantic roles — DEFAULT ground is dark. Rebind per-section with
     .theme--bone. Always style with these roles, never raw hex. ------------ */
  --bg:        var(--bracket-dark);
  --ink:       var(--bracket-bone);
  --ink-muted: var(--ink-muted-on-dark);
  --accent:    var(--bracket-red);
  --hairline:  var(--hairline-on-dark);
  --surface:   var(--surface-on-dark);

  /* ---- Typography --------------------------------------------------------- */
  --font-display: "Archivo", system-ui, sans-serif;
  --font-body:    "Archivo", system-ui, sans-serif;
  --font-mono:    "Space Mono", ui-monospace, "SF Mono", "Roboto Mono", Menlo, monospace;

  --weight-body: 400;
  --weight-med:  500;
  --weight-bold: 700;
  --weight-black:900;

  --lead-headline: 0.98;
  --lead-body:      1.5;
  --lead-mono:      1.3;

  /* Fluid type scale — clamp(min, preferred, max). No fixed breakpoints. */
  --fs-hero:    clamp(2.75rem, 6vw + 1rem, 6rem);
  --fs-h1:      clamp(2.1rem, 3.5vw + 1rem, 3.5rem);
  --fs-h2:      clamp(1.6rem, 2vw + 1rem, 2.5rem);
  --fs-h3:      clamp(1.25rem, 1vw + 1rem, 1.75rem);
  --fs-lead:    clamp(1.05rem, 0.5vw + 1rem, 1.25rem);
  --fs-body:    1rem;
  --fs-small:   0.875rem;
  --fs-label:   0.75rem;   /* SKU / spec-sheet labels — mono, tracked-out */
  --tracking-label: 0.14em;
  --tracking-tight: -0.02em;

  /* ---- Spacing — 8pt base ------------------------------------------------- */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;
  --space-7: 96px;
  --space-8: 128px;
  --container: 1200px;
  --gutter:    clamp(20px, 5vw, 80px);
  --section-y: clamp(56px, 8vw, 128px);

  /* ---- Radius — brutalist system is sharp by default. No soft/pill cards. */
  --radius-none: 0px;
  --radius-sm:   2px;   /* inputs, small chips only */
  --radius-pill: 999px; /* status/SKU tags only — deliberate exception */

  /* ---- Elevation — flat hairlines, never soft drop shadows. -------------- */
  --shadow-none: none;
  --shadow-flat: inset 0 0 0 1px var(--hairline);
}

/* ---- Theme rebind: bone ground for alternating sections ------------------ */
.theme--bone {
  --bg:        var(--bracket-bone);
  --ink:       var(--bracket-dark);
  --ink-muted: var(--ink-muted-on-bone);
  --hairline:  var(--hairline-on-bone);
  --surface:   var(--surface-on-bone);
  /* --accent stays --bracket-red in every theme — one lead, never rebound */
}