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

@layer utilities {
  .glass {
    background-color: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    border-radius: 9999px; /* Pill shape for navbar / small elements */
  }
  .glass-card {
    background-color: rgba(21, 21, 21, 0.6);
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    border-radius: 2rem; /* Heavy rounded rectangle for cards */
  }
  .text-glow {
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.4);
  }
  .gradient-text {
    background-image: linear-gradient(to right, #60a5fa, #818cf8, #c084fc);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
}

:root {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color-scheme: dark;
}

body {
  margin: 0;
  padding: 0;
  color: #ededed !important;
  background-color: #090e17 !important;
  background-image: 
    radial-gradient(circle at 15% 50%, rgba(20, 40, 90, 0.4), transparent 30%),
    radial-gradient(circle at 85% 30%, rgba(15, 30, 80, 0.3), transparent 30%) !important;
  background-attachment: fixed;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100vh;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #333;
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
  background: #555;
}