/* Energy Consulting Collective — brand tokens
   Source of truth for color, type, spacing and radius.
   Copied into site/css/tokens.css and inlined into brand/artifact-theme.css;
   change values here first, then copy.

   Palette is sampled from the logo:
     navy    #012d49  wordmark "ENERGY CONSULTING", building shadows
     glazing #1f86c1  curtain-wall blue of the towers
     canopy  #1d7a1b  wordmark "COLLECTIVE"
     leaf    #86c21a  the leaf highlight
     sun     #f7a41a  the rising sun
*/

:root {
  /* ---- Brand hues (same in both themes) ---- */
  --ecc-navy-900: #012d49;
  --ecc-navy-700: #0e4870;
  --ecc-glazing-500: #1f86c1;
  --ecc-glazing-300: #8acce1;
  --ecc-canopy-600: #1d7a1b;
  --ecc-canopy-400: #5fb03a;
  --ecc-leaf-400: #86c21a;
  --ecc-sun-400: #f7a41a;
  --ecc-sun-700: #9a5800;

  /* ---- Semantic, light theme ---- */
  --bg: #ffffff;              /* page ground */
  --surface: #f3f7f9;         /* alternating bands, table stripes */
  --surface-raised: #ffffff;  /* cards on --surface */
  --surface-inverse: #012d49; /* navy bands, footer */
  --ink: #012d49;             /* body and heading text */
  --ink-muted: #4b6275;       /* secondary text, captions */
  --ink-inverse: #ffffff;     /* text on --surface-inverse */
  --ink-inverse-muted: #b9cddb;
  --line: #d4dfe6;            /* hairlines, card borders (decorative) */
  --line-strong: #7890a3;     /* input borders, 3:1 on --bg */
  --accent: #1d7a1b;          /* primary buttons, success, "complies" */
  --on-accent: #ffffff;
  --accent-soft: #e6f2e3;     /* tinted fills behind accent text */
  --link: #12689c;
  --focus: #1f86c1;
  --highlight: #f7a41a;       /* sun: markers, never text on light */
  --on-highlight: #012d49;
  --highlight-soft: #fff3dc;
  --warning: #9a5800;
  --danger: #b3261e;
  --danger-soft: #fbe9e7;

  /* Data-viz series, in order (from the logo, lightness-staggered) */
  --viz-1: #012d49;
  --viz-2: #1f86c1;
  --viz-3: #1d7a1b;
  --viz-4: #f7a41a;
  --viz-5: #86c21a;
  --viz-6: #8acce1;

  /* ---- Type ---- */
  --font-display: "Lexend", "Segoe UI", system-ui, sans-serif;
  --font-body: "Source Sans 3", "Source Sans Pro", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  --text-xs: 0.8125rem;  /* 13px  captions, table notes */
  --text-sm: 0.9375rem;  /* 15px  UI labels, small print */
  --text-md: 1.0625rem;  /* 17px  body */
  --text-lg: 1.25rem;    /* 20px  lead paragraph */
  --text-xl: 1.625rem;   /* 26px  h3 */
  --text-2xl: 2.125rem;  /* 34px  h2 */
  --text-3xl: 3rem;      /* 48px  h1 */

  /* ---- Space (4px base) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* ---- Radius ---- */
  --radius-sm: 4px;    /* inputs, buttons, badges */
  --radius-md: 10px;   /* cards, panels */
  --radius-leaf: 0 28px 0 28px; /* signature: one featured element per view */
  --radius-pill: 999px;

  --shadow-raised: 0 1px 2px rgba(1, 45, 73, 0.06), 0 6px 20px rgba(1, 45, 73, 0.08);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #071723;
    --surface: #0d2130;
    --surface-raised: #12293a;
    --surface-inverse: #020e17;
    --ink: #e6eef4;
    --ink-muted: #9fb4c4;
    --ink-inverse: #e6eef4;
    --ink-inverse-muted: #9fb4c4;
    --line: #24405a;
    --line-strong: #5a7891;
    --accent: #6cc04a;
    --on-accent: #04210f;
    --accent-soft: #143222;
    --link: #7fc6ee;
    --focus: #7fc6ee;
    --highlight: #f7a41a;
    --on-highlight: #012d49;
    --highlight-soft: #2e2510;
    --warning: #f7b955;
    --danger: #ff8a80;
    --danger-soft: #3a1a1a;
    --viz-1: #8acce1;
    --viz-2: #1f86c1;
    --viz-3: #6cc04a;
    --viz-4: #f7a41a;
    --viz-5: #c9e88f;
    --viz-6: #4b6275;
    --shadow-raised: 0 1px 2px rgba(0, 0, 0, 0.3), 0 6px 20px rgba(0, 0, 0, 0.35);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #071723;
  --surface: #0d2130;
  --surface-raised: #12293a;
  --surface-inverse: #020e17;
  --ink: #e6eef4;
  --ink-muted: #9fb4c4;
  --ink-inverse: #e6eef4;
  --ink-inverse-muted: #9fb4c4;
  --line: #24405a;
  --line-strong: #5a7891;
  --accent: #6cc04a;
  --on-accent: #04210f;
  --accent-soft: #143222;
  --link: #7fc6ee;
  --focus: #7fc6ee;
  --highlight: #f7a41a;
  --on-highlight: #012d49;
  --highlight-soft: #2e2510;
  --warning: #f7b955;
  --danger: #ff8a80;
  --danger-soft: #3a1a1a;
  --viz-1: #8acce1;
  --viz-2: #1f86c1;
  --viz-3: #6cc04a;
  --viz-4: #f7a41a;
  --viz-5: #c9e88f;
  --viz-6: #4b6275;
  --shadow-raised: 0 1px 2px rgba(0, 0, 0, 0.3), 0 6px 20px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}
