:root {
  --radius: 0.75rem;
  /* Dark green EV theme */
  --background: oklch(0.16 0.025 155);
  --foreground: oklch(0.98 0.005 150);
  --card: oklch(0.21 0.03 155);
  --card-foreground: oklch(0.98 0.005 150);
  --popover: oklch(0.21 0.03 155);
  --popover-foreground: oklch(0.98 0.005 150);
  --primary: oklch(0.8 0.22 148); /* EV green */
  --primary-foreground: oklch(0.14 0.03 155);
  --secondary: oklch(0.26 0.03 155);
  --secondary-foreground: oklch(0.98 0.005 150);
  --muted: oklch(0.24 0.025 155);
  --muted-foreground: oklch(0.72 0.02 150);
  --accent: oklch(0.85 0.22 145);
  --accent-foreground: oklch(0.14 0.03 155);
  --destructive: oklch(0.62 0.22 25);
  --destructive-foreground: oklch(0.98 0.005 150);
  --border: oklch(1 0 0 / 8%);
  --input: oklch(1 0 0 / 10%);
  --ring: oklch(0.8 0.22 148);

  --gradient-hero: radial-gradient(ellipse at 25% 25%, oklch(0.8 0.22 148 / 0.22), transparent 60%),
                   radial-gradient(ellipse at 80% 80%, oklch(0.8 0.22 148 / 0.16), transparent 60%);
  --gradient-primary: linear-gradient(135deg, oklch(0.85 0.22 145), oklch(0.72 0.2 155));
  --gradient-glow: radial-gradient(circle at 50% 50%, oklch(0.8 0.22 148 / 0.5), transparent 70%);
  --shadow-glow: 0 0 60px oklch(0.8 0.22 148 / 0.35);
  --shadow-elegant: 0 20px 60px -20px oklch(0 0 0 / 0.6);
  --glass-bg: oklch(1 0 0 / 0.04);
  --glass-border: oklch(1 0 0 / 0.1);
}

* {
  border-color: var(--border);
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: 'Space Grotesk', system-ui, -apple-system, sans-serif;
  letter-spacing: -0.02em;
}

.glass {
  background: var(--glass-bg);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--glass-border);
}

.text-gradient {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.glow {
  box-shadow: var(--shadow-glow);
}

.shadow-elegant {
  box-shadow: var(--shadow-elegant);
}

@keyframes float-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 oklch(0.78 0.21 150 / 0.6);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 16px oklch(0.78 0.21 150 / 0);
  }
}

.animate-float-pulse {
  animation: float-pulse 2s ease-in-out infinite;
}

/* Custom CSS to map Lucide elements & clean animations */
.animate-fade-in {
  animation: fadeIn 0.3s ease-out forwards;
}

@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}
