/* ============================================================
   JAMSHED AYAZ — Animations
   ============================================================ */

/* ── Hero Animations ── */
.hero-content .hero-urdu { animation: fadeUp 1.2s ease-out both; }
.hero-content .hero-en   { animation: fadeUp 1.2s ease-out 0.2s both; }
.hero-content .hero-tagline { animation: fadeUp 1.2s ease-out 0.4s both; }
.hero-content .hero-btns { animation: fadeUp 1.2s ease-out 0.6s both; }

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

/* ── Scroll Reveal ── */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-left {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal-left.visible { opacity: 1; transform: translateX(0); }
.reveal-right {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal-right.visible { opacity: 1; transform: translateX(0); }

/* Staggered children */
.reveal-group > *:nth-child(1) { transition-delay: 0s; }
.reveal-group > *:nth-child(2) { transition-delay: 0.1s; }
.reveal-group > *:nth-child(3) { transition-delay: 0.2s; }
.reveal-group > *:nth-child(4) { transition-delay: 0.3s; }

/* ── Gold Shimmer on Buttons ── */
@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.btn-shimmer {
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-light) 50%, var(--gold) 100%);
  background-size: 200% auto;
  animation: shimmer 2s linear infinite;
}

/* ── Counter Animation (JS-driven, class added) ── */
.counter-number {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 700;
  color: var(--gold);
  display: block;
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .reveal, .reveal-left, .reveal-right {
    transform: translateY(20px);
  }
}

/* ── Auto Scroll Animations ── */
.auto-anim {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.auto-anim.auto-visible {
  opacity: 1;
  transform: translateY(0);
}

.product-card.auto-anim {
  transform: translateY(40px) scale(0.97);
}
.product-card.auto-anim.auto-visible {
  transform: translateY(0) scale(1);
}

.cat-tile.auto-anim {
  transform: translateY(50px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.gallery-item.auto-anim {
  transform: scale(0.9);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.gallery-item.auto-anim.auto-visible {
  transform: scale(1);
}

.stat-item.auto-anim, .stat-box.auto-anim {
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.testimonial-card.auto-anim {
  transform: translateX(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.testimonial-card.auto-anim.auto-visible {
  transform: translateX(0);
}

h2.auto-anim {
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

/* Stagger delay for grid children */
.products-grid .product-card:nth-child(1) { transition-delay: 0s; }
.products-grid .product-card:nth-child(2) { transition-delay: 0.1s; }
.products-grid .product-card:nth-child(3) { transition-delay: 0.2s; }
.products-grid .product-card:nth-child(4) { transition-delay: 0.3s; }

.gallery-grid .gallery-item:nth-child(1) { transition-delay: 0s; }
.gallery-grid .gallery-item:nth-child(2) { transition-delay: 0.1s; }
.gallery-grid .gallery-item:nth-child(3) { transition-delay: 0.15s; }
.gallery-grid .gallery-item:nth-child(4) { transition-delay: 0.2s; }
.gallery-grid .gallery-item:nth-child(5) { transition-delay: 0.25s; }
.gallery-grid .gallery-item:nth-child(6) { transition-delay: 0.3s; }
