/* ==========================================================================
   RouteSlate — Brand Tokens
   Single source of truth for colour, type and spacing.
   "Navigate. Map. Deliver."
   ========================================================================== */
:root {
  /* — Core ink & surface — */
  --rs-ink:        #0B0B0F;   /* logo black / primary text */
  --rs-black:      #000000;
  --rs-white:      #FFFFFF;

  /* — Electric blue (accent) — */
  --rs-blue:       #2563EB;   /* primary accent / CTAs */
  --rs-blue-600:   #2563EB;
  --rs-blue-700:   #1D4ED8;   /* hover / pressed */
  --rs-blue-400:   #60A5FA;
  --rs-blue-tint:  #EFF4FF;   /* soft blue background */
  --rs-blue-ring:  rgba(37, 99, 235, .35);

  /* — Slate neutrals — */
  --rs-slate-900:  #0F172A;   /* headings */
  --rs-slate-700:  #334155;
  --rs-slate-600:  #475569;   /* body text */
  --rs-slate-400:  #94A3B8;   /* muted */
  --rs-slate-200:  #E2E8F0;   /* borders */
  --rs-slate-100:  #F1F5F9;
  --rs-slate-50:   #F8FAFC;   /* page tint */

  /* — Semantic — */
  --rs-success:    #16A34A;
  --rs-warning:    #D97706;
  --rs-danger:     #DC2626;

  /* — Typography — */
  --rs-font-display: "Poppins", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --rs-font-body:    "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;

  /* — Radius & shadow — */
  --rs-radius-sm: 10px;
  --rs-radius:    16px;
  --rs-radius-lg: 24px;
  --rs-shadow:    0 10px 30px rgba(15, 23, 42, .08);
  --rs-shadow-lg: 0 24px 60px rgba(15, 23, 42, .12);

  /* — Layout — */
  --rs-maxw: 1180px;
}