@import "tailwindcss";

@theme {
  --color-gold-50: #fffbeb;
  --color-gold-100: #fef3c7;
  --color-gold-200: #fde68a;
  --color-gold-300: #fcd34d;
  --color-gold-400: #fbbf24;
  --color-gold-500: #f59e0b;
  --color-gold-600: #d97706;
  --color-gold-700: #b45309;
  --color-black-900: #0a0a0a;
  --color-black-800: #141414;
  --color-black-700: #1f1f1f;
}

@layer base {
  body {
    @apply bg-black-900 text-gray-200 selection:bg-gold-500 selection:text-black-900 font-sans;
  }
}

.gold-gradient {
  background: linear-gradient(135deg, #d97706 0%, #fde68a 50%, #b45309 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gold-bg-gradient {
  background: linear-gradient(135deg, #b45309 0%, #d97706 100%);
}

.glass-morphism {
  background: rgba(31, 31, 31, 0.7);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(253, 230, 138, 0.1);
}

.scroll-smooth {
  scroll-behavior: smooth;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 0.8s ease-out forwards;
}

.card-hover {
  transition: all 0.3s ease;
}

.card-hover:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px -10px rgba(217, 119, 6, 0.3);
  border-color: rgba(217, 119, 6, 0.5);
}