@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
  --radius: 1.25rem;
  --background: oklch(0.985 0.005 240);
  --foreground: oklch(0.17 0.06 255);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.17 0.06 255);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.17 0.06 255);
  --primary: oklch(0.28 0.13 258);
  --primary-foreground: oklch(0.98 0.01 240);
  --primary-glow: oklch(0.62 0.17 248);
  --secondary: oklch(0.955 0.018 245);
  --secondary-foreground: oklch(0.22 0.09 258);
  --muted: oklch(0.955 0.015 245);
  --muted-foreground: oklch(0.48 0.04 252);
  --accent: oklch(0.55 0.16 248);
  --accent-foreground: oklch(0.98 0.01 240);
  --gold: oklch(0.82 0.13 86);
  --destructive: oklch(0.6 0.22 25);
  --destructive-foreground: oklch(0.98 0 0);
  --border: oklch(0.91 0.018 245);
  --input: oklch(0.93 0.02 245);
  --ring: oklch(0.55 0.15 250);

  --gradient-hero: linear-gradient(135deg, oklch(0.18 0.09 258 / 0.92), oklch(0.3 0.13 252 / 0.7) 50%, oklch(0.42 0.16 245 / 0.55));
  --gradient-primary: linear-gradient(135deg, oklch(0.28 0.13 258), oklch(0.5 0.18 248));
  --gradient-cta: linear-gradient(120deg, oklch(0.22 0.11 258), oklch(0.4 0.17 252), oklch(0.55 0.16 240));
  --shadow-soft: 0 12px 40px -12px oklch(0.28 0.13 258 / 0.28);
  --shadow-glass: 0 10px 36px oklch(0.18 0.09 258 / 0.18);
  --glass-bg: oklch(1 0 0 / 0.7);
  --glass-border: oklch(1 0 0 / 0.45);
}

.dark {
  --background: oklch(0.15 0.04 255);
  --foreground: oklch(0.98 0.01 240);
  --card: oklch(0.2 0.05 255);
  --card-foreground: oklch(0.98 0.01 240);
  --primary: oklch(0.6 0.18 245);
  --primary-foreground: oklch(0.15 0.04 255);
  --glass-bg: oklch(0.2 0.05 255 / 0.6);
  --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: 'Poppins', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.glass {
  background: var(--glass-bg);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid var(--glass-border);
  box-shadow: var(--shadow-glass);
}
.glass-dark {
  background: oklch(0.2 0.08 255 / 0.45);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid oklch(1 0 0 / 0.15);
}
.gradient-primary { background: var(--gradient-primary); }
.gradient-cta { background: var(--gradient-cta); }
.shadow-soft { box-shadow: var(--shadow-soft); }
.text-gold { color: var(--gold); }

@keyframes fade-up {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes hero-in {
  from { opacity: 0; transform: scale(1.04); }
  to { opacity: 1; transform: scale(1); }
}
.animate-fade-up { animation: fade-up 0.9s cubic-bezier(0.22,1,0.36,1) both; }
.animate-fade-up-delay-1 { animation: fade-up 0.9s cubic-bezier(0.22,1,0.36,1) 0.15s both; }
.animate-fade-up-delay-2 { animation: fade-up 0.9s cubic-bezier(0.22,1,0.36,1) 0.3s both; }
.animate-fade-up-delay-3 { animation: fade-up 0.9s cubic-bezier(0.22,1,0.36,1) 0.45s both; }
.animate-hero-in { animation: hero-in 1.4s cubic-bezier(0.22,1,0.36,1) both; }

@keyframes tab-fade-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-tab { animation: tab-fade-in 0.55s cubic-bezier(0.22,1,0.36,1) both; }

.hover-lift {
  transition: transform 0.5s cubic-bezier(0.22,1,0.36,1), box-shadow 0.5s cubic-bezier(0.22,1,0.36,1);
}
.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 50px -18px oklch(0.5 0.17 248 / 0.35);
}

[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.9s cubic-bezier(0.22,1,0.36,1), transform 0.9s cubic-bezier(0.22,1,0.36,1);
  will-change: opacity, transform;
}
[data-reveal].is-revealed { opacity: 1; transform: translateY(0); }
[data-reveal-delay="1"] { transition-delay: 0.08s; }
[data-reveal-delay="2"] { transition-delay: 0.16s; }
[data-reveal-delay="3"] { transition-delay: 0.24s; }
[data-reveal-delay="4"] { transition-delay: 0.32s; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
