@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    @apply font-inter bg-gray-50 text-gray-900 overflow-x-hidden;
  }
}

.feature-card {
  @apply transition-all duration-300 hover:-translate-y-1 hover:shadow-lg;
}
.feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px -5px rgba(168, 85, 247, 0.1);
}

#vanta-background {
    position: fixed;
    z-index: 0;
}

.hero {
    min-height: calc(100vh - 80px);
}

code {
    font-family: 'Fira Code', monospace;
}

@media (max-width: 768px) {
    .hero h1 {
        font-size: 2.5rem;
    }
}