.pulse, .pulse.animated {
  --pulse-color: rgba(210,0,0,0.5);
  --pulse-size: 25px;
  box-shadow: 0 0 0 0 var(--pulse-color);
  animation: pulse 3s infinite ease-in-out !important;
}

/* Pause animation cleanly on hover */

.pulse:hover {
  animation-play-state: paused !important;
}

@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 var(--pulse-color);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 var(--pulse-size) rgba(255, 0, 0, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 0, 0, 0);
  }
}

/* Accessibility: Respect user settings */

@media (prefers-reduced-motion: reduce) {
  .pulse, .pulse.animated {
    animation: none !important;
  }
}