/* Eda Salford Quays — Design Tokens
   Single source of truth: colours, typography, spacing.
   Sampled from live site, mapped to brand-guideline names. */

:root {
  /* === Brand palette === */
  --marine: #00A1A6;
  --marine-dark: #007F84;
  --marine-deep: #3AA1A6;
  --bronze: #968A73;
  --bronze-dark: #6E6657;
  --midnight: #23363B;
  --midnight-deep: #18272B;
  --cotton: #EDEDDE;
  --cream: #F5F5F3;
  --mint: #9CE5D6;
  --mint-soft: #C9F0E6;
  --salmon: #FFC4AB;
  --liner-red: #FF4242;
  --sky: #DED5C3;
  --olive: #8A8B65;

  /* === Semantic === */
  --bg: var(--cream);
  --bg-alt: var(--cotton);
  --bg-dark: var(--midnight);
  --ink: #1F1F1F;
  --ink-soft: #4A4A4A;
  --ink-mute: #7A7A78;
  --ink-on-dark: #F5F1E8;
  --line: rgba(31, 31, 31, 0.08);
  --line-dark: rgba(245, 241, 232, 0.14);
  --shadow-sm: 0 1px 2px rgba(35, 54, 59, 0.06), 0 1px 1px rgba(35, 54, 59, 0.04);
  --shadow-md: 0 8px 24px rgba(35, 54, 59, 0.10);
  --shadow-lg: 0 24px 60px rgba(35, 54, 59, 0.18);

  /* === Typography === */
  --font-display: "Nicephore", "Ultra", Georgia, serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Modular scale — premium tightening vs live site */
  --fs-hero: clamp(3.5rem, 7vw, 6rem);          /* 56–96px */
  --fs-display: clamp(2.75rem, 5vw, 4.5rem);    /* 44–72px */
  --fs-h1: clamp(2.25rem, 4vw, 3.5rem);         /* 36–56px */
  --fs-h2: clamp(1.875rem, 3vw, 2.75rem);       /* 30–44px */
  --fs-h3: clamp(1.375rem, 2vw, 1.75rem);       /* 22–28px */
  --fs-h4: 1.25rem;                              /* 20px */
  --fs-lead: clamp(1.125rem, 1.4vw, 1.375rem);  /* 18–22px */
  --fs-body: 1.0625rem;                          /* 17px */
  --fs-small: 0.9375rem;                         /* 15px */
  --fs-eyebrow: 0.8125rem;                       /* 13px */

  --lh-tight: 1.08;
  --lh-snug: 1.25;
  --lh-body: 1.55;
  --lh-relaxed: 1.7;

  --tracking-tight: -0.02em;
  --tracking-snug: -0.01em;
  --tracking-wide: 0.08em;
  --tracking-eyebrow: 0.18em;

  /* === Spacing (8pt grid) === */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --space-section: clamp(4rem, 8vw, 7.5rem);

  /* === Layout === */
  --container: 1320px;
  --container-narrow: 960px;
  --container-text: 720px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-pill: 999px;
  --header-h: 96px;

  /* === Motion === */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 600ms;

  /* === Z-index === */
  --z-nav: 50;
  --z-overlay: 80;
  --z-modal: 100;
}