/* iNetAtlanta lightweight animation library */
/* Use sprite strips or subtle CSS motion. Keep movement slow, soft, and non-distracting. */

.ani-wrap {
  position: relative;
  overflow: hidden;
}

.ani-soft-orbit::after {
  content: "";
  position: absolute;
  inset: 12%;
  border: 1px solid rgba(34, 200, 255, .35);
  border-radius: 50%;
  transform: rotate(0deg);
  animation: inetSoftOrbit 16s linear infinite;
  pointer-events: none;
}

.ani-soft-orbit::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  right: 24%;
  top: 34%;
  border-radius: 50%;
  background: rgba(40, 230, 164, .72);
  box-shadow: 0 0 14px rgba(40, 230, 164, .45);
  animation: inetSoftDrift 9s ease-in-out infinite;
  pointer-events: none;
}

.ani-soft-pulse {
  animation: inetSoftPulse 7s ease-in-out infinite;
}

.ani-float-line::after {
  content: "";
  position: absolute;
  width: 70%;
  height: 1px;
  left: 15%;
  top: 50%;
  background: linear-gradient(90deg, transparent, rgba(34,200,255,.55), rgba(40,230,164,.48), transparent);
  animation: inetFloatLine 8s ease-in-out infinite;
  pointer-events: none;
}

.sprite-loop {
  background-repeat: no-repeat;
  background-size: auto 100%;
  animation: inetSpriteSteps 2.4s steps(var(--frames, 12)) infinite;
}

/* Example usage later:
   <div class="sprite-loop" style="--frames:12;background-image:url('/assets/animations/veraval/veraval_orbit_strip.png');"></div>
*/

@keyframes inetSoftOrbit {
  from { transform: rotate(0deg) scale(.96); opacity: .45; }
  50% { opacity: .75; }
  to { transform: rotate(360deg) scale(.96); opacity: .45; }
}

@keyframes inetSoftDrift {
  0%,100% { transform: translate(0,0); opacity: .45; }
  50% { transform: translate(-18px, 10px); opacity: .95; }
}

@keyframes inetSoftPulse {
  0%,100% { filter: brightness(1) saturate(1); }
  50% { filter: brightness(1.14) saturate(1.18); }
}

@keyframes inetFloatLine {
  0%,100% { transform: translateX(-8px); opacity: .25; }
  50% { transform: translateX(8px); opacity: .75; }
}

@keyframes inetSpriteSteps {
  from { background-position-x: 0; }
  to { background-position-x: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .ani-soft-orbit::after,
  .ani-soft-orbit::before,
  .ani-soft-pulse,
  .ani-float-line::after,
  .sprite-loop {
    animation: none !important;
  }
}