/* Binzr Broz — Design Tokens
   Navy is sampled from the current logo (assets/images/brand/logo.png) and the old
   stylesheet (#144579 / #23589d / #081e5b). The orange accent is taken from the flame
   in the legacy logo (logo-legacy.png) and is a proposal — confirm with Charles. */
:root {
  /* Brand — Binzr Navy */
  --navy-900: #081E5B;
  --navy-800: #0F3468;
  --navy-700: #144579;   /* primary: header text, headings, primary buttons */
  --navy-600: #23589D;   /* hover, links, secondary accents */
  --navy-500: #3A73BF;
  --navy-100: #DCE6F4;
  --navy-50:  #EEF3FA;

  /* Brand — Flame Orange (accent)
     Contrast: white text passes AA (4.5:1) only on orange-700 and darker, so filled buttons and
     the CTA band use orange-700. orange-500 is for large text, icons, bars and glows. */
  --orange-800: #963A0B;
  --orange-700: #B4460E;  /* filled CTAs, CTA band, small orange text on white */
  --orange-600: #CC5314;
  --orange-500: #E8641B;  /* large numbers, icons, decorative bars, hero glow */
  --orange-100: #FDE7D8;
  --orange-50:  #FEF3EB;

  /* Neutrals */
  --white: #FFFFFF;
  --gray-50:  #F7F9FB;
  --gray-100: #EEF1F4;
  --gray-200: #E1E6EB;
  --gray-400: #9AA5B1;
  --gray-600: #62707F;
  --gray-700: #46525F;
  --gray-800: #2B3541;
  --gray-900: #171E26;

  /* Semantic */
  --color-bg: var(--white);
  --color-bg-alt: var(--gray-50);
  --color-text: var(--gray-800);
  --color-text-muted: var(--gray-600);
  --color-heading: var(--navy-700);
  --color-primary: var(--navy-700);
  --color-primary-hover: var(--navy-600);
  --color-accent: var(--orange-700);
  --color-accent-hover: var(--orange-800);
  --color-border: var(--gray-200);
  --color-success: #1E8E3E;
  --color-error: #C4281C;

  /* Type */
  --font-heading: "Montserrat", "Segoe UI", Arial, sans-serif;
  --font-body: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: clamp(1.15rem, 1rem + 0.5vw, 1.35rem);
  --text-2xl: clamp(1.4rem, 1.2rem + 1vw, 1.75rem);
  --text-3xl: clamp(1.7rem, 1.35rem + 1.5vw, 2.3rem);
  --text-4xl: clamp(2rem, 1.5rem + 2.2vw, 3rem);
  --text-hero: clamp(2.2rem, 1.4rem + 3.6vw, 4rem);
  --leading-tight: 1.12;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;
  --tracking-caps: 0.08em;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 6rem;
  --section-y: clamp(3.5rem, 6vw, 6rem);
  --gutter: 1rem;
  --container: 1200px;
  --container-narrow: 820px;

  /* Misc */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 3px rgba(8, 30, 91, 0.10);
  --shadow: 0 6px 20px rgba(8, 30, 91, 0.12);
  --shadow-lg: 0 18px 45px rgba(8, 30, 91, 0.20);
  --transition: 180ms ease;
  --header-h: 76px;
}