/* Global ayarlar: Yatay kaydırmayı kaldır ve dikey kaydırmayı gizle */
html, body {
  margin: 0; /* Varsayılan kenar boşluklarını kaldır */
  padding: 0; /* Varsayılan dolgu boşluklarını kaldır */
  width: 100%; /* Tam genişlik */
  height: 100%; /* Tam yükseklik */
}

/* Yatay scroll tamamen engellemek */
body {
  overflow-x: hidden;
  position: relative;
}

/* Scroll çubuğu görsel olarak tamamen kaldırılmak istenirse */
body::-webkit-scrollbar {
  display: none; /* WebKit tabanlı tarayıcılar için scrollbar gizle */
}

/* Resim geçişleri için yumuşak animasyon */
#current-slide {
  opacity: 1;
  transition: opacity 1s ease-in-out;
}

/* Ürünlerimiz başlık stili */
#product-list h2 {
  letter-spacing: 1px;
}


/* Hover efekti */
.product-card:hover {
  transform: scale(1.05);
  background-color: #ffffff; /* Beyaz kart */
  color: #000000; /* Siyah yazı */
}

/* Animasyon tamamlandıktan sonra görünür */
.product-card.loaded {
  opacity: 1;
  transform: translateY(0);
}

/* Yazı kısmı stil düzenlemeleri */
#slider-text {
  height: 2rem; /* Yazı alanının sabit yüksekliği */
  white-space: nowrap; /* Tek satırda kalması için */
  overflow: hidden; /* Taşan kısmı gizle */
  text-overflow: ellipsis; /* Gerekirse üç nokta ekle */
  display: flex; /* Esnek kutu modeli */
  justify-content: center; /* Yatayda ortala */
  align-items: center; /* Dikeyde ortala */
  font-size: 1.5rem; /* Yazı boyutu */
  line-height: 1; /* Satır yüksekliği */
  color: #ffffff; /* Yazı rengi */
  text-align: center; /* Ortalama */
}


/* Butonun içindeki aşağı işareti */
#discover-btn i {
  display: inline-block;
  animation: bounce 1s infinite; /* Animasyonu tanımla */
}
@keyframes bounce {
  0%, 100% {
      transform: translateY(0);
  }
  50% {
      transform: translateY(5px); /* Daha az hareket */
  }
}
/* ----------------------------------------------------- */


/* Hakkımızda Arka Planı */
#about-section {
    background: linear-gradient(to right, #fdfcfb, #e2d1c3);
}

/* Yıldızlar */
/* Slider Hareketi */
@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

.animate-scroll {
  animation: scroll 20s linear infinite;
}