/* ============================================================
   Protemics — Design Tokens
   "Scientific Instrument" · Single Source of Truth
   Alle Farb-, Typo- und Layoutwerte ausschliesslich hier aendern.
   Referenz: protemics_design_spec.md §1–§3, §7
   ============================================================ */

:root{
  /* ---- brand (aus Logo-SVG, nicht veraendern) ---- */
  --brand-navy:#000080;
  --brand-navy-2:#000076;
  --brand-blue:#0526AA;
  --brand-green:#7FFF2A;      /* Logo-Pfeil — nie als UI-Akzentflaeche */

  /* ---- surfaces ---- */
  --ink-900:#0B1620;          /* Hero / CTA-Band */
  --ink-800:#0F1C28;          /* Footer */
  --ink-700:#15212E;          /* Borders auf dunkel */
  --paper:#F7F8F6;            /* Standard-Hintergrund */
  --paper-2:#EFF1EE;          /* abgesetzte helle Sektion */

  /* ---- text ---- */
  --graphite:#16222D;         /* Fliesstext & Headlines auf hell */
  --mist:#5C6B76;             /* Sekundaertext, Captions */
  --ink-text:#C6D4DC;         /* Fliesstext auf dunkel */
  --ink-text-2:#8FA3AF;       /* Sekundaertext auf dunkel */

  /* ---- accents ---- */
  --signal:#1FB8C9;           /* Daten-Akzent auf dunkel */
  --signal-dim:#0F7280;       /* Akzent-/Linktext auf hell — abgedunkelt gegenueber
                                 Spec #117C88, das auf --paper-2 nur 4.34:1 erreichte (AA braucht 4.5) */
  --amber:#F2A33C;            /* einziger warmer Gegenakzent, sehr sparsam */

  /* ---- lines ---- */
  --hair:#D9DDD7;
  --hair-dark:rgba(255,255,255,.10);

  /* ---- type ---- */
  --font-display:"Archivo",system-ui,sans-serif;
  --font-body:"IBM Plex Sans",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;

  --fs-h1:clamp(46px,6.4vw,84px);
  --fs-h2:clamp(30px,3.6vw,42px);
  --fs-h3:21px;
  --fs-lede:18px;
  --fs-body:16px;
  --fs-eyebrow:12px;
  --fs-label:11.5px;

  --tr-eyebrow:.22em;
  --tr-label:.12em;

  /* ---- layout ---- */
  --maxw:1180px;
  --gutter:28px;
  --sec-pad:96px;
  --radius:2px;
  --radius-lg:3px;
  --nav-h:64px;

  /* ---- motion ---- */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-in-out:cubic-bezier(.4,.1,.2,1);
}

@media (max-width:860px){
  :root{
    --sec-pad:66px;
    --gutter:20px;
  }
}
