/* Fonts */
@font-face {
  font-family: 'Marcellus';
  src: url('../fonts/marcellus-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}
@font-face {
  font-family: 'Raleway';
  src: url('../fonts/raleway-var.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: optional;
}

:root {
  --amber: #ffb54a;
  --amber-dark: #d4841c;
  --deep: #0b0410;
  --mid: #1c0820;
  --plum: #34103a;
  --rose: #ff5f7e;
}

* { font-family: 'Raleway', system-ui, sans-serif; }
.font-display { font-family: 'Marcellus', Georgia, serif; }

body {
  background: linear-gradient(135deg, #0b0410 0%, #1c0820 40%, #2a0c2e 70%, #0e0a1c 100%);
  min-height: 100vh;
  color: #f6e9f4;
}

html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 88px; }

h1, h2, h3, h4, h5, h6, a { overflow-wrap: break-word; word-break: break-word; }
[hidden] { display: none !important; }
[x-cloak] { display: none !important; }

/* Nav: burger below 1220px */
.nav-desktop { display: none; }
.nav-burger { display: block; }
.nav-drop { display: flex; }
@media (min-width: 1220px) {
  .nav-desktop { display: flex; }
  .nav-burger { display: none; }
  .nav-drop { display: none !important; }
}

a, button, input[type="button"] {
  -webkit-tap-highlight-color: transparent;
}
nav a, footer a, button { user-select: none; -webkit-user-select: none; }

/* Stars background */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,0.6) 0%, transparent 100%),
    radial-gradient(1px 1px at 80% 10%, rgba(255,255,255,0.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 50% 60%, rgba(255,255,255,0.4) 0%, transparent 100%),
    radial-gradient(1px 1px at 10% 70%, rgba(255,255,255,0.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 90% 50%, rgba(255,255,255,0.4) 0%, transparent 100%),
    radial-gradient(1px 1px at 35% 85%, rgba(255,255,255,0.6) 0%, transparent 100%),
    radial-gradient(1px 1px at 65% 20%, rgba(255,255,255,0.5) 0%, transparent 100%),
    radial-gradient(2px 2px at 75% 75%, rgba(255,181,74,0.4) 0%, transparent 100%),
    radial-gradient(2px 2px at 25% 45%, rgba(255,95,126,0.3) 0%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}

.gold-gradient { background: linear-gradient(135deg, #ffb54a, #ff8f5c, #ffb54a); }
.gold-text { background: linear-gradient(135deg, #ffb54a, #ffd8a1, #e07a4a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.card-bg { background: rgba(255,255,255,0.04); backdrop-filter: blur(12px); border: 1px solid rgba(255,181,74,0.16); }
.nav-bg { background: rgba(11,4,16,0.92); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(255,181,74,0.2); }

.btn-gold {
  background: linear-gradient(135deg, #ffb54a, #d4841c);
  color: #0b0410;
  font-weight: 700;
  letter-spacing: 0.05em;
  transition: all 0.3s ease;
  box-shadow: 0 4px 20px rgba(255,181,74,0.3);
}
.btn-gold:hover {
  background: linear-gradient(135deg, #ffd08a, #ffb54a);
  box-shadow: 0 6px 30px rgba(255,181,74,0.5);
  transform: translateY(-2px);
}

.pulse-glow {
  animation: pulseGlow 2.5s ease-in-out infinite;
}
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(255,181,74,0.3); }
  50% { box-shadow: 0 0 40px rgba(255,181,74,0.6), 0 0 60px rgba(255,95,126,0.2); }
}

.float-anim {
  animation: floatAnim 4s ease-in-out infinite;
}
@keyframes floatAnim {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

.spin-slot {
  animation: spinSlot 0.4s ease-in-out infinite alternate;
}
@keyframes spinSlot {
  0% { transform: translateY(-4px); }
  100% { transform: translateY(4px); }
}

.page-enter { animation: pageEnter 0.5s ease forwards; }
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Slot machine reel visual */
.reel-glow {
  box-shadow: inset 0 0 30px rgba(255,181,74,0.2), 0 0 20px rgba(255,95,126,0.1);
}

/* Footer link hover */
.footer-link { transition: color 0.2s; }
.footer-link:hover { color: #ffb54a; }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0b0410; }
::-webkit-scrollbar-thumb { background: #ffb54a; border-radius: 3px; }

.divider-gold {
  height: 2px;
  background: linear-gradient(90deg, transparent, #ffb54a, transparent);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pulse-glow, .float-anim, .spin-slot, .page-enter { animation: none; }
}