/* ==========================================================
   BlitzLeistung · tokens
   World: the German distribution board. Colours are RAL cabinet paints.
   ========================================================== */
:root{
  /* RAL 7035 light grey: the colour of every switch cabinet */
  --ral7035: #ffffff;
  --ral7035-hi: #f3f5f2;      /* raised light surfaces: inputs, segments */
  --ral7035-lo: #b6bcb8;      /* board back plate */
  /* RAL 7016 anthracite and RAL 7021 black grey */
  --ral7016: #0a0b0a;
  --ral7021: #050605;
  /* RAL 1003 signal yellow: reserved for the 24 h emergency, nothing else */
  --signal: #7ed321;
  --signal-ink: #0b1400;
  /* logo lime: the "on" spot colour */
  --lime: #7ed321;
  --lime-hover: #95e43f;
  --lime-ink: #0b1400;

  --ink: #0d0f0d;             /* text on light, 12.6:1 on 7035 */
  --ink-2: #4b5249;           /* secondary on light, 5.7:1 */
  --paper: #f5f7f3;           /* text on dark */
  --paper-2: #a8b0a4;         /* secondary on dark, 5.7:1 on 7016 */
  --module: #f5f5f1;          /* breaker plastic */
  --marker: #22293a;          /* felt-tip on label strips */
  --error: #9a1f17;

  /* type */
  --f-display: "Barlow Semi Condensed", "Barlow", "Arial Narrow", sans-serif;
  --f-body: "Barlow", "Segoe UI", Roboto, sans-serif;
  --f-hand: "Caveat", "Segoe Print", cursive;
  --t-h1: clamp(2.75rem, 1.5rem + 4.4vw, 6rem);
  --t-h2: clamp(2.125rem, 1.45rem + 2.3vw, 3.75rem);
  --t-h3: clamp(1.375rem, 1.25rem + .45vw, 1.75rem);
  --t-lead: clamp(1.125rem, 1.06rem + .28vw, 1.3125rem);
  --t-body: 1.0625rem;
  --t-small: .9375rem;
  --t-xs: .8125rem;

  /* space (4 px base) */
  --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;
  --sec-y: clamp(80px, 8vw + 24px, 136px);

  /* layout */
  --maxw: 1680px;
  --gutter: clamp(20px, 4.5vw, 72px);
  --col-gap: clamp(16px, 2vw, 32px);
  --hdr-h: 76px;

  /* radii by hierarchy */
  --r-ctl: 4px;
  --r-img: 3px;
  --r-box: 10px;

  /* depth: only physical objects cast shadows */
  --sh-object: 0 1px 0 rgba(255,255,255,.85) inset, 0 2px 2px rgba(18,22,24,.2), 0 6px 10px -4px rgba(18,22,24,.36);
  --sh-plate: 0 14px 28px -10px rgba(0,0,0,.55), 0 2px 4px rgba(0,0,0,.25);

  /* motion */
  --ease: cubic-bezier(.16,1,.3,1);
  --ease-snap: cubic-bezier(.3,1.35,.5,1);   /* lever overshoot */
}