/* =========================
   DESIGN TOKENS — Industrial editorial on obsidian
   Sections alternate two dark tones stepped up from obsidian (no light
   fields); hairlines in --rule-dark. The interface accent is platinum (warm
   white): actions, heading marks, the lifecycle stepper, focus. Amber is kept
   for the drawings alone (light, heat, melt), so the lit lamp is the only
   warm colour on the page and its glow stays the focal point.
========================= */

:root {
  /* Fields */
  --carbon: #090a0f;        /* obsidian */
  --carbon-2: #0f1117;      /* one tone step up */
  --carbon-3: #161921;
  --plate: #e9e7e1;         /* drawing sheet on carbon; drawings multiply onto it */

  /* Ink */
  --ink: #090a0f;           /* on light fields and plates */
  --ink-soft: #55585c;      /* captions on plates */
  --ink-inverse: #f2f1ed;
  --ink-inverse-soft: #a4a8ad;

  /* Hairlines */
  --rule-dark: #23262e;

  /* Interface accent: platinum. To try another, swap these four lines for a block below. */
  --accent: #ece8e1;          /* fills: buttons, heading marks, lit nodes, selection */
  --accent-press: #d6d0c5;    /* the button's arrow cell */
  --accent-ink: #090a0f;      /* text on --accent */
  --accent-bright: #ece8e1;   /* the accent as ink or line on obsidian: the "+", beam, focus */
  /* Signal orange:
  --accent: #e04f16;  --accent-press: #c2410c;  --accent-ink: #ffffff;  --accent-bright: #f26a35;
     Cobalt:
  --accent: #1d4ed8;  --accent-press: #1e40af;  --accent-ink: #ffffff;  --accent-bright: #4f86ff;
     Amber:
  --accent: #f5a623;  --accent-press: #e0951a;  --accent-ink: #090a0f;  --accent-bright: #f5a623;
  */

  /* Drawings only (SVG models): light, heat and melt */
  --amber: #f5a623;

  /* Type */
  --font: "Archivo", "Helvetica Neue", Arial, sans-serif;

  --step-small: clamp(0.8125rem, 0.79rem + 0.1vw, 0.875rem);
  --step-body: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  --step-lead: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem);
  --step-head: clamp(2rem, 1.3rem + 3.2vw, 4rem);
  --step-display: clamp(2.75rem, 0.9rem + 6.2vw, 7rem);

  /* Space */
  --margin: clamp(1rem, 0.4rem + 2.2vw, 2rem);
  --gutter: clamp(1rem, 0.6rem + 1.2vw, 1.5rem);
  --section: clamp(6rem, 3rem + 9vw, 11rem);
  --header-h: 4rem;

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.7s;
}
