/*
 * 结构差异化覆盖层
 * 修改本文件即可换主题，不需要改原页面中的大段内联 CSS。
 */
:root {
  --primary: #8b5cf6 !important;
  --secondary: #f59e0b !important;
  --bg-dark: #11132b !important;
  --bg-darker: #080b18 !important;
  --card-bg: #171a35 !important;
  --card-border: #343967 !important;
  --text-light: #f4f4ff !important;
  --text-muted: #a9aecf !important;
}

body {
  font-family: "Poppins", "Hind Siliguri", sans-serif !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(139, 92, 246, .16), transparent 30%),
    radial-gradient(circle at 88% 24%, rgba(245, 158, 11, .10), transparent 28%),
    var(--bg-darker) !important;
}

.navbar {
  background: rgba(8, 11, 24, .92) !important;
  border-bottom: 0 !important;
  box-shadow: 0 10px 35px rgba(0, 0, 0, .28);
  backdrop-filter: blur(14px);
}

.hero-section {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, .12), transparent 48%),
    linear-gradient(315deg, rgba(245, 158, 11, .08), transparent 42%) !important;
}

.hero-section > .container > .row {
  flex-direction: row-reverse;
}

.hero-section h1 {
  letter-spacing: -.04em;
  line-height: 1.12 !important;
}

.btn-register,
.btn-hero-primary,
.btn-price-solid,
.cta-button {
  border-radius: 14px !important;
  background: linear-gradient(135deg, var(--primary), var(--secondary)) !important;
  box-shadow: 0 12px 28px rgba(139, 92, 246, .25) !important;
}

.btn-hero-outline,
.btn-price-outline {
  border-radius: 14px !important;
}

.advantage-card,
.game-card,
.price-card,
.testimonial-card,
.faq-item,
.feature-card,
.step-card,
.content-card,
.card {
  border-radius: 22px !important;
  border-color: rgba(139, 92, 246, .28) !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .20);
}

.section-divider {
  width: 86px !important;
  height: 5px !important;
  border-radius: 999px !important;
}

footer,
.footer {
  border-top: 1px solid rgba(139, 92, 246, .25) !important;
}

@media (max-width: 991.98px) {
  .hero-section > .container > .row {
    flex-direction: column;
  }
}