/* ═══════════════════════════════════════════════════════
   SYNEX DIGITAL — Animations
═══════════════════════════════════════════════════════ */

/* ── HERO TEXT ENTRANCE ─────────────────────────────── */
.hero-anim { opacity: 0; transform: translateY(28px); }
.hero-anim.go {
  animation: heroRise .75s ease forwards;
}
.hero-anim:nth-child(1) { animation-delay: .05s; }
.hero-anim:nth-child(2) { animation-delay: .18s; }
.hero-anim:nth-child(3) { animation-delay: .30s; }
.hero-anim:nth-child(4) { animation-delay: .42s; }
.hero-anim:nth-child(5) { animation-delay: .55s; }

@keyframes heroRise {
  to { opacity: 1; transform: translateY(0); }
}

/* Hero visual entrance */
.hero-visual {
  opacity: 0;
  animation: heroFadeIn 1s ease .8s forwards, floatUD 7s ease-in-out 1.8s infinite;
}
@keyframes heroFadeIn {
  to { opacity: 1; }
}

/* ── KEYFRAMES ──────────────────────────────────────── */
@keyframes floatUD {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-10px); }
}

@keyframes pulseRing {
  0%, 100% { box-shadow: 0 0 0 3px rgba(124,58,237,.35); }
  50%       { box-shadow: 0 0 0 6px rgba(124,58,237,.12); }
}

@keyframes shimmer {
  0%, 100% { background-position: 0% 50%; }
  50%       { background-position: 100% 50%; }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

@keyframes orb1 {
  0%, 100% { transform: translate(0,0) scale(1); }
  33%       { transform: translate(30px,-20px) scale(1.05); }
  66%       { transform: translate(-10px,15px) scale(0.97); }
}
@keyframes orb2 {
  0%, 100% { transform: translate(0,0) scale(1); }
  33%       { transform: translate(-20px,15px) scale(1.06); }
  66%       { transform: translate(20px,-10px) scale(0.96); }
}
@keyframes orb3 {
  0%, 100% { transform: translate(0,0); }
  50%       { transform: translate(15px,20px); }
}

@keyframes particleFloat {
  0%   { opacity: 0; transform: translateY(0) scale(0); }
  10%  { opacity: .45; }
  90%  { opacity: .15; }
  100% { opacity: 0; transform: translateY(-80px) scale(1); }
}

/* ── COUNTER HIGHLIGHT ──────────────────────────────── */
@keyframes countUp {
  from { color: var(--p400); }
  to   { color: var(--g900); }
}
.counting { animation: countUp .3s ease; }

/* ── CARD HOVER GLOW ────────────────────────────────── */
.svc-card, .testim-card {
  position: relative;
}