/* Animações */
@keyframes scroll-horizontal {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%); /* Ajuste este valor se a quantidade de slides mudar */
  }
}

@keyframes portfolio-smooth-scroll {
  0% {
    object-position: center top;
  }
  50% {
    object-position: center center;
  }
  100% {
    object-position: center bottom;
  }
}

/* Estilos do Slider */
.slider-container {
  width: 100%;
  margin-bottom: 2rem; /* mb-8 */
  overflow: hidden;
}

.slider-track {
  display: flex;
  white-space: nowrap;
  animation: scroll-horizontal 30s linear infinite;
  /* A animação precisa de um tempo suficiente para não parecer repetitiva */
}

.slider-item {
  flex-shrink: 0;
  margin-left: 0.5rem; /* mx-2 */
  margin-right: 0.5rem; /* mx-2 */
}

.slider-image-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 0.5rem; /* rounded-lg */
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  height: 24rem; /* h-96 */
  width: 20rem; /* w-80 */
}

.slider-image {
  width: 100%;
  height: 150%;
  object-fit: cover;
  animation: portfolio-smooth-scroll 15s ease-in-out infinite;
}

.slider-gradient {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.2), transparent);
}