@import "tailwindcss";

@theme {
  --font-display: "Bricolage Grotesque", sans-serif;
  --font-sans: "Outfit", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
}

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

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes dash-flow {
  to { stroke-dashoffset: -18; }
}

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

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

.animate-dash {
  animation: dash-flow 1.5s linear infinite;
}

.anim-delay-100 { animation-delay: 100ms; }
.anim-delay-200 { animation-delay: 200ms; }
.anim-delay-300 { animation-delay: 300ms; }
.anim-delay-500 { animation-delay: 500ms; }
.anim-delay-700 { animation-delay: 700ms; }

.feature-card {
  transition: border-color 0.3s, box-shadow 0.3s;
}
.feature-card:hover {
  border-color: rgba(59, 130, 246, 0.3);
  box-shadow: 0 0 30px rgba(37, 99, 235, 0.08);
}

@media (prefers-reduced-motion: reduce) {
  .animate-fade-in-up { animation: none; opacity: 1; }
  .animate-float { animation: none; }
  .animate-dash { animation: none; }
}