@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700;900&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap');
@import "tailwindcss";

@theme {
  --font-sans: "Noto Sans SC", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "Playfair Display", serif;
  --color-gold-50: #fffaf0;
  --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-gold-800: #92400e;
  --color-gold-900: #78350f;
}

@layer base {
  html {
    scroll-behavior: smooth;
  }
  body {
    @apply bg-white text-slate-900 font-sans overflow-x-hidden;
  }
}

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

.gold-text-gradient {
  @apply bg-clip-text text-transparent;
  background-image: linear-gradient(135deg, #d97706 0%, #b45309 100%);
}

.card-hover {
  @apply transition-all duration-500 hover:shadow-[0_20px_50px_rgba(180,83,9,0.15)] hover:-translate-y-2;
}

.glass-nav {
  @apply bg-white/80 backdrop-blur-xl border-b border-gold-100/50;
}

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

.animate-fade-up {
  animation: fadeInUp 0.8s ease-out forwards;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  @apply bg-slate-50;
}
::-webkit-scrollbar-thumb {
  @apply bg-gold-400 rounded-full hover:bg-gold-600 transition-colors;
}

.movie-overlay {
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);
}

.floating {
  animation: floating 3s ease-in-out infinite;
}

@keyframes floating {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}