/* === Default: Desktop First === */
.gaming-banner-section {
  background-image: url('https://terakitan.com/wp-content/themes/gluson-child/assets/images/gaming_banner/banner-bg.png');
  background-size: cover;
  background-position: center;
  aspect-ratio: 1920 / 886;
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #242424;
  background-repeat: no-repeat;
}

.gaming-banner-content {
  padding-top: 320px;
  width: 100%;
  max-width: 100%; /* Diubah agar bisa mengakomodasi padding nav */
}

.gaming-category-wrapper {
  /* Style display flex, justify, wrap, gap akan diatur oleh Owl Carousel, jadi bisa dihapus */
  /* display: flex; */
  /* justify-content: center; */
  /* flex-wrap: wrap; */
  /* gap: 40px; */
  /* Tambahkan style jika perlu, misal max-width */
  max-width: 1100px; /* Sesuaikan max-width container carousel jika perlu */
  margin: 0 auto; /* Pusatkan carousel container */
}

.gaming-category-item {
  width: 180px; /* Biarkan width agar item punya ukuran dasar */
  height: 180px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: transform 0.3s ease;
  /* background: rgba(255, 255, 255, 0.1); */ /* Debugging background */
}

.gaming-category-item:hover {
  transform: scale(1.05);
}

.gaming-category-item img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* === Mobile: max 768px === */
@media (max-width: 768px) {
  .gaming-banner-section {
    background-size: contain;
    background-position: top;
    padding-bottom: 230px;
    overflow: hidden;
  }

  .gaming-banner-content {
    padding-top: 360px;
  }

  .gaming-category-wrapper {
    /* background-color: red; */
    padding-left: 14px;
    /* padding-right: 16px; */
  }

  /* Sesuaikan ukuran item untuk mobile jika diperlukan */
  .gaming-category-item {
     /* Ukuran item mobile akan diatur oleh Owl Carousel (berdasarkan opsi 'items') */
     /* Jika ingin ukuran fix, atur width/height di sini, tapi pastikan cocok dengan 'items' */
     width: 100px; /* Biarkan owl yang atur atau set ukuran fix misal 100px */
     height: 100px;
     /* scroll-snap-align: center; */ /* Tidak perlu lagi */
  }
}