/* Keyframes and motion */
@keyframes logoSpin {
  from { transform: rotateX(-12deg) rotateY(0deg); }
  to   { transform: rotateX(-12deg) rotateY(360deg); }
}

@keyframes shadowPulse {
  0%, 100% { transform: scaleX(1); opacity: .8; }
  50% { transform: scaleX(.8); opacity: .5; }
}

@keyframes waPulse {
  0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .6); }
  70% { box-shadow: 0 0 0 18px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

@keyframes gloss { 0% { transform: translateX(-100%); } 60%, 100% { transform: translateX(100%); } }

@keyframes navGlow { 0% { box-shadow: 0 0 0 0 rgba(255,122,26,.55); } 70% { box-shadow: 0 0 0 14px rgba(255,122,26,0); } 100% { box-shadow: 0 0 0 0 rgba(255,122,26,0); } }

@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

@keyframes float3d { 0%, 100% { transform: translateY(0) rotateY(0); } 50% { transform: translateY(-6px) rotateY(18deg); } }

@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }