/* Dedicated final stylesheet for /games hero only. Loaded after main.css. */
.page-games { overflow-x: hidden !important; }
.page-games .games-hero {
  padding: 32px 0 62px !important;
  overflow: hidden !important;
  border-bottom: 1px solid var(--line) !important;
}
.page-games .games-hero .games-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 520px) !important;
  gap: clamp(36px, 5vw, 72px) !important;
  align-items: center !important;
  width: min(calc(100% - 48px), var(--container)) !important;
  margin-inline: auto !important;
}
.page-games .games-hero-grid > * { min-width: 0 !important; }
.page-games .games-hero-copy {
  display: block !important;
  max-width: 700px !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
.page-games .games-hero-copy .kicker {
  margin: 0 0 16px !important;
}
.page-games .games-hero-copy h1 {
  max-width: 640px !important;
  margin: 0 0 22px !important;
  font-size: clamp(3rem, 4.7vw, 4.65rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -.042em !important;
}
.page-games .games-hero-intro {
  max-width: 650px !important;
  margin: 0 !important;
  font-size: 1.08rem !important;
  line-height: 1.62 !important;
}
.page-games .games-hero-actions {
  margin-top: 28px !important;
}
.page-games .games-hero-visual {
  width: 100% !important;
  max-width: 520px !important;
  justify-self: end !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
.page-games .games-hero-art {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 10 !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  background: #0a0f16 !important;
  box-shadow: 0 18px 42px rgba(15,28,43,.08) !important;
  text-decoration: none !important;
}
.page-games .games-hero-art > img:not(.games-hero-art-logo) {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center !important;
  transition: transform .28s ease !important;
}
.page-games .games-hero-art:hover > img:not(.games-hero-art-logo) { transform: scale(1.015) !important; }
.page-games .games-hero-art::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(3,8,15,.08) 35%, rgba(3,8,15,.62) 100%);
  pointer-events: none;
}
.page-games .games-hero-art-topline,
.page-games .games-hero-art-footer {
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  color: #fff !important;
}
.page-games .games-hero-art-topline {
  top: 14px !important;
  font-size: .76rem !important;
  font-weight: 650 !important;
  letter-spacing: .02em !important;
}
.page-games .games-hero-art-footer {
  bottom: 14px !important;
  font-size: .84rem !important;
  font-weight: 650 !important;
}
.page-games .games-hero-art-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 150px !important;
  max-height: 52px !important;
  object-fit: contain !important;
}
.page-games .games-hero-art-empty {
  display: grid !important;
  place-items: center !important;
  min-height: 320px !important;
  color: rgba(255,255,255,.7) !important;
  font-weight: 600 !important;
}
@media (max-width: 1050px) {
  .page-games .games-hero .games-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }
  .page-games .games-hero-copy,
  .page-games .games-hero-visual { max-width: 720px !important; justify-self: start !important; }
}
@media (max-width: 680px) {
  .page-games .games-hero { padding: 24px 0 44px !important; }
  .page-games .games-hero .games-hero-grid { width: min(calc(100% - 32px), var(--container)) !important; gap: 24px !important; }
  .page-games .games-hero-copy h1 { font-size: clamp(2.35rem, 11vw, 3.25rem) !important; line-height: 1.06 !important; }
  .page-games .games-hero-intro { font-size: 1rem !important; }
  .page-games .games-hero-art { border-radius: 14px !important; }
  .page-games .games-hero-art-logo { max-width: 120px !important; max-height: 42px !important; }
}

/* Branded no-art fallback: keeps real game identity visible until key art is uploaded. */
.page-games .games-hero-art-empty {
  align-content: center !important;
  justify-items: start !important;
  gap: 8px !important;
  padding: clamp(28px, 5vw, 52px) !important;
  background:
    radial-gradient(circle at 82% 18%, rgba(62, 101, 147, .32), transparent 34%),
    linear-gradient(145deg, #0a1728, #173252) !important;
}
.page-games .games-hero-art-empty > span,
.page-games .games-hero-art-empty > small {
  color: rgba(255,255,255,.68) !important;
  font-size: .75rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.page-games .games-hero-art-empty > strong {
  max-width: 12ch;
  color: #fff;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1;
  letter-spacing: -.045em;
}