@tailwind base;
@tailwind components;
@tailwind utilities;

/* Fonts are loaded via <link rel="preconnect"/"stylesheet"> in index.html.
   A CSS @import here was invalid (it must precede all other statements) and
   added a render-blocking request chain. */

html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  font-family: 'Inter', system-ui, sans-serif;
  background-color: #0b0d12;
}

h1, h2, h3, h4, .font-display {
  font-family: 'Space Grotesk', sans-serif;
}

::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #0b0d12;
}
::-webkit-scrollbar-thumb {
  background: #23283a;
  border-radius: 8px;
}

.gradient-text {
  background: linear-gradient(90deg, #6ee7b7, #818cf8);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.card-glow {
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.card-glow:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px -12px rgba(110, 231, 183, 0.25);
  border-color: rgba(110, 231, 183, 0.4);
}
