@import "tailwindcss";

@theme {
  --color-primary: #FF6B00;
  --color-primary-dark: #E55D00;
  --color-primary-light: #FF8A33;
  --color-navy: #1B1B3A;
  --color-navy-light: #2A2A54;
  --color-surface: #F5F5F5;
  --color-success: #43A047;
  --color-error: #E53935;
  --color-warning: #FF9800;
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  color: #171717;
  background: #ffffff;
}

@keyframes fade-in-up {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes count-up {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

.animate-fade-in-up {
  animation: fade-in-up 0.6s ease-out both;
}

.animate-fade-in {
  animation: fade-in 0.5s ease-out both;
}

.animate-count-up {
  animation: count-up 0.4s ease-out both;
}

.animation-delay-100 { animation-delay: 0.1s; }
.animation-delay-200 { animation-delay: 0.2s; }
.animation-delay-300 { animation-delay: 0.3s; }
.animation-delay-400 { animation-delay: 0.4s; }
.animation-delay-500 { animation-delay: 0.5s; }
