/* === ZenForge Branding ===
   Minimal palette (light-only):
   Ink      #354B6B
   Paper    #FFFFFF
   Midnight #111923
   Teal     #15A99A
   Indigo   #464AD0
   Optional Mist #C5CCD5

   Contrast-safe text rules:
   - On Paper: use Ink for body text.
   - Links: Indigo on light theme.
*/

:root {
  --ink: #354B6B;
  --paper: #FFFFFF;
  --midnight: #111923;
  --teal: #15A99A;
  --indigo: #464AD0;
  --mist: #C5CCD5;

  /* Minimal CSS tokens */
  --bg: #FFFFFF;
  --text: var(--ink);
  --accent-1: #464AD0; /* indigo */
  --accent-2: #15A99A; /* teal */
  --bg-dark: #111923;

  /* Existing site semantic tokens */
  --color-bg: var(--bg);
  --color-surface: rgba(53, 75, 107, 0.05);
  --color-surface-solid: var(--paper);
  --color-text: var(--text);
  --color-text-muted: #506178;
  --color-accent: var(--accent-1);
  --color-accent-end: var(--accent-2);
  --color-accent-hover: #3B3FB4;
  --color-border: var(--mist);
  --color-glow: rgba(70, 74, 208, 0.24);
  --color-on-accent: var(--paper);

  --header-bg: rgba(255, 255, 255, 0.88);

  /* Bold hero mesh – vivid blobs */
  --hero-mesh-1: rgba(70, 74, 208, 0.32);
  --hero-mesh-2: rgba(21, 169, 154, 0.26);
  --hero-mesh-3: rgba(53, 75, 107, 0.14);
  --hero-grid-dot: rgba(53, 75, 107, 0.10);

  /* Section backgrounds */
  --section-alt-bg: rgba(70, 74, 208, 0.04);
  --section-accent-bg: linear-gradient(135deg, var(--indigo), var(--teal));

  /* Brand-colored shadows */
  --shadow-colored: rgba(70, 74, 208, 0.12);
  --shadow-colored-hover: rgba(70, 74, 208, 0.22);

  --status-released-fg: #16a34a;
  --status-released-border: rgba(22, 163, 74, 0.35);
  --status-released-bg: rgba(22, 163, 74, 0.10);
  --status-in-progress-fg: var(--indigo);
  --status-in-progress-border: rgba(70, 74, 208, 0.35);
  --status-in-progress-bg: rgba(70, 74, 208, 0.10);
  --status-exploring-fg: var(--teal);
  --status-exploring-border: rgba(21, 169, 154, 0.35);
  --status-exploring-bg: rgba(21, 169, 154, 0.10);
}
