/* Theme: Eco-Premium Clean
   Solarify — light body, dark hero, vibrant green accent
*/
:root {
  --bg-primary: #f8faf9;
  --bg-primary-rgb: 248, 250, 249;
  --bg-secondary: #ffffff;
  --bg-card: #ffffff;
  --bg-footer: #0b1a0f;
  --bg-dark: #0b1a0f;
  --bg-dark-mid: #122318;
  --text-primary: #0f1f15;
  --text-secondary: #3d5a47;
  --text-muted: #6b8574;
  --text-on-dark: #e8f5ec;
  --text-on-dark-muted: #8aac96;
  --accent: #16a34a;
  --accent-hover: #15803d;
  --accent-rgb: 22, 163, 74;
  --accent-light: #bbf7d0;
  --accent-light-rgb: 187, 247, 208;
  --border: rgba(15, 31, 21, 0.08);
  --border-on-dark: rgba(255, 255, 255, 0.1);
  --font-display: 'Outfit', -apple-system, Segoe UI, sans-serif;
  --font-body: 'Plus Jakarta Sans', -apple-system, Segoe UI, sans-serif;
  --gradient-hero: linear-gradient(160deg, #0b1a0f 0%, #122318 40%, #1a3524 70%, #0b1a0f 100%);
  --gradient-accent: linear-gradient(135deg, #16a34a, #22d3ee);
  --gradient-card: linear-gradient(135deg, rgba(var(--accent-rgb), 0.02), rgba(34, 211, 238, 0.02));
  --shadow-accent: 0 4px 24px rgba(var(--accent-rgb), 0.2);
  --shadow-card: 0 1px 3px rgba(15, 31, 21, 0.04), 0 8px 24px rgba(15, 31, 21, 0.06);
  --shadow-card-hover: 0 8px 40px rgba(var(--accent-rgb), 0.1), 0 2px 8px rgba(15, 31, 21, 0.08);
  --noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
}