:root {
  /* Colours */
  --color-navy: #1E2761;
  --color-deep-navy: #002060;
  --color-bright-blue: #0F9ED5;
  --color-steel-blue: #215E99;
  --color-green: #3A7D22;
  --color-white: #FFFFFF;
  --color-off-white: #F8F9FA;
  --color-light-grey: #E8E8E8;
  --color-mid-grey: #666666;

  /* Typography */
  --font-heading: 'Lato', sans-serif;
  --font-body: 'Lato', Arial, sans-serif;

  --font-size-hero: clamp(2.5rem, 5vw, 3.5rem);
  --font-size-h1: clamp(2rem, 4vw, 2.75rem);
  --font-size-h2: clamp(1.5rem, 3vw, 2rem);
  --font-size-h3: clamp(1.25rem, 2.5vw, 1.5rem);
  --font-size-body: 1.125rem;
  --font-size-small: 0.875rem;

  --line-height-heading: 1.2;
  --line-height-body: 1.7;

  /* Layout */
  --max-width: 1200px;
  --max-width-narrow: 800px;
  --nav-height: 80px;
  --section-padding: clamp(3rem, 8vw, 6rem);
  --card-radius: 4px;

  /* Motion */
  --transition-speed: 0.3s;
}