@keyframes fadeInUp { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }
@keyframes gradientShift { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }
@keyframes shimmer { 0%, 45% { transform: translateX(-60%); opacity: 0; } 55% { opacity: 1; } 100% { transform: translateX(60%); opacity: 0; } }
@keyframes slowSpin { to { transform: rotate(360deg); } }
@keyframes reverseSpin { to { transform: rotate(-360deg); } }
@keyframes pulseAura { 0%, 100% { opacity: .45; transform: scale(.92); } 50% { opacity: .95; transform: scale(1.08); } }
@keyframes markBreath { 0%, 100% { transform: scale(.98); filter: drop-shadow(0 0 22px rgba(34,211,238,.28)); } 50% { transform: scale(1.035); filter: drop-shadow(0 0 38px rgba(236,72,153,.34)); } }
@keyframes nodePulse { 0%, 100% { opacity: .65; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.1); } }
@keyframes dataSweep { 0%, 100% { background-position: 0% 50%; opacity: .68; } 50% { background-position: 100% 50%; opacity: 1; } }
@keyframes traceDrift { 0%, 100% { transform: translateX(-12px); opacity: .45; } 50% { transform: translateX(18px); opacity: .82; } }
@keyframes barSignal { 0%, 100% { transform: scaleY(.72); opacity: .65; } 50% { transform: scaleY(1); opacity: 1; } }
@keyframes shieldPulse { 0%, 100% { opacity: .55; transform: scale(.96); } 50% { opacity: .98; transform: scale(1.04); } }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes flowDot { 0% { left: 8%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { left: 88%; opacity: 0; } }
@keyframes scanBeam { 0%, 100% { top: 14%; opacity: .25; } 50% { top: 78%; opacity: .95; } }
@keyframes chatPop { 0%, 100% { transform: translateY(0) scale(.97); opacity: .6; } 50% { transform: translateY(-6px) scale(1.02); opacity: 1; } }
@keyframes orbitPath { to { transform: rotate(360deg); } }
@keyframes ringPing { 0% { transform: scale(.6); opacity: .8; } 100% { transform: scale(1.6); opacity: 0; } }
@keyframes lakeWave { 0%, 100% { transform: translateX(-6%) scaleY(.94); } 50% { transform: translateX(6%) scaleY(1.06); } }
@keyframes stagePulse { 0%, 100% { border-color: rgba(34,211,238,.2); box-shadow: none; } 50% { border-color: rgba(34,211,238,.6); box-shadow: 0 0 22px rgba(34,211,238,.25); } }
.reveal { opacity: 0; transform: translateY(26px); transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.scale-reveal { opacity: 0; transform: scale(.96); transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease); }
.scale-reveal.is-visible { opacity: 1; transform: scale(1); }
.btn-primary { background-size: 200% 200%; animation: gradientShift 8s linear infinite; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } .reveal, .scale-reveal { opacity: 1; transform: none; } }