/* MBS Global — Color tokens
   A dark, editorial palette: a warm near-black neutral ramp plus four
   chromatic families. Downriver (deep navy) is the brand primary; Mexican Red,
   Sea Green and Rope are reserved accents used sparingly for category coding.
   Every value mirrors the source export's design tokens exactly. */

:root {
  /* ----- Neutral ramp (warm near-black → white) ----- */
  --color-white: #ffffff;
  --color-neutral-lightest: #f2f2f2;
  --color-neutral-lighter: #d9d9d8;
  --color-neutral-light: #b4b3b2;
  --color-neutral: #838180;
  --color-neutral-dark: #514f4d;
  --color-neutral-darker: #1f1d1a;
  --color-neutral-darkest: #070401;

  /* ----- Downriver — brand primary (deep navy) ----- */
  --color-downriver-lightest: #e6e9ec;
  --color-downriver-lighter: #ced3da;
  --color-downriver-light: #53667e;
  --color-downriver: #0a2548;
  --color-downriver-dark: #081d39;
  --color-downriver-darker: #040e1c;
  --color-downriver-darkest: #030b15;

  /* ----- Mexican Red — accent (alerts / Health) ----- */
  --color-mexican-red-lightest: #f6e9e9;
  --color-mexican-red-lighter: #edd4d4;
  --color-mexican-red-light: #c06969;
  --color-mexican-red: #a52a2a;
  --color-mexican-red-dark: #842121;
  --color-mexican-red-darker: #421010;
  --color-mexican-red-darkest: #310c0c;

  /* ----- Sea Green — accent (success / Education) ----- */
  --color-sea-green-lightest: #eaf3ee;
  --color-sea-green-lighter: #d5e7dd;
  --color-sea-green-light: #6cad89;
  --color-sea-green: #2e8b57;
  --color-sea-green-dark: #246f45;
  --color-sea-green-darker: #123722;
  --color-sea-green-darkest: #0d291a;

  /* ----- Rope — accent (warm gold / Consulting) ----- */
  --color-rope-lightest: #f3eee8;
  --color-rope-lighter: #e7ddd1;
  --color-rope-light: #ad8a5e;
  --color-rope: #8a5819;
  --color-rope-dark: #6e4614;
  --color-rope-darker: #37230a;
  --color-rope-darkest: #291a07;

  /* ----- Alpha overlays (on dark surfaces) ----- */
  --color-white-5: rgba(255, 255, 255, 0.05);
  --color-white-10: rgba(255, 255, 255, 0.1);
  --color-white-15: rgba(255, 255, 255, 0.15);
  --color-white-20: rgba(255, 255, 255, 0.2);
  --color-white-30: rgba(255, 255, 255, 0.3);
  --color-white-40: rgba(255, 255, 255, 0.4);
  --color-white-50: rgba(255, 255, 255, 0.5);
  --color-white-60: rgba(255, 255, 255, 0.6);

  --color-black-5: rgba(7, 4, 1, 0.05);
  --color-black-10: rgba(7, 4, 1, 0.1);
  --color-black-15: rgba(7, 4, 1, 0.15);
  --color-black-20: rgba(7, 4, 1, 0.2);
  --color-black-40: rgba(7, 4, 1, 0.4);
  --color-black-50: rgba(7, 4, 1, 0.5);
  --color-black-60: rgba(7, 4, 1, 0.6);

  /* ----- Semantic aliases (theme-agnostic intent) ----- */
  --brand: var(--color-downriver);
  --brand-hover: var(--color-downriver-dark);
  --accent-health: var(--color-mexican-red);
  --accent-education: var(--color-sea-green);
  --accent-consulting: var(--color-rope);

  --surface-page: var(--color-neutral-darkest);
  --surface-raised: var(--color-neutral-darker);
  --surface-navy: var(--color-downriver-darkest);

  --text-primary: var(--color-white);
  --text-muted: var(--color-white-60);
  --text-inverse: var(--color-neutral-darkest);

  --border-subtle: var(--color-white-20);
  --border-strong: var(--color-white-40);
}