/* Scoped additions from the site audit; existing game art and motion stay intact. */
.hero-copy .hero-category {
  max-width: 27ch;
  margin: 1rem 0 0.75rem;
  font-family: "Google Sans", sans-serif;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.25;
}
.hero-copy .hero-logo { margin-bottom: 1rem; }
.hero-copy .hero-subhead { max-width: 32ch; font-size: 1.25rem; }
.download-note, .final-cta .download-note { max-width: 42ch; margin: 0.85rem 0 0; color: var(--white); font-size: 0.9rem; line-height: 1.5; }
.download-note a, .hero-secondary a { text-underline-offset: 0.2em; }
.hero-secondary { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin-top: 0.8rem; }
.hero-secondary a { display: inline-flex; align-items: center; min-height: 44px; max-width: 42ch; font-size: 0.95rem; }
#gameplay-video, #duels, #faq { scroll-margin-top: 6rem; }
.section-copy-title { margin: 1.25rem 0 0.65rem; font: 700 1.2rem/1.3 "Google Sans", sans-serif; }
.updates-features h3 { font-size: 1.25rem; }
.final-cta .store-cta-title { max-width: none; font-size: 1.1rem; }
.section-intro { max-width: 60ch; color: var(--white); }
.player-review { position: relative; background: var(--ink); color: var(--white); padding: 2.75rem max(1rem, 5%); text-align: center; scroll-margin-top: 6rem; }
.player-review figure { max-width: 52rem; margin: 0 auto; }
.player-review-stars { display: flex; justify-content: center; align-items: center; gap: 0.5rem; margin-bottom: 1.25rem; }
.player-review-stars img { display: block; width: 3rem; height: 3rem; object-fit: contain; }
.player-review blockquote { margin: 0 auto 1rem; max-width: 48ch; }
.player-review blockquote p { margin: 0; color: var(--white); font: 500 1.35rem/1.6 "Google Sans", sans-serif; }
.player-review figcaption { margin: 0; color: var(--muted); font-size: 0.9rem; }
.player-review a { color: var(--white); text-decoration: underline; text-underline-offset: 0.2em; }
.player-review a:focus-visible { outline: 3px solid var(--amber); outline-offset: 4px; }
@media (max-width: 620px) {
  .player-review-stars img { width: 2.5rem; height: 2.5rem; }
  .player-review-stars { gap: 0.35rem; }
  .player-review blockquote p { font-size: 1.15rem; }
}
.faq-section { position: relative; background: var(--twilight); color: var(--white); padding: 4rem max(1rem, 5%); }
.faq-section :is(h2, summary, p, a) { color: var(--white); }
.faq-section h2 { margin: 0 auto 1.5rem; max-width: 52rem; font: 400 1.6rem/1.2 "Huggable", sans-serif; }
.faq-section details { max-width: 52rem; margin: 0 auto; border-top: 1px solid #ffffff40; }
.faq-section summary { padding: 1rem 0; cursor: pointer; font-weight: 700; min-height: 48px; }
.faq-section details p { max-width: 68ch; margin: 0 0 1.5rem; }
.faq-section a { text-decoration: underline; text-underline-offset: 0.2em; }
:where(.hero-secondary, .faq-section) a:focus-visible, .faq-section summary:focus-visible { outline: 3px solid var(--amber); outline-offset: 4px; }
@media (max-width: 620px) {
  .hero-section { grid-template-columns: minmax(0, 1fr); padding-top: 1.5rem; }
  .hero-copy { min-width: 0; }
  .hero-copy .hero-logo { width: min(100%, 20rem); margin: 0 auto 0.75rem; }
  .hero-copy .hero-category { font-size: 1.35rem; margin-top: 0.5rem; }
  .hero-copy .hero-subhead { font-size: 1.05rem; }
  .hero-copy .store-cta { margin-top: 1rem; }
  .hero-copy .hero-actions { flex-direction: row; flex-wrap: nowrap; gap: 0.5rem; }
  .hero-copy .store-badge { min-width: 0; flex: 1; padding: 0.45rem; gap: 0.4rem; font-size: 1rem; }
  .hero-copy .store-badge small { font-size: 0.62rem; }
  .hero-copy .store-badge img, .hero-copy .google-play-mark { width: 1.4rem; height: 1.6rem; flex-shrink: 0; }
  .nav-toggle { min-height: 44px; }
}
@media (max-width: 350px) {
  .hero-copy .store-badge { font-size: 0.9rem; padding-inline: 0.3rem; gap: 0.3rem; }
}