:root {
  /* Colours */
  --court-green: #7CB342;
  --court-green-dark: #5B8C2A;
  --court-green-soft: rgba(124, 179, 66, 0.08);
  --court-green-light: #E8F5D9;
  --black: #1A1A1A;
  --black-deep: #111111;
  --charcoal: #2D2D2D;
  --ball-yellow: #D4E157;
  --ball-yellow-soft: rgba(212, 225, 87, 0.12);
  --red: #E53935;
  --white: #FFFFFF;
  --offwhite: #F5F5F0;
  --surface: #FAFAF7;
  --grey: #6B6B6B;
  --grey-soft: #A8A8A8;
  --border: rgba(26, 26, 26, 0.08);
  --border-strong: rgba(26, 26, 26, 0.14);

  /* Fonts */
  --font-body: 'Barlow', system-ui, -apple-system, sans-serif;
  --font-display: 'Barlow Condensed', 'Barlow', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  /* Type scale (fluid) */
  --text-h1: clamp(2.5rem, 1.5rem + 3.33vw, 4rem);
  --text-h2: clamp(1.875rem, 1.25rem + 2.08vw, 2.75rem);
  --text-h3: clamp(1.375rem, 1.125rem + 0.83vw, 1.75rem);
  --text-body: clamp(0.875rem, 0.85rem + 0.14vw, 0.9375rem);
  --text-eyebrow: 0.75rem;
  --text-eyebrow-sm: 0.6875rem;
  --text-cta: 0.8125rem;
  --text-nav: 0.75rem;

  /* Spacing (fluid) */
  --space-section: clamp(3.5rem, 2.5rem + 3.33vw, 6rem);
  --space-gutter: clamp(1.25rem, 0.75rem + 1.67vw, 2.5rem);
  --container-max: 1280px;

  /* Radius */
  --radius-card: 12px;
  --radius-btn: 8px;
  --radius-tag: 6px;
  --radius-pill: 100px;

  /* Easing */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-aggressive: cubic-bezier(0.86, 0, 0.07, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Durations */
  --dur-ui: 200ms;
  --dur-section: 400ms;
  --dur-cta: 400ms;

  /* Shadows */
  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-card-hover: 0 12px 32px rgba(0, 0, 0, 0.1);
  --shadow-nav: 0 2px 20px rgba(0, 0, 0, 0.05);
}