@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=Noto+Sans+SC:wght@300;400;700&display=swap');
@import "tailwindcss";

@theme {
  --font-display: "Cinzel", serif;
  --font-sans: "Noto Sans SC", sans-serif;
  
  --color-gold: #D4AF37;
  --color-gold-light: #F1E5AC;
  --color-dark: #0A0A0A;
  --color-dark-light: #1A1A1A;
}

@layer base {
  body {
    @apply bg-dark text-white font-sans selection:bg-gold selection:text-dark;
    scroll-behavior: smooth;
  }
}

@layer components {
  .nav-link {
    @apply text-gray-400 hover:text-gold transition-all duration-300 font-bold text-sm uppercase tracking-widest;
  }
  
  .btn-gold {
    @apply bg-gold text-dark px-8 py-3 rounded-sm font-bold hover:bg-gold-light transition-all duration-300 uppercase tracking-widest text-xs;
  }

  .btn-outline {
    @apply border border-gold text-gold px-8 py-3 rounded-sm font-bold hover:bg-gold hover:text-dark transition-all duration-300 uppercase tracking-widest text-xs;
  }

  .glass-card {
    @apply bg-dark-light/80 backdrop-blur-md border border-white/5 rounded-lg overflow-hidden hover:border-gold/30 transition-all duration-500;
  }

  .reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .reveal.active {
    opacity: 1;
    transform: translateY(0);
  }

  .section-title {
    @apply text-3xl md:text-5xl font-display font-bold text-gold mb-8 relative inline-block;
  }

  .section-title::after {
    content: '';
    @apply absolute -bottom-2 left-0 w-20 h-1 bg-gold;
  }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #0A0A0A;
}
::-webkit-scrollbar-thumb {
  background: #1A1A1A;
  border: 2px solid #0A0A0A;
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
  background: #D4AF37;
}

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

.gold-glow {
  text-shadow: 0 0 15px rgba(212, 175, 55, 0.5);
}