.rockets {
  height: 0.5rem;
  width: min(100%, 25rem);
  background-image: linear-gradient(
  to right,
  var(--bs-primary) calc(50% * var(--rockets)),
  transparent calc(50% * var(--rockets))
  );
  background-size: 200%;
  animation: move-bg 1s ease-in-out 1ms both;
}

.rockets span {
  width: 1.5rem;
  height: 1.5rem;
  rotate: -45deg;
  translate: -50% 0;
  left: calc(100% * var(--rockets));
  animation: scale-rocket 1s ease-in-out 1ms both;
  transition: left ease-in-out 1s;
}

@keyframes scale-rocket {
  0% { scale: 0.8 }
  40% { scale: 1.8 }
  100% { scale: 1.2 }
}
@keyframes move-bg {
  0% { background-position: 100%; }
  100% { background-position: 0%; }
}