/* ============================================================
   AI SpeedForce, Effects
   Subtle, premium motion only: fade-up on scroll, gentle floating
   glows, slow gradient movement. All disabled for reduced motion.
   ============================================================ */

/* ---------- Keyframes ---------- */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-16px); }
}
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes driftParticles {
  from { background-position: 0 0, 0 0, 0 0; }
  to   { background-position: 220px 140px, -180px 120px, 140px -160px; }
}

/* ---------- Scroll reveal (added by anim.js) ---------- */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .6s ease, transform .6s ease;
  will-change: opacity, transform;
}
.reveal.is-visible { opacity: 1; transform: none; }
/* Gentle stagger for grids of cards */
.reveal--d1 { transition-delay: .06s; }
.reveal--d2 { transition-delay: .12s; }
.reveal--d3 { transition-delay: .18s; }

/* ---------- Gentle gradient motion on the primary CTA band ---------- */
.cta-band {
  background-size: 180% 180%;
  animation: gradientShift 14s ease infinite;
}

/* ---------- Very subtle floating AI particles on dark sections ---------- */
.section--night::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    radial-gradient(rgba(217,70,239,.5) 1px, transparent 1.6px),
    radial-gradient(rgba(255,122,24,.35) 1px, transparent 1.6px),
    radial-gradient(rgba(255,255,255,.35) 1px, transparent 1.6px);
  background-size: 180px 180px, 240px 240px, 300px 300px;
  background-position: 0 0, 40px 60px, 90px 20px;
  opacity: .5;
  animation: driftParticles 40s linear infinite;
}
.section--night > .container { position: relative; z-index: 1; }

/* ---------- Respect user motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .hero::before, .hero::after,
  .cta-band, .section--night::after { animation: none; }
}