A bento card for a deploy pipeline: code ships, tests pass, a release goes live. Convey momentum.
# Core Message Extraction **"Momentum through stages."** Code flows → tests validate → release launches. The card must visualize a *linear, unstoppable progression* where each stage accelerates into the next, leaving a trail of completion. On hover, the pipeline reawakens and cycles once more, reinforcing the sense of continuous delivery motion. --- --- ## Motion Rationale The animation visualizes **unstoppable forward momentum** through three linked stages. On hover, each stage pulses sequentially (0ms → 300ms → 600ms, staggered in 30-40ms-equivalent steps) with a playful cubic-bezier(0.34, 1.56, 0.64, 1) overshoot that mimics acceleration. Between stages, a 2px blur-gradient trail *flows* from Code → Test → Deploy using cubic-bezier(0.77, 0, 0.175, 1) ease-in for snappy on-screen movement, reinforcing the sense that work moves through the pipeline automatically. Each stage completes (green checkmark aesthetic via box-shadow glow) before the next awakens, creating a rhythm that *feels* like CI/CD completion. The 0.6s pulse duration on each stage is long enough to register but fast enough to feel nimble—never sluggish. The trails' 0.4s flow is crisp and satisfying, making the pipeline feel alive without overwhelming. Hover-gated via @media (hover: hover) to avoid touch misfires.