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

:root {
  --font-base: 'Poppins', sans-serif;

  --color-bg: #080808;
  --color-bg-soft: #111111;
  --color-surface: rgba(255,255,255,0.03);
  --color-surface-strong: rgba(0,0,0,0.24);
  --color-border: rgba(255,215,0,0.10);
  --color-border-soft: rgba(255,215,0,0.05);
  --color-text: #ffffff;
  --color-text-soft: rgba(255,255,255,0.76);
  --color-text-muted: rgba(255,255,255,0.56);
  --color-black: #0b0b0b;
  --color-gold-1: #f5d66a;
  --color-gold-2: #b88a1c;
  --color-success: #4cd964;

  --gradient-page: radial-gradient(circle at center, #181818 0%, #080808 100%);
  --gradient-gold: linear-gradient(90deg, var(--color-gold-1), var(--color-gold-2));

  --shadow-sm: 0 10px 24px rgba(0,0,0,0.18);
  --shadow-md: 0 18px 50px rgba(0,0,0,0.28);
  --shadow-lg: 0 30px 90px rgba(0,0,0,0.55);
  --shadow-gold: 0 0 30px rgba(245,214,106,0.18);

  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 56px;
  --space-10: 72px;

  --container: 1180px;
  --header-height: 84px;

  --transition-fast: 0.18s ease;
  --transition-base: 0.28s ease;
  --transition-slow: 0.45s ease;
}