@property --site-glow-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes site-glow-turn { to { --site-glow-angle: 360deg; } }
.service-card::after { opacity: 1 !important; animation-direction: normal !important; }
.service-card:hover::after { animation-direction: reverse !important; }
.site-glow-card { position: relative; }
.site-glow-ring {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: block;
  border: 1.5px solid transparent;
  border-radius: inherit;
  background: conic-gradient(from var(--site-glow-angle), #a91e74, #559fe2, #a91e74 38%, #f2b43f 56%, #a91e74 82%, #559fe2) border-box;
  -webkit-mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  pointer-events: none;
  animation: site-glow-turn 5s linear infinite;
}
.site-glow-card:hover > .site-glow-ring { animation-direction: reverse; }
@media (prefers-reduced-motion: reduce) { .site-glow-ring { animation: none; } }