/* DBS Hub design tokens.
   Ported from the REA capture of priceservicesgroup.com (research/REA-REPORT.md, "Design tokens")
   and remapped to the Diversity Business Services logo palette (PLANNING.md, REA Blueprint token map). */
:root {
  /* Brand (REA --primary #9059B5 -> DBS blue; darkened for AA text/buttons) */
  --brand-blue: #0090DC;
  --brand-green: #67C81A;
  --brand-red: #EE3524;
  --brand-yellow: #FFD200;
  --brand-gold: #B0A030;
  --rainbow: linear-gradient(90deg, #67C81A 0%, #FFD200 26%, #EE3524 52%, #B0A030 74%, #0090DC 100%);

  --primary: #0072B0;        /* REA --primary */
  --primary-dark: #0B2338;   /* REA --primary-dark */
  --primary-text: #005F94;   /* REA --primary-text */
  --accent: #67C81A;         /* REA --accent (teal -> DBS green) */
  --accent-dark: #4FA510;
  --accent-text: #2F7A07;
  --star: #FFD200;           /* REA --star */
  --alert: #EE3524;

  /* Neutrals */
  --ink: #10202E;            /* REA --ink */
  --ink-fixed: #0B2338;      /* dark sections + footer */
  --paper: #FBF8F2;          /* REA --paper (cream) */
  --soft: #EEF6FC;           /* REA --soft (lavender -> pale DBS blue) */
  --line: #D6E6F2;           /* REA --line */
  --muted: #4A5B6B;          /* REA --muted */
  --card-bg: #FFFFFF;
  --header-bg: linear-gradient(to right, rgba(224,240,251,.92), rgba(255,255,255,.92), rgba(234,247,224,.92));
  --cta-gradient: linear-gradient(135deg, #0B2338, #0072B0);
  --hero-overlay: linear-gradient(110deg, rgba(11,35,56,.96) 35%, rgba(0,114,176,.82));

  /* Type (REA: Playfair Display + Open Sans) */
  --heading: "Playfair Display", Georgia, serif;
  --body: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wordmark: "Montserrat", "Open Sans", sans-serif;
  --fs-base: 1.125rem;

  /* Layout (REA values) */
  --max: 1200px;
  --section-y: 5rem;
  --gap-grid: 1.5rem;
  --r: .75rem;
  --r-card: 1.25rem;
  --r-input: .6rem;
  --r-pill: 999px;

  /* Shadows (REA, re-tinted) */
  --shadow-card-hover: 0 8px 32px rgba(0,114,176,.14);
  --shadow-btn-hover: 0 4px 20px rgba(0,114,176,.35);
  --shadow-photo: 0 16px 48px rgba(0,114,176,.18);
  --shadow-dropdown: 0 12px 24px rgba(16,32,46,.12);

  color-scheme: light;
}

/* Dark theme (REA [data-theme=dark] remapped) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #E6EDF3; --paper: #0F1C28; --soft: #0A1520; --line: #22374A;
    --muted: rgba(230,237,243,.78); --card-bg: rgba(255,255,255,.04);
    --header-bg: rgba(15,28,40,.94);
    --primary: #4DB5EE; --primary-text: #7CC8F2; --primary-dark: #0090DC; --accent-text: #8BDB4F;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ink: #E6EDF3; --paper: #0F1C28; --soft: #0A1520; --line: #22374A;
  --muted: rgba(230,237,243,.78); --card-bg: rgba(255,255,255,.04);
  --header-bg: rgba(15,28,40,.94);
  --primary: #4DB5EE; --primary-text: #7CC8F2; --primary-dark: #0090DC; --accent-text: #8BDB4F;
  color-scheme: dark;
}

/* Text-size control (from the REA a11y toolbar A / A+ / A++) */
:root[data-text="lg"] { font-size: 112.5%; }
:root[data-text="xl"] { font-size: 125%; }