/* ==========================================================================
   Hospital Success design tokens (dark, B2B, international)
   Every colour, font, spacing step, radius, shadow and motion value lives here.
   These map 1:1 to the WordPress theme later (theme.json / :root).
   ========================================================================== */

:root {
  color-scheme: dark;

  /* Brand colours (from the logo) */
  --brand-blue: #1D57D6;
  --brand-blue-dark: #1747B0;
  --shield-red: #D0021B;           /* logo only, never for UI */

  /* Brand blue, tuned for dark surfaces */
  --sapphire: #3B74F0;             /* glows, rings, fills */
  --sapphire-bright: #5D8DFF;      /* icons and small accents on dark */
  --sapphire-soft: #A9C3FF;        /* accent words, 10:1 on midnight */

  /* Logo red, used as a precise accent (never for large fills or primary buttons) */
  --red-bright: #FF4D5E;           /* lines, dots and glows on navy */
  --red-soft: #FF8A96;             /* small accent text on navy, 6:1 */
  --red-wash: rgba(208, 2, 27, 0.14);
  --sky: #A9C3FF;                  /* accent text on navy */

  /* Hospital navy (owner supplied #0B2B5B) */
  --navy: #0B2B5B;                 /* dark frames */
  --midnight: #061A3A;             /* deepest navy: hero, footer, page background */
  --midnight-2: #0B2B5B;           /* alternate dark frame */
  --midnight-3: #12397A;           /* raised panels on navy */
  --ice: #EEF3FD;                  /* soft light frames */
  --platinum: #F3F5FA;             /* headings */
  --ivory: #CAD6EE;                /* body text, 9:1 on navy */
  --mist: #9FB1D1;                 /* secondary text, 6:1 on navy */
  --hairline: rgba(255, 255, 255, 0.09);
  --hairline-strong: rgba(255, 255, 255, 0.16);
  --glass: rgba(255, 255, 255, 0.035);
  --glass-strong: rgba(255, 255, 255, 0.06);

  /* Legacy names kept so older templates still resolve */
  --white: #FFFFFF;
  --ink: var(--platinum);
  --slate: var(--ivory);
  --muted: var(--mist);
  --tint: var(--midnight-2);
  --line: var(--hairline);

  /* Feedback (forms only) */
  --error: #FF8A80;
  --success: #6EE7B7;

  /* Semantic roles */
  --color-bg: var(--midnight);
  --color-text: var(--ivory);
  --color-heading: var(--platinum);
  --color-accent: var(--sapphire);
  --color-focus: var(--sky);

  /* Typography */
  --font-serif: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --fs-xs: 0.78rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-lg: clamp(1.125rem, 1.05rem + 0.35vw, 1.3rem);
  --fs-h5: clamp(1.4rem, 1.3rem + 0.4vw, 1.65rem);
  --fs-h4: clamp(1.7rem, 1.5rem + 0.7vw, 2.1rem);
  --fs-h3: clamp(2rem, 1.7rem + 1.3vw, 2.9rem);
  --fs-h2: clamp(2.6rem, 1.9rem + 3vw, 4.75rem);
  --fs-display: clamp(3.1rem, 1.8rem + 5.6vw, 7.5rem);
  --fs-manifesto: clamp(2rem, 1.3rem + 3vw, 4.1rem);

  --lh-tight: 0.98;
  --lh-heading: 1.08;
  --lh-body: 1.7;
  --tracking-eyebrow: 0.24em;

  /* Spacing (4/8 scale) */
  --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-9: 4rem;
  --space-10: 5rem;
  --space-11: 6rem;
  --space-12: 8rem;
  --section-y: clamp(5rem, 3rem + 8vw, 11rem);
  --gutter: clamp(1.25rem, 0.6rem + 3vw, 3rem);

  /* Layout */
  --container: 1280px;
  --container-narrow: 900px;
  --header-h: 88px;
  --header-h-small: 70px;

  /* Radii */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  /* Elevation and glow */
  --shadow-lg: 0 40px 80px -30px rgba(0, 0, 0, 0.7);
  --glow-sm: 0 0 0 1px rgba(93, 141, 255, 0.25), 0 10px 30px -10px rgba(59, 116, 240, 0.55);
  --glow-lg: 0 0 120px 10px rgba(59, 116, 240, 0.18);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 800ms;
  --dur-reveal: 1200ms;
  --stagger: 80ms;

  /* Z-index scale */
  --z-base: 1;
  --z-raised: 10;
  --z-header: 100;
  --z-drawer: 300;
  --z-modal: 500;
  --z-cursor: 900;
  --z-intro: 1000;
}