/* IntentClose — Color tokens (design system, 2026-10-02)
 * Base palette + semantic aliases. Prefer the semantic aliases in product
 * code; reach for the raw scale only when a semantic name does not exist.
 */
:root {
  /* ---- Base palette ---------------------------------------------------- */
  /* Blue — primary brand. Hero bands, headers, primary surfaces. */
  --blue-600: #2558AB;          /* primary */
  --blue-700: #1D4A92;          /* primary dark / gradient end / hover */
  --blue-50: #F1F6FF;           /* soft tint: selected states, secondary-button hover */

  /* Coral — the call to action. A fill only: text and icons on it use --on-cta. */
  --coral-500: #FF8057;         /* accent */
  --coral-600: #FF5C26;         /* accent gradient end */
  --coral-700: #C94A21;         /* coral text on white, 4.68:1: labels on a white button */

  /* Gold — secondary accent. Stars, small details only. */
  --gold-500: #EDB059;

  /* Neutrals / ink */
  --ink-900: #1B1B1B;           /* dark bands, footer */
  --ink-700: #333333;           /* headings */
  --ink-500: #666666;           /* body text */
  --ink-400: #8A8F98;           /* control edges, disabled text (3.25:1 on white: never readable text) */
  --ink-450: #6B6F78;           /* muted text: 5.04:1 on white, 4.58:1 on --surface-2 */
  --ink-950: #04091A;           /* brand ink: the CTA label, the focus ring */
  --line-200: #E6E8EC;          /* hairline borders on light */
  --line-300: #D9DCE1;          /* stronger borders */

  /* Surfaces */
  --white: #FFFFFF;
  --surface-1: #F7F8FA;         /* section backgrounds, cards */
  --surface-2: #F4F4F4;         /* alternate sections */

  /* Semantic status */
  --success-500: #13B981;       /* dots and bars beside a word (2.53:1 on white: never text) */
  --success-700: #047857;       /* success text + icons on light: 5.48:1 */
  --success-50: #ECFDF5;
  --warning-700: #B45309;       /* 5.02:1 on white */
  --warning-50: #FFFBEB;
  --danger-700: #B91C1C;        /* 6.47:1 on white */
  --danger-50: #FEF2F2;

  /* ---- Semantic aliases ------------------------------------------------ */
  --color-primary: var(--blue-600);
  --color-primary-strong: var(--blue-700);
  --color-accent: var(--coral-500);
  --color-accent-strong: var(--coral-600);
  --color-gold: var(--gold-500);
  --color-success: var(--success-500);

  --text-heading: var(--ink-700);
  --text-body: var(--ink-500);
  --text-muted: var(--ink-450);
  --text-eyebrow: var(--blue-600);
  --text-on-dark: var(--white);
  --text-on-primary: var(--white);
  --text-link: var(--blue-600);
  --text-success: var(--success-700);
  --on-cta: #FFFFFF;                /* text + icons on the coral gradient: white is the brand look (owner call 2026-10-02), 2.48:1 to 3.08:1, below AA; --ink-950 would pass at 8.00:1 */
  --line-control: var(--ink-400);   /* edges of inputs and secondary buttons: 3:1 or more */
  --focus-color: var(--ink-950);    /* keyboard focus outline; dark and blue bands re-declare it white */

  --surface-page: var(--white);
  --surface-muted: var(--surface-1);
  --surface-alt: var(--surface-2);
  --surface-dark: var(--ink-900);
  --surface-primary: var(--blue-600);
  --surface-card: var(--white);

  --border-color: var(--line-200);
  --border-color-strong: var(--line-300);
  --border-on-dark: rgba(255, 255, 255, 0.16);

  /* ---- Gradients ------------------------------------------------------- */
  --gradient-cta: linear-gradient(151deg, #FF8057 38%, #FF5C26 100%); /* @kind color */
  --gradient-hero: linear-gradient(120deg, #2558AB, #1D4A92); /* @kind color */

  /* ---- Focus ----------------------------------------------------------- */
  --focus-ring: 0 0 0 3px rgba(37, 88, 171, 0.35);
}