:root {
  --font-body: "Quicksand", system-ui, -apple-system, sans-serif;
  --font-heading: "Lato", system-ui, -apple-system, sans-serif;

  --color-primary: #5e98ca;
  --color-secondary: #7ba760;
  --color-accent: #a8cace;
  --color-text: #143a5a;
  --color-bg: #f5f8fb;
  --color-white: #ffffff;
  --color-surface: #f2f7fb;
  --color-border-soft: rgba(20, 58, 90, 0.08);
  --color-footer-bg: #5faeb8;
  --color-footer-bg-dark: #4d9ba7;
  --color-footer-text: rgba(255, 255, 255, 0.96);
  --color-footer-muted: rgba(255, 255, 255, 0.72);
  --color-footer-rule: rgba(255, 255, 255, 0.38);

  --container: 1200px;
  --container-wide: 1440px;

  --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;

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 24px 60px rgba(20, 58, 90, 0.14);

  /* BUTTONS */
  --button-radius: var(--radius-sm);
  --button-font-weight: 700;
  --button-transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;

  /* Sizes */
  --button-height-sm: 2.75rem;
  --button-height-md: 3.25rem;
  --button-height-lg: 3.5rem;

  --button-padding-x-sm: 1rem;
  --button-padding-x-md: 1.25rem;
  --button-padding-x-lg: 1.5rem;

  --button-font-size-sm: 1rem;
  --button-font-size-md: 1.0625rem;
  --button-font-size-lg: 1.125rem;

  /* Variants */
  --button-primary-bg: var(--color-secondary);
  --button-primary-bg-hover: #6e9857;
  --button-primary-text: var(--color-white);
  --button-primary-border: transparent;
  --button-primary-shadow: 0 6px 18px rgba(123, 167, 96, 0.18);

  --button-secondary-bg: #d7e6f1;
  --button-secondary-bg-hover: #c7dced;
  --button-secondary-text: var(--color-text);
  --button-secondary-border: rgba(20, 58, 90, 0.08);
  --button-secondary-shadow: none;

  --button-outline-bg: transparent;
  --button-outline-bg-hover: rgba(94, 152, 202, 0.08);
  --button-outline-text: var(--color-primary);
  --button-outline-border: var(--color-primary);
  --button-outline-shadow: none;

}