/* Stage1Energy — design tokens. Spec v2.0 §3. Fixed values — do not edit casually. */

:root {
  /* §3.1 Colour */
  --ink:        #131F17;  /* deep forest. The dossier cover. */
  --ink-2:      #1C2B20;  /* raised surface on dark */
  --ink-line:   #2A3A2E;  /* hairline on dark */
  --paper:      #F7F6F1;  /* warm off-white. Dossier interior. */
  --paper-2:    #FFFFFF;  /* surface on paper */
  --line:       #E3E1D8;  /* hairline on paper */
  --text-dark:  #131F17;  /* prose on paper */
  --text-on-dark: var(--paper);  /* primary prose on ink */
  --text-mute-on-paper: #5D6E62;  /* secondary prose on paper */
  --text-mute-on-dark:  #B0BDB3;  /* secondary prose on ink */
  --text-mute:  var(--text-mute-on-paper);
  --lime:       #C4F013;  /* ACCENT — one element per viewport, max */
  --lime-hover: #D2FA3A;
  --moss:       #4C7A5A;  /* chart strokes, section eyebrows on paper */
  --amber:      #E5A63B;  /* MEDIUM flag only */
  --clay:       #D95B4A;  /* flag legend only */

  /* §3.2 Type */
  --display: "Fraunces", Georgia, serif;
  --body:    "Source Sans 3", system-ui, sans-serif;
  --mono:    "IBM Plex Mono", ui-monospace, monospace;

  /* §3.3 Space */
  --section-pad: 128px;
  --section-pad-compact: 48px;
  --section-pad-band: 28px;
  --gutter: 24px;
  --max: 1140px;
  --max-text: 720px;

  /* §3.4 Shape */
  --radius-md: 8px;     /* buttons, cards, KPI boxes, info panels, badges */
  --radius-pill: 999px; /* nav bar + nav CTA only */

  /* Scrollbar */
  --scrollbar-size: 6px;
  --scrollbar-track: transparent;
  --scrollbar-thumb: var(--lime);
  --scrollbar-thumb-hover: var(--lime-hover);
  --scrollbar-thumb-inset: 1px;
}

@media (max-width: 767px) {
  :root {
    --section-pad: 72px;
    --section-pad-compact: 40px;
    --section-pad-band: 24px;
  }
}

@font-face {
  font-family: Fraunces;
  src: url("../fonts/Fraunces-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/SourceSans3-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/SourceSans3-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}