/* AI WORKS — Color tokens
 * §1 Palette (α = navy-forward + lavender accent)
 * All hex verbatim from the brand spec — do not "harmonize".
 */

:root {
  /* Navy family — headings, emphasis, hero base */
  --color-navy-deep: #1B2559;      /* Deep Navy — H1/H2, hero split */
  --color-navy-soft: #2E3A75;      /* Navy Soft — hero gradient stop, card borders */

  /* Orange — CTA only */
  --color-orange-vivid: #F97316;   /* Vivid Orange — CTA fill, highlight */
  --color-orange-deep: #EA580C;    /* Orange Deep — CTA hover, boundary */

  /* Lavender — section-band accent (§3 / §4 / §9 / §13) */
  --color-lavender-soft: #E9D5FF;  /* Soft Lavender — band base, card fill */
  --color-lavender-deep: #A78BFA;  /* Lavender Deep — band accent, icon fill */

  /* Neutrals */
  --color-cream: #FFF9F0;          /* Warm Cream — page background */
  --color-white: #FFFFFF;

  /* Ink (text) */
  --color-ink-dark: #1F2937;       /* body + heading */
  --color-ink-mid: #4B5563;        /* supporting copy */
  --color-ink-light: #6B7280;      /* meta, small labels */

  /* --- Semantic aliases --- */
  --bg-page: var(--color-cream);
  --bg-surface: var(--color-white);
  --bg-band-lavender: var(--color-lavender-soft);
  --bg-hero-navy: var(--color-navy-deep);

  --text-heading: var(--color-navy-deep);
  --text-body: var(--color-ink-dark);
  --text-muted: var(--color-ink-mid);
  --text-meta: var(--color-ink-light);
  --text-on-navy: var(--color-white);
  --text-on-lavender: var(--color-ink-dark);
  --text-on-orange: var(--color-white);

  --accent-cta: var(--color-orange-vivid);
  --accent-cta-hover: var(--color-orange-deep);
  --accent-lavender: var(--color-lavender-deep);

  --border-card: color-mix(in oklab, var(--color-navy-soft) 12%, transparent);
  --border-subtle: color-mix(in oklab, var(--color-ink-dark) 8%, transparent);

  /* Focus ring */
  --ring-focus: 0 0 0 3px color-mix(in oklab, var(--color-orange-vivid) 45%, transparent);
}