/* ==========================================================================
   variables.css — Design tokens (colours, typography, spacing, shadows)
   Edit here to retheme the entire site.
   ========================================================================== */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  /* ── Brand colours ─────────────────────────────────── */
  --green:         #18693C;
  --green-mid:     #1e8049;
  --green-light:   #e8f5ee;
  --yellow:        #FFD05A;
  --yellow-light:  #FFF3CC;
  --yellow-dark:   #e6b820;
  --navy:          #0B2545;
  --navy-light:    #163a6e;

  /* ── Neutrals ──────────────────────────────────────── */
  --white:         #FFFFFF;
  --off-white:     #F9FAFB;
  --text:          #1C2B1E;
  --text-muted:    #5C6B61;
  --border:        #DDE8E1;

  /* ── Status ────────────────────────────────────────── */
  --error:         #C1121F;
  --success:       #18693C;

  /* ── Typography ────────────────────────────────────── */
  --font: 'Montserrat', sans-serif;

  /* ── Border radii ──────────────────────────────────── */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 24px;
  --r-xl: 32px;

  /* ── Shadows ───────────────────────────────────────── */
  --sh-sm: 0 2px 12px rgba(24, 105, 60, .08);
  --sh-md: 0 8px 40px rgba(24, 105, 60, .12);
  --sh-lg: 0 24px 80px rgba(24, 105, 60, .16);
}

html { scroll-behavior: smooth; }

body {
  font-family: var(--font);
  background: var(--white);
  color: var(--text);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img    { max-width: 100%; display: block; }
a      { text-decoration: none; color: inherit; }
button { font-family: var(--font); cursor: pointer; }
