/* ==========================================================================
   B9 GAME — playb9.pk
   pages/home.css — index.html only
   ========================================================================== */

/* --- Hero copy tuning ---------------------------------------------------- */
.hero__title {
  position: relative;
}

.hero__title em::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.12em;
  width: 100%;
  height: 1px;
  background: var(--grad-gold-foil);
  opacity: 0;
}

/* --- Stat strip: soften the divider on the wrapped mobile grid ----------- */
@media (max-width: 767px) {
  .stat-grid .stat:nth-child(odd)::before { display: none; }

  .stat-grid .stat:nth-child(even)::before {
    content: "";
    position: absolute;
    left: 0;
    top: 12%;
    bottom: 12%;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--color-border-strong), transparent);
  }
}

/* --- OG showcase: keep the caption bar readable on very small screens ---- */
@media (max-width: 479px) {
  .og-showcase__bar { padding: var(--sp-4); }
  .og-showcase::after { inset: 7px; }
}

/* --- Featured games: 2-up on the smallest phones stays comfortable ------- */
@media (max-width: 400px) {
  .games-grid { gap: var(--sp-3); }
  .game-card__body { padding: var(--sp-2) var(--sp-2) var(--sp-3); }
}

/* --- Promo banner: give the amount a foil under-shadow ------------------- */
.promo-banner__amount {
  position: relative;
  display: inline-block;
}

.promo-banner__amount::after {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -0.16em;
  height: 1px;
  background: var(--grad-gold-foil);
  opacity: 0.75;
}

/* --- Slot guide feature cards use a text badge instead of a numeral ------ */
#slot-guide .feature-card__index {
  font-family: var(--font-body);
  font-size: 1.5rem;
  font-weight: var(--fw-black);
  letter-spacing: 0.1em;
  color: rgba(201, 162, 75, 0.24);
}

#slot-guide .feature-card { padding-top: var(--sp-7); }

/* --- Topic cloud: centre it under the centred heading -------------------- */
.topic-cloud { justify-content: center; }

/* --- Responsible gaming: emerald accents stay muted ---------------------- */
#responsible-gaming .section-head { max-width: 74ch; }

/* --- Screenshot section: pull the slider a little tighter on desktop ----- */
@media (min-width: 1200px) {
  .shot { width: 262px; }
}

/* --- App/spec split: stack the callout under the table cleanly ----------- */
@media (min-width: 768px) {
  #b9-app .split { align-items: start; }
}
