/* ============================================================
   Eumetabol theme (taste direction: clinical, re-tuned).
   Subject: the Eumetabol vial. Amber glass, white pharmacy label
   with the blue logo stripe, sterile cool light, deep navy print.
   Loaded after foundation.css. Dark remap under @media screen.
   ============================================================ */

@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap; src: url("/assets/fonts/source-sans-3-latin.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: italic; font-weight: 200 900; font-display: swap; src: url("/assets/fonts/source-sans-3-latin-italic.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/plex-cond-latin-500.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/plex-cond-latin-600.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/plex-cond-latin-700.woff2") format("woff2"); }

:root {
  --font-display: "IBM Plex Sans Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Source Sans 3", "Helvetica Neue", Arial, sans-serif;
  --fs-body: 1.0625rem;
  --fs-display: clamp(2.5rem, 1.5rem + 4.2vw, 5rem);
  --fs-h2: clamp(1.9rem, 1.3rem + 2.4vw, 3.4rem);
  --w-display: 600;
  --tr-display: -0.015em;
  --tr-h2: -0.01em;
  --lh-display: 1.04;
  --radius: 14px;
  --radius-sm: 8px;
  --radius-button: 10px;
  --case-eyebrow: uppercase;
  --tr-eyebrow: 0.12em;
  --bg: #f7fafb;            /* sterile label paper */
  --surface: #ffffff;       /* the vial label */
  --surface-2: #e9f5fa;     /* cold-chain tint */
  --ink: #0f2230;           /* label print navy */
  --muted-strong: #30434f;
  --muted: #4b5f6b;
  --line: #d6e4ea;
  --line-strong: #b6cad3;
  --ink-field: #0b2a3a;     /* deep pharmacy navy */
  --on-ink: #eef7fb;
  --on-ink-muted: #b5cdd8;
  --accent: #0098d4;        /* Eumetabol brand blue */
  --accent-fill: #0073a3;   /* brand blue, deepened for white text */
  --accent-on-fill: #ffffff;
  --accent-text: #00668f;   /* brand blue as text */
  --accent-soft: #dff2fa;   /* logo blue wash */
  --field-1: #dff2fa;       /* logo blue wash */
  --field-1-ink: #0f2230;
  --field-2: #f6eadb;       /* amber glass, light */
  --field-2-ink: #0f2230;
  --field-3: #0b2a3a;       /* navy */
  --field-3-ink: #eef7fb;
  /* page-level subject colours (decorative or the comparison only) */
  --logo-blue: #73c9e4;     /* the logo swirl */
  --amber: #a85a16;         /* vial glass */
  --rival: #b8361a;         /* "Nachahmer" column, from #f14b25 */
  --rival-fill: #c4401d;
  --rival-soft: #fbece6;
  --bar-from: #9ed8ec;      /* comparison bar, light end */
  --bar-to: #2f9fd3;        /* comparison bar, deep end */
  --bar-ink: #06263a;
  --paper: #ffffff;          /* chart and document paper, stays white */
  --muted-on-paper: #4b5f6b;
  --on-logo-blue: #06263a;
  --on-rival: #ffffff;
  --shadow-color: rgba(5, 25, 35, 0.4);
  --glass-shadow: rgba(80, 40, 5, 0.25);
  color-scheme: light;
}

@media screen {
  :root[data-theme="dark"] {
    --bg: #09161d;
    --surface: #0f212b;
    --surface-2: #132a36;
    --ink: #e6f2f7;
    --muted-strong: #c0d4dd;
    --muted: #94adb8;
    --line: rgba(230, 242, 247, 0.12);
    --line-strong: rgba(230, 242, 247, 0.24);
    --ink-field: #051118;
    --on-ink: #e6f2f7;
    --on-ink-muted: #a9c2cd;
    --accent: #4fc2ea;
    --accent-fill: #5cc6ea;
    --accent-on-fill: #06202c;
    --accent-text: #7fd1ec;
    --accent-soft: rgba(115, 201, 228, 0.14);
    --field-1: #12303e;
    --field-1-ink: #e6f2f7;
    --field-2: #2c2117;
    --field-2-ink: #f3e6d6;
    --field-3: #051118;
    --field-3-ink: #e6f2f7;
    --amber: #e59a52;
    --rival: #ff8a6b;
    --rival-fill: #b8431f;
    --rival-soft: rgba(241, 75, 37, 0.13);
    --bar-from: #1d5f7c;
    --bar-to: #1c78a6;
    --bar-ink: #f2fbff;
    --shadow-color: rgba(0, 0, 0, 0.55);
    --glass-shadow: rgba(0, 0, 0, 0.45);
  }
  :root[data-theme="light"] { color-scheme: light; }
  :root[data-theme="dark"] { color-scheme: dark; }
}

body { font-variant-numeric: tabular-nums; }