/* ============================================================================
   COLORS — Opportunity@Work brand swatches
   Primary pairing is purple + navy + white/off-white. The other six brand
   colors are an accent set used sparingly (category coding, shapes, illos).
   Each color ships a matching `…-text` token with the accessible text color.
   ========================================================================== */
:root {
  --swatch--transparent: transparent;

  /* Neutrals / surfaces */
  --swatch--dark: #0f153b;             /* deep navy — primary dark surface + body text */
  --swatch--dark-secondary: #000000;
  --swatch--dark-faded: rgba(28, 28, 28, 0.1);

  --swatch--light: #ffffff;
  --swatch--light-secondary: #f9f9f7;  /* warm off-white — alt section background */
  --swatch--light-faded: rgba(255, 255, 255, 0.1);

  /* Brand — primary action */
  --swatch--brand-1: #8c4799;          /* PURPLE — primary brand */
  --swatch--brand-1-faded: #fff6ff;
  --swatch--brand-1-text: var(--swatch--light);

  /* Brand — secondary */
  --swatch--brand-2: #e87722;          /* ORANGE — secondary brand */
  --swatch--brand-2-text: var(--swatch--light);

  /* Brand — accent set (use sparingly) */
  --swatch--brand-3: #9bd3dd;          /* light cyan */
  --swatch--brand-3-text: var(--swatch--dark);

  --swatch--brand-4: #e3e48d;          /* chartreuse / yellow-green */
  --swatch--brand-4-text: var(--swatch--dark);

  --swatch--brand-5: #e03c32;          /* red */
  --swatch--brand-5-text: var(--swatch--light);

  --swatch--brand-6: #56adde;          /* blue */
  --swatch--brand-6-text: var(--swatch--dark);

  --swatch--brand-7: #ffae32;          /* amber / gold */
  --swatch--brand-7-text: var(--swatch--dark);

  --swatch--brand-8: #fe7340;          /* coral */
  --swatch--brand-8-text: var(--swatch--light);
}