/* ==========================================================================
   QueryCraft — Animations
   ========================================================================== */

/* ---- Page load reveal (single orchestrated sequence, hero only) ---- */
.reveal {
  opacity: 0;
  transform: translateY(16px);
}
.reveal.is-in {
  animation: reveal-up var(--dur-slow) var(--ease) forwards;
}
@keyframes reveal-up {
  to { opacity: 1; transform: translateY(0); }
}

/* ---- Scroll-triggered fade for content sections ---- */
.observe-fade {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease);
}
.observe-fade.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .reveal, .observe-fade {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }
  .db-stack, .db-badge {
    animation: none !important;
  }
}

/* ---- Utility spin (used sparingly, e.g. loading state) ---- */
@keyframes spin {
  to { transform: rotate(360deg); }
}
.spin { animation: spin 0.8s linear infinite; }