/* ==========================================================================
   CURA Cognitive — Design Tokens
   Brand palette per client spec — use these CSS custom properties everywhere;
   never hardcode hex values in page stylesheets.
   ========================================================================== */

:root {
  /* ---------- Raw brand palette (exact hex values, do not alter) ---------- */
  --teal: #1B3B3A;   /* Deep Clinical Teal — primary brand color, headers, primary buttons */
  --amber: #E4A430;  /* Amber Clarity — signature accent, key CTA + emphasis moments only */
  --fog: #B8C4BE;    /* Warm Fog — muted secondary tone, used sparingly */
  --paper: #F7F6F2;  /* Paper White — main background */
  --ink: #26302E;    /* Ink Slate — body text */
  --sage: #5C7A70;   /* Sage Confidence — secondary accent, links, secondary buttons */

  --teal-rgb: 27, 59, 58;
  --amber-rgb: 228, 164, 48;
  --fog-rgb: 184, 196, 190;
  --paper-rgb: 247, 246, 242;
  --ink-rgb: 38, 48, 46;
  --sage-rgb: 92, 122, 112;

  /* Sage Confidence measures ~4.3:1 on Paper White — just under the 4.5:1 AA
     floor for normal body text. --link is a manually darkened variant of Sage
     for inline text links only; every other use of "sage" (buttons, icons,
     borders, dividers) should reference --sage directly. */
  --link: #4C645C;

  /* ---------- Semantic: surfaces ---------- */
  --surface-page: var(--paper);
  --surface-teal: var(--teal);
  --surface-card: var(--paper);
  --surface-fog-tint: #E3E7E2; /* Warm Fog mixed lightly into Paper White, for qualifier cards */

  /* ---------- Semantic: text ---------- */
  --text-on-paper: var(--ink);
  --text-on-paper-muted: rgba(var(--ink-rgb), 0.72);
  --text-on-teal: var(--paper);
  --text-on-teal-muted: rgba(var(--paper-rgb), 0.72);

  /* ---------- Semantic: accent ---------- */
  --accent-cta: var(--amber);      /* the ONE key CTA color — reserved, not a background */
  --accent-cta-text: var(--teal);
  --accent-primary: var(--teal);
  --accent-secondary: var(--sage);

  /* ---------- Borders (low-contrast hairlines) ---------- */
  --border-on-paper: rgba(var(--ink-rgb), 0.14);
  --border-on-teal: rgba(var(--paper-rgb), 0.2);
  --border-fog: var(--fog);

  /* ---------- Focus ring ---------- */
  /* Amber reads clearly on both Paper White and Deep Clinical Teal, so a
     single focus-ring color works across every surface on the page. */
  --focus-ring: var(--amber);

  /* ---------- Shadows ---------- */
  --shadow-card: 0 16px 40px rgba(var(--teal-rgb), 0.16);

  /* ---------- Typography ---------- */
  --font-display: "Source Serif 4", Georgia, "Iowan Old Style", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  /* ---------- Spacing scale ---------- */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;
  --space-2xl: 96px;

  /* ---------- Layout ---------- */
  --max-width: 1120px;
  --max-width-narrow: 720px;
  --radius: 6px;
}