.fade-in {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in.visivel {
  opacity: 1;
  transform: translateY(0);
}

.produto {
  /* Estado inicial (invisível) */
  opacity: 0.5;
  transform: translateY(15px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
  scroll-snap-align: start;
}

.produto.visivel {
  opacity: 1;
  transform: translateY(0);
}