/**
 * games-slider.css
 */
.games-slider {
  /* margin (не padding), щоб коректно схлопуватись із сусідніми блоками та власним h2 —
     інакше відступ подвоюється (той самий баг, що і в .section). */
  margin-block: var(--space-section);
}

.games-slider__viewport {
  position: relative;
}

.games-slider__swiper {
  padding-block: 0.5rem;
}

.games-slider__slide {
  width: 11rem;
  height: auto;
}

.game-card {
  background: var(--color-card-bg);
  padding: 0.85rem;
  clip-path: var(--shape-cut);
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.game-card__image {
  width: 100%;
  height: auto; /* без цього HTML-атрибути width/height на <img> "перемагають" aspect-ratio */
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: var(--color-bg-dark);
}

.game-card__name {
  color: var(--color-white);
  font-weight: var(--fw-medium);
  font-size: 0.9rem;
  min-height: 2.6em;
}

.game-card__btn {
  width: 100%;
  padding: 0.6rem 1rem;
  font-size: 0.8rem;
}

.games-slider__nav {
  color: var(--color-heading);
}

.games-slider__nav::after {
  font-size: 1.1rem;
}

@media (max-width: 767.98px) {
  .games-slider__nav {
    display: none;
  }
}