/* JUWASPINS — pearl white, cobalt and violet brand finish. */
:root {
  --ink: #16233d;
  --ink-soft: #52627e;
  --paper: #ffffff;
  --pearl: #f5f7ff;
  --mist: #e9efff;
  --cobalt: #315cff;
  --violet: #6b39d8;
  --sky: #36a9ff;
  --line: rgba(52, 82, 178, .17);
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at 8% 2%, rgba(90, 61, 224, .15), transparent 22rem),
    radial-gradient(circle at 94% 15%, rgba(54, 169, 255, .16), transparent 24rem),
    var(--pearl);
}

.site-header {
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 8px 28px rgba(32, 56, 130, .10);
}

.juwa-brand img {
  filter: drop-shadow(0 8px 10px rgba(49, 92, 255, .22));
}

.site-header .btn,
.signup-card .btn,
.cta .btn,
.auth-button {
  border-color: transparent;
  background: linear-gradient(135deg, var(--cobalt), var(--violet));
  color: #fff;
  box-shadow: 0 8px 18px rgba(65, 72, 198, .24);
}

.site-header .btn:hover,
.signup-card .btn:hover,
.cta .btn:hover,
.auth-button:hover {
  background: linear-gradient(135deg, #214bdb, #5426bd);
  box-shadow: 0 12px 25px rgba(65, 72, 198, .32);
}

.hero,
.intro,
.game-section,
.how-it-works,
.cta,
.footer {
  background-color: transparent;
}

.hero {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, .96), rgba(237, 242, 255, .92)),
    var(--pearl);
  border-bottom: 1px solid var(--line);
}

.hero:before {
  content: 'JUWASPINS · PLAY IN MOTION';
  color: var(--violet);
  text-shadow: 0 2px 12px rgba(107, 57, 216, .20);
}

.hero h1,
.intro h2,
.game-section h2,
.how-it-works h2,
.cta h2,
.featured-hot-games h2,
.top-game-marquee h2 {
  color: #18284a;
  text-shadow: none;
}

.hero p,
.intro p,
.game-section p,
.how-it-works p,
.cta p,
.footer,
.footer p {
  color: var(--ink-soft);
}

.trust-strip,
.hero-trust,
.marquee-track,
.top-game-marquee,
.featured-hot-games {
  background: #fff;
  border-color: var(--line);
  box-shadow: 0 10px 25px rgba(35, 58, 137, .08);
}

.trust-strip li,
.hero-trust li,
.benefit-card,
.game-card,
.game-tile,
.step,
.signup-card,
.top-game-card,
.hot-game-card {
  background: #fff;
  color: var(--ink);
  border-color: var(--line);
  box-shadow: 0 10px 24px rgba(35, 58, 137, .09);
}

.trust-strip li:before,
.hero-trust li:before,
.benefit-card:before {
  color: var(--sky);
  text-shadow: 0 0 10px rgba(54, 169, 255, .55);
}

.signup-card {
  background: linear-gradient(145deg, #fff, #eef3ff);
  border: 1px solid rgba(60, 85, 191, .24);
}

.signup-card h2,
.signup-card h3,
.signup-card label,
.signup-card strong,
.signup-card .price,
.signup-card .form-title {
  color: #1c2a4c;
}

.signup-card input,
.signup-card select,
.signup-card textarea {
  color: var(--ink);
  background: #fff;
  border-color: rgba(60, 85, 191, .28);
}

.signup-card input:focus,
.signup-card select:focus,
.signup-card textarea:focus {
  border-color: var(--cobalt);
  box-shadow: 0 0 0 3px rgba(49, 92, 255, .15);
}

.game-card:hover,
.game-tile:hover,
.top-game-card:hover,
.hot-game-card:hover,
.benefit-card:hover {
  border-color: rgba(49, 92, 255, .50);
  box-shadow: 0 16px 32px rgba(49, 92, 255, .16);
}

.game-card .tag,
.game-tile .tag,
.top-game-card .tag,
.hot-game-card .tag,
.eyebrow,
.kicker {
  background: linear-gradient(135deg, var(--cobalt), var(--violet));
  color: #fff;
}

.cta {
  background: linear-gradient(120deg, #eef2ff, #fbfcff 48%, #f2edff);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.footer {
  border-top-color: var(--line);
  background: #fff;
}

/* Contrast pass: keep every text layer readable over the pearl surfaces. */
.section-heading h2,
.alpha-play-copy h2,
.why-intro h2,
.social-promo-head h2,
.fund-banner h2,
.final-cta h2,
.reward-dock h2,
.reward-dock h3,
.game-card h3,
.benefits h3,
.footer-links h3 {
  color: #15294e;
}

.section-heading > p,
.alpha-play-copy > p,
.alpha-play-copy li,
.why-intro > p,
.benefits p,
.reward-dock p,
.reward-dock span,
.social-promo-head > p,
.game-card p,
.top-games-hint,
.footer-links a,
.site-footer p,
.fine-print p {
  color: #455a7c;
}

.alpha-play-section,
.reward-dock,
.reviews,
.social-promo,
.stories,
.why {
  background: transparent;
}

.alpha-play-copy,
.why-intro,
.section-heading,
.social-promo-head,
.reward-dock article,
.benefits article,
.review-card,
.promo-new,
.promo-daily,
.promo-community {
  border-color: var(--line);
}

.alpha-text-link,
.top-games-heading a,
.reward-dock a,
.social-promo a,
.footer-links a:hover {
  color: #254dc7;
  text-decoration-color: rgba(37, 77, 199, .45);
}

.eyebrow {
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(13, 27, 64, .20);
}

.hero-copy .eyebrow {
  color: #263e9d !important;
  background: transparent;
  text-shadow: none;
}

.mini-proof span {
  color: #263b63;
  background: rgba(255, 255, 255, .84);
  border-color: rgba(60, 85, 191, .22);
}

.hero-game-label span,
.hero-game-label a,
.hero-game-chip strong,
.hero-game-chip small,
.top-games-heading a,
.top-game-card strong,
.top-game-card small,
.hot-game-card strong,
.hot-game-card small {
  color: #1b3158;
}

.top-game-card,
.hot-game-card,
.hero-game-chip {
  background: #fff;
  border-color: rgba(60, 85, 191, .20);
}

.game-filters button,
.category-pills a {
  color: #314967;
  background: #fff;
  border-color: rgba(60, 85, 191, .24);
}

.game-filters button.active,
.category-pills a:hover {
  color: #fff;
  background: linear-gradient(135deg, var(--cobalt), var(--violet));
}

.signup-card small,
.signup-card .check span,
.signup-card input::placeholder {
  color: #506381;
  opacity: 1;
}

.login-dialog {
  color: #18294a;
  background: #fff;
  border-color: rgba(60, 85, 191, .28);
}

.login-dialog h2,
.login-dialog label,
.login-dialog p,
.login-dialog small,
.login-options button {
  color: #314866;
}

.login-dialog input {
  color: #18294a;
  background: #fff;
  border-color: rgba(60, 85, 191, .28);
}

/* Featured HOT GAMES remains on a white panel, so use ink instead of the inherited light lava text. */
.featured-hot-games {
  background: linear-gradient(110deg, #ffffff, #edf3ff 58%, #f6f1ff);
  border-color: rgba(60, 85, 191, .26);
}

.featured-hot-label strong {
  color: #172b52;
  text-shadow: none;
}

.featured-hot-label small {
  color: #455f86;
}

.featured-hot-games .top-game-tile.hot-game {
  background: #fff;
  border-color: rgba(60, 85, 191, .23);
}

.featured-hot-games .hot-game .top-game-copy strong {
  color: #1b3158;
}

.featured-hot-games .hot-game .top-game-copy small {
  color: #526987;
}

/* Scrolling JUWA game-logo tiles. */
.top-games-window .top-game-tile {
  background: #fff;
  border-color: rgba(60, 85, 191, .24);
  box-shadow: 0 10px 22px rgba(35, 58, 137, .10);
}

.top-games-window .top-game-tile:hover,
.top-games-window .top-game-tile:focus-visible {
  background: #f7f9ff;
  border-color: var(--cobalt);
}

.top-games-window .top-game-copy strong {
  color: #172e55;
}

.top-games-window .top-game-copy small {
  color: #506887;
}

@media (max-width: 720px) {
  .site-header { background: rgba(255, 255, 255, .98); }
}
