/* ==========================================================================
   DIGITAL STRONG — animations.css
   ========================================================================== */

/* Scroll reveal */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-reveal].is-revealed { opacity: 1; transform: translateY(0); }
[data-reveal="fade"] { transform: none; }
[data-reveal-group] > * { transition-delay: calc(var(--reveal-i, 0) * 90ms); }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* Hero glow / orbit */
@keyframes slow-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
@keyframes slow-rotate-rev {
  from { transform: rotate(0deg); }
  to { transform: rotate(-360deg); }
}
@keyframes pulse-glow {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}
@keyframes float-y {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.hero-orbit { animation: slow-rotate 60s linear infinite; transform-origin: center; }
.hero-orbit-rev { animation: slow-rotate-rev 80s linear infinite; transform-origin: center; }
.hero-glow { animation: pulse-glow 5s ease-in-out infinite; }
.hero-particle { animation: float-y 6s ease-in-out infinite; }
.hero-particle:nth-child(2) { animation-delay: 1.2s; }
.hero-particle:nth-child(3) { animation-delay: 2.4s; }

@media (prefers-reduced-motion: reduce) {
  .hero-orbit, .hero-orbit-rev, .hero-glow, .hero-particle { animation: none; }
}

/* Loading spinner (form) */
@keyframes spin { to { transform: rotate(360deg); } }
.spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(3,12,27,0.2);
  border-top-color: var(--navy-900);
  border-radius: 50%;
  display: inline-block;
  animation: spin 0.7s linear infinite;
}

/* Fade-in for page transitions (progressive enhancement) */
body { animation: page-fade-in 0.5s ease; }
@keyframes page-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  body { animation: none; }
}
