/* ==========================================================================
   Advanced Rehab & Medical — Design Tokens
   "Empathetic Architect": burgundy-committed, teal/orange accents, tonal light.
   ========================================================================== */

:root {
  /* --- Brand color --- */
  --primary: #800020;          /* burgundy */
  --primary-deep: #5c0017;     /* hover / pressed */
  --primary-rgb: 128 0 32;

  /* Warm gold/amber accent (replaces the former teal) */
  --secondary: #9a6a14;        /* gold/amber, solid fills & focus */
  --secondary-strong: #785010; /* deep gold for text/eyebrows on light (AA) */
  --secondary-fixed: #f4e4c4;  /* soft gold: chips, accents on burgundy */
  --secondary-rgb: 154 106 20;

  --tertiary: #b9531a;         /* warm terracotta, rare actionable accent */
  --tertiary-soft: #ffe1cc;
  --tertiary-rgb: 185 83 26;

  --dark-warm: #1d1114;        /* warm near-black for footer / dark UI */

  /* --- Surfaces (tonal, no-line) --- */
  --surface: #f8f9fa;          /* page canvas */
  --surface-lowest: #ffffff;   /* cards / content */
  --surface-container-low: #f3f4f5;
  --surface-container: #edeeef;
  --surface-variant: #e1e3e4;
  --surface-dim: #d9dadb;

  /* --- Ink --- */
  --ink: #191c1d;              /* body text (never pure black) */
  --ink-muted: #43474e;        /* secondary text, passes 4.5:1 on light */
  --ink-faint: #5f636a;        /* tertiary text on white only */
  --on-dark: #f8f1f2;          /* text on burgundy / dark-warm */
  --on-dark-muted: #e0cdd1;    /* secondary text on burgundy / dark-warm */
  --outline: #74777f;

  /* --- Signature surfaces --- */
  --burgundy-solid: #800020;   /* flat brand surface (no gradient) */
  --glass-bg: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(255, 255, 255, 0.55);
  --glass-blur: blur(16px);

  /* --- Typography --- */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-head: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Fluid type scale (≥1.25 ratio) */
  --text-xs: 0.78rem;
  --text-sm: 0.875rem;
  --text-base: clamp(1rem, 0.97rem + 0.16vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.06rem + 0.32vw, 1.3rem);
  --text-xl: clamp(1.3rem, 1.18rem + 0.6vw, 1.6rem);
  --text-2xl: clamp(1.65rem, 1.36rem + 1.3vw, 2.4rem);
  --text-3xl: clamp(2.1rem, 1.55rem + 2.5vw, 3.5rem);
  --text-4xl: clamp(2.6rem, 1.85rem + 3.4vw, 4.5rem);
  --text-display: clamp(3rem, 2rem + 4.6vw, 5.6rem);

  --leading-tight: 1.04;
  --leading-snug: 1.22;
  --leading-normal: 1.6;
  --tracking-tight: -0.02em;
  --tracking-display: -0.025em;

  /* --- Spacing --- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 5rem;
  --space-16: 7rem;
  --space-section: clamp(4rem, 3rem + 5vw, 8.5rem);
  --gutter: clamp(1.25rem, 0.8rem + 2.4vw, 3rem);
  --maxw: 1240px;
  --maxw-prose: 68ch;

  /* --- Radii (no sharp corners) --- */
  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 0.875rem;
  --radius-xl: 1.25rem;
  --radius-2xl: 1.75rem;
  --radius-pill: 9999px;

  /* --- Elevation (ambient, never pure black) --- */
  --shadow-ambient: 0 1px 2px rgba(25, 28, 29, 0.04), 0 8px 24px rgba(25, 28, 29, 0.05);
  --shadow-card: 0 2px 6px rgba(25, 28, 29, 0.05), 0 18px 40px rgba(25, 28, 29, 0.07);
  --shadow-lifted: 0 20px 50px rgba(25, 28, 29, 0.13);
  --shadow-burgundy: 0 14px 34px rgba(128, 0, 32, 0.28);

  /* --- Motion --- */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --dur-fast: 160ms;
  --dur-normal: 320ms;
  --dur-slow: 620ms;

  /* --- Z-index scale --- */
  --z-base: 1;
  --z-raised: 10;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-nav: 300;
  --z-overlay: 400;
  --z-modal: 500;
  --z-toast: 600;
}