@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Source+Sans+3:wght@300;400;600;700&display=swap');

:root {
  --color-primary:     #014d00;
  --color-primary-mid: #1a6b1a;
  --color-accent:      #c8d400;
  --color-accent-dark: #a0ab00;
  --color-bg:          #fafaf7;
  --color-bg-alt:      #f0f0e8;
  --color-bg-dark:     #013200;
  --color-text:        #1c1f1a;
  --color-text-muted:  #4a4f47;
  --color-text-light:  #f0f0e8;
  --color-border:      #d8dbd0;
  --color-white:       #ffffff;

  --font-heading: 'Lora', Georgia, serif;
  --font-body:    'Source Sans 3', system-ui, sans-serif;

  --font-size-xs:   clamp(0.75rem, 0.7rem + 0.2vw, 0.875rem);
  --font-size-sm:   clamp(0.875rem, 0.83rem + 0.2vw, 1rem);
  --font-size-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --font-size-md:   clamp(1.125rem, 1.05rem + 0.35vw, 1.375rem);
  --font-size-lg:   clamp(1.375rem, 1.2rem + 0.8vw, 2rem);
  --font-size-xl:   clamp(1.875rem, 1.5rem + 1.5vw, 3rem);
  --font-size-2xl:  clamp(2.5rem, 1.8rem + 2.8vw, 4.5rem);

  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  2rem;
  --space-lg:  3.5rem;
  --space-xl:  6rem;
  --space-2xl: 10rem;

  --container-max:   1160px;
  --container-wide:  1400px;
  --container-narrow: 740px;

  --border-radius-sm: 3px;
  --border-radius:    6px;
  --border-radius-lg: 12px;

  --shadow-sm: 0 1px 3px rgba(1,77,0,0.08), 0 1px 2px rgba(1,77,0,0.06);
  --shadow:    0 4px 16px rgba(1,77,0,0.1), 0 2px 4px rgba(1,77,0,0.06);
  --shadow-lg: 0 16px 48px rgba(1,77,0,0.14);

  --transition: 200ms ease;
  --transition-slow: 400ms ease;

  --nav-height: 72px;
}
