/* ============================================================
   RANDOLPH HEALTH SERVICES — DESIGN TOKENS  (v2.0, 2026-07-01)
   CRIMSON identity — supersedes the teal/blue v1.0 tokens.
   Single source of truth for color, type, spacing, radius,
   shadow, and motion. Imported by the website and all HTML
   collateral so everything inherits one consistent system.
   Brand source: Brand/design-expert/references/brand-scheme.md
   ============================================================ */

:root {
  /* --- Brand color (exact, sampled from final crimson logo art) --- */
  --rhs-navy:        #0B1742; /* base / dark ground — ~70% of surfaces */
  --rhs-navy-800:    #101d52; /* raised panel on navy */
  --rhs-navy-700:    #172561; /* hairline / border on navy */
  --rhs-deepnavy:    #060E2B; /* supporting quiet panels, dividers */
  --rhs-burgundy:    #4C0723; /* R-gradient top / deep accent, hover/pressed */
  --rhs-crimson:     #EE0B1F; /* R-gradient bottom / vivid accent, key numbers */
  --rhs-red:         #C8102E; /* CTA / button fill carrying white text (AA) */
  --rhs-white:       #FFFFFF;
  --rhs-ink:         #0B1742; /* text color for light surfaces = navy */

  /* --- Neutrals for light surfaces --- */
  --rhs-paper:       #FFFFFF;
  --rhs-paper-2:     #F5F6FA; /* near-white section band */
  --rhs-line:        #E2E6F0; /* border on light */
  --rhs-muted:       #59607A; /* muted body on light */

  /* --- Text-on-dark ramp --- */
  --rhs-on-navy:         rgba(255,255,255,0.96);
  --rhs-on-navy-muted:   rgba(255,255,255,0.68);
  --rhs-on-navy-faint:   rgba(255,255,255,0.45);

  /* --- Signature gradient (use sparingly: the R, one hero element, key numbers) --- */
  --rhs-gradient:        linear-gradient(140deg, #4C0723 0%, #EE0B1F 100%);
  --rhs-gradient-soft:   linear-gradient(140deg, rgba(76,7,35,0.16) 0%, rgba(238,11,31,0.14) 100%);

  /* --- Typography --- */
  --rhs-font-display: 'Montserrat', system-ui, -apple-system, Segoe UI, sans-serif;
  --rhs-font-body:    'Inter', system-ui, -apple-system, Segoe UI, sans-serif;

  /* Modular type scale (1.250 major-third), rem */
  --fs-eyebrow: 0.80rem;   /* letter-spaced caps */
  --fs-small:   0.875rem;
  --fs-body:    1.0625rem; /* 17px base — comfortable reading */
  --fs-lead:    1.25rem;
  --fs-h4:      1.375rem;
  --fs-h3:      1.75rem;
  --fs-h2:      2.5rem;
  --fs-h1:      3.5rem;
  --fs-display: 4.75rem;

  --lh-tight:   1.05;
  --lh-snug:    1.22;
  --lh-body:    1.62;

  --ls-eyebrow: 0.16em;   /* mirrors "HEALTH SERVICES" letter-spacing */
  --ls-tight:  -0.02em;

  /* --- Spacing scale (4px base) --- */
  --sp-1: 0.25rem; --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-12: 3rem;   --sp-16: 4rem;
  --sp-24: 6rem;   --sp-32: 8rem;

  /* --- Radius --- */
  --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-xl: 32px; --r-pill: 999px;

  /* --- Elevation (navy-tinted, restrained) --- */
  --sh-1: 0 1px 2px rgba(11,23,66,0.10);
  --sh-2: 0 10px 30px -12px rgba(11,23,66,0.35);
  --sh-glow: 0 0 0 1px rgba(238,11,31,0.35), 0 12px 40px -14px rgba(200,16,46,0.45);

  /* --- Motion --- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 140ms; --dur: 240ms; --dur-slow: 420ms;

  /* --- Layout --- */
  --maxw: 1160px;
  --maxw-narrow: 760px;
}