/* ==========================================================================
   SATGOLD TECHNOL — ANIMATIONS
   Scroll reveals, hover motion, counters, marquee, mobile menu.
   Respects prefers-reduced-motion (see base reset in style.css).
   ========================================================================== */

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.float-card { animation: floatY 5s ease-in-out infinite; }
.card-growth { animation-delay: 0.6s; }
.card-design { animation-delay: 1.2s; }

@keyframes spinSlow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.hero-shape-dots { animation: spinSlow 40s linear infinite; }

/* Scroll reveal (JS toggles .in-view on intersect) */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.in-view { opacity: 1; transform: translateY(0); }

.reveal-stagger > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal-stagger.in-view > * { opacity: 1; transform: translateY(0); }
.reveal-stagger.in-view > *:nth-child(1) { transition-delay: 0.05s; }
.reveal-stagger.in-view > *:nth-child(2) { transition-delay: 0.15s; }
.reveal-stagger.in-view > *:nth-child(3) { transition-delay: 0.25s; }
.reveal-stagger.in-view > *:nth-child(4) { transition-delay: 0.35s; }
.reveal-stagger.in-view > *:nth-child(5) { transition-delay: 0.45s; }
.reveal-stagger.in-view > *:nth-child(6) { transition-delay: 0.55s; }
.reveal-stagger.in-view > *:nth-child(7) { transition-delay: 0.65s; }
.reveal-stagger.in-view > *:nth-child(8) { transition-delay: 0.75s; }

.reveal-scale {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal-scale.in-view { opacity: 1; transform: scale(1); }

@media (prefers-reduced-motion: reduce) {
  .float-card, .hero-shape-dots, .strip-track { animation: none !important; }
  .reveal, .reveal-stagger > *, .reveal-scale {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Mobile menu slide */
.mobile-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.mobile-panel.is-open { max-height: 480px; display: flex; }

/* Portfolio filter transitions */
.portfolio-card {
  transition: transform 0.35s ease, box-shadow 0.35s ease, opacity 0.3s ease;
}
.portfolio-card.is-hidden {
  display: none;
}

/* Button micro press */
.btn:active { transform: translateY(0) scale(0.98); }

/* Ad popup entrance */
.ad-box {
  transform: scale(0.92);
  opacity: 0;
  transition: transform 0.35s ease, opacity 0.35s ease;
}
.ad-overlay.is-visible .ad-box {
  transform: scale(1);
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .promo-track { transition: none !important; }
  .ad-box { transition: none !important; transform: none !important; opacity: 1 !important; }
}