@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.product-card--anim-0 { animation: fadeInUp 0.6s ease 0s forwards; }
.product-card--anim-1 { animation: fadeInUp 0.6s ease 0.1s forwards; }
.product-card--anim-2 { animation: fadeInUp 0.6s ease 0.2s forwards; }
.product-card--anim-3 { animation: fadeInUp 0.6s ease 0.3s forwards; }
.product-card--anim-4 { animation: fadeInUp 0.6s ease 0.4s forwards; }
.product-card--anim-5 { animation: fadeInUp 0.6s ease 0.5s forwards; }
.product-card--anim-6 { animation: fadeInUp 0.6s ease 0.6s forwards; }
.product-card--anim-7 { animation: fadeInUp 0.6s ease 0.7s forwards; }
.product-card--anim-8 { animation: fadeInUp 0.6s ease 0.8s forwards; }
.product-card--anim-9 { animation: fadeInUp 0.6s ease 0.9s forwards; }
.product-card--anim-10 { animation: fadeInUp 0.6s ease 1s forwards; }
.product-card--anim-11 { animation: fadeInUp 0.6s ease 1.1s forwards; }
.product-card--anim-12 { animation: fadeInUp 0.6s ease 1.2s forwards; }
.product-card--anim-13 { animation: fadeInUp 0.6s ease 1.3s forwards; }
.product-card--anim-14 { animation: fadeInUp 0.6s ease 1.4s forwards; }
.product-card--anim-15 { animation: fadeInUp 0.6s ease 1.5s forwards; }
.product-card--anim-16 { animation: fadeInUp 0.6s ease 1.6s forwards; }
.product-card--anim-17 { animation: fadeInUp 0.6s ease 1.7s forwards; }

.fade-in-element {
  opacity: 0;
}

.loading-spinner {
  width: 50px;
  height: 50px;
  margin: 0 auto 20px;
  border: 4px solid #9b8860;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}