@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,600&display=swap');

:root {
  --color-bg-primary: #ffffff; /* Pure white background */
  --color-bg-secondary: #f4f8f6; /* Soft green-tinted light background */
  --color-bg-deep: #ebf2ef; /* Darker green-tinted light background */
  --color-bg-black: #e2eae6; /* Slate green background block */

  --color-teal-dark: #004d40;
  --color-teal: #00796b;
  --color-cyan: #00796b;

  --color-green: #029a62; /* Rich embedded green for high contrast on white */
  --color-mint: #00796b;
  --color-green-soft: rgba(2, 154, 98, 0.08);

  --color-white: #ffffff;
  --color-text-primary: #0f211a; /* Deep forest slate for body text */
  --color-text-muted: #4e6057; /* Muted subtitle slate green */
  --color-text-dark: #ffffff; /* White text for green highlight elements */

  --color-border: rgba(2, 154, 98, 0.15);
  --color-border-light: rgba(0, 0, 0, 0.08);

  --color-glass: rgba(255, 255, 255, 0.78);
  --color-glass-strong: rgba(255, 255, 255, 0.94);

  --color-surface: rgba(255, 255, 255, 0.9);
  --color-surface-raised: linear-gradient(165deg, #ffffff 0%, #f4f8f6 100%);
  --color-surface-inset: linear-gradient(165deg, #f4f8f6 0%, #ebf2ef 100%);

  --shadow-green: 0 4px 20px rgba(2, 154, 98, 0.1);
  --shadow-dark: 0 10px 30px rgba(0, 0, 0, 0.04);

  --container-width: 1400px;
  --header-height: 84px;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --radius: 12px;
  --radius-lg: 20px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --duration: 0.45s;

  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-heading: 'Outfit', 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-display: 'Outfit', 'Plus Jakarta Sans', system-ui, sans-serif;
}