/* ===========================================================================
   IndustrieWert — Design tokens
   PRÄZISION IN BEWEGUNG

   Every colour below is DERIVED, not invented (directive §7.1). Source:
   assets/brand/cropped-IndustrieWert-logo.png and IndustrieWert-favicon-300.png,
   sampled by scripts/brand-extract.py. Both files independently agree on the
   accent #BDEB42 (H76 S81 L59), and every neutral in the mark is a TRUE neutral
   (hue 0, saturation 0) — so the steel ramp carries no blue or warm cast.
   Derivation and contrast maths: docs/design-system.md
   =========================================================================== */

:root {
  /* --- Brand accent. Logo lime. -------------------------------------------
     L59 against white is 1.35:1 — it can NEVER carry text on a light surface.
     It is a graphic instrument: measurement lines, active rules, focus, and
     as a FILL beneath near-black ink (#0D0D0D on lime = 14.9:1, AAA). */
  --c-accent:        #BDEB42;
  --c-accent-dim:    #A8D239;   /* pressed / hover on accent fills */
  --c-accent-ink:    #0D0D0D;   /* the only ink permitted on --c-accent */
  --c-accent-wash:   #F4FBE0;   /* 8% accent over white — section grounds */

  /* --- Industrial neutrals (from the chrome monogram ramp) ---------------- */
  --c-industrial-900: #0D0D0D;  /* 19.1:1 on white — display + body */
  --c-industrial-800: #1A1A1A;  /* 16.1:1 */
  --c-industrial-700: #2A2A2A;  /* 13.4:1 */
  --c-grey-600:       #545454;  /*  7.4:1 — secondary body, AAA at body size */
  --c-grey-500:       #7E7E7E;  /*  4.6:1 — captions, AA large / non-text */
  --c-grey-400:       #939393;  /*  3.4:1 — non-text only (icons, rules) */
  --c-grey-300:       #BDBDBD;  /*  hairline emphasis */
  --c-grey-200:       #D2D2D2;  /*  hairline */
  --c-grey-100:       #E7E7E7;  /*  dividers, inset grounds */

  --c-surface:        #FFFFFF;
  --c-surface-alt:    #F6F6F6;
  --c-surface-deep:   #0D0D0D;  /* footer, RFQ band */
  --c-surface-deep-2: #1A1A1A;

  /* --- Status ------------------------------------------------------------- */
  --c-success: #2F7A3E;
  --c-warning: #8A6100;
  --c-error:   #B3261E;
  --c-info:    #1F5C8B;

  /* --- Semantic roles ----------------------------------------------------- */
  --c-ink:          var(--c-industrial-900);
  --c-ink-muted:    var(--c-grey-600);
  --c-ink-faint:    var(--c-grey-500);
  --c-rule:         var(--c-grey-200);
  --c-rule-strong:  var(--c-grey-400);
  --c-focus:        #0D0D0D;

  /* --- Type --------------------------------------------------------------- */
  --f-sans: "Inter Tight", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
            Roboto, "Helvetica Neue", Arial, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-display: clamp(2.75rem, 1.6rem + 4.6vw, 5.25rem);
  --fs-h1:      clamp(2rem,   1.4rem + 2.6vw, 3.25rem);
  --fs-h2:      clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  --fs-h3:      clamp(1.25rem, 1.1rem + 0.7vw, 1.5rem);
  --fs-h4:      1.125rem;
  --fs-body-l:  1.0625rem;
  --fs-body:    1rem;
  --fs-body-s:  0.9375rem;
  --fs-label:   0.8125rem;
  --fs-caption: 0.75rem;

  --lh-tight: 1.04;
  --lh-snug:  1.22;
  --lh-body:  1.6;

  --ls-display: -0.028em;
  --ls-head:    -0.018em;
  --ls-label:    0.09em;

  /* --- Spacing (4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96 · 128) ----------- */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;  --s-5: 24px;
  --s-6: 32px;  --s-7: 48px;  --s-8: 64px;  --s-9: 96px;  --s-10: 128px;

  --pad-section: clamp(3.5rem, 1.5rem + 7vw, 8rem);
  --pad-gutter:  clamp(1rem, 0.4rem + 2.2vw, 2.5rem);

  /* --- Grid --------------------------------------------------------------- */
  --w-content: 1440px;
  --w-wide:    1600px;
  --w-measure: 72ch;
  --gutter:    24px;

  /* --- Borders & radius --------------------------------------------------- */
  --bw-hair: 1px;
  --bw-emph: 2px;
  --r-0: 0;  --r-1: 2px;  --r-2: 4px;
  --shadow-float: 0 1px 2px rgb(0 0 0 / .06);

  /* --- Motion (directive §7.4) -------------------------------------------- */
  --t-fast:   120ms;
  --t-base:   200ms;
  --t-slow:   320ms;
  --t-reveal: 560ms;
  --ease-mech:  cubic-bezier(.2, .7, .1, 1);
  --ease-panel: cubic-bezier(.4, 0, .2, 1);

  /* --- Layout metrics ----------------------------------------------------- */
  --h-header:         72px;
  --h-header-compact: 56px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t-fast: 1ms; --t-base: 1ms; --t-slow: 1ms; --t-reveal: 1ms;
  }
}