.navbutton.coveted {position: relative;  /* ensures pseudo-elements are relative to the button */
    overflow: visible;   /* allows the waves to expand outside button but stay contained */
    display: inline-block;
    z-index: 1;
}


.navbutton.coveted::before,
.navbutton.coveted::after {content: "";
   position: absolute;
   width: 120%;      /* bigger than button */
   height: 120%;
   background: black;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%) scale(1);
   opacity: 0;
   z-index: 0;
   pointer-events: none;
   border-radius: 8px;
   filter: blur(4px);}

/* faster emission */
.navbutton.coveted:hover::before {animation: wave 1.6s infinite ease-out;}

.navbutton.coveted:hover::after {animation: wave 1.6s infinite ease-out 0.8s;}

@keyframes wave {
   0% {
      transform: translate(-50%, -50%) scale(1);
      opacity: 0.35;
   }
   100% {
      transform: translate(-50%, -50%) scale(1.9);
      opacity: 0;
   }
}

      /* ============================= */
      /* Smaller Diagonal Figure 8 */
      /* ============================= */

.navbutton.coveted:hover span {animation: infinityMotion 2s infinite linear,
   colorPulse 2s infinite ease-in-out;}

     /* TRUE figure-8 motion */
@keyframes infinityMotion {
   0%   { transform: translate(0px, 0px); }
   12.5% { transform: translate(3px, -2px); }
   25%  { transform: translate(5px, 0px); }
   37.5% { transform: translate(3px, 2px); }
   50%  { transform: translate(0px, 0px); }
   62.5% { transform: translate(-3px, -2px); }
   75%  { transform: translate(-5px, 0px); }
   87.5% { transform: translate(-3px, 2px); }
   100% { transform: translate(0px, 0px); }
}

/* Fill / outline swap */
@keyframes colorPulse {
   0% {
      color: black;
      -webkit-text-stroke: 1px white;
   }
   50% {
      color: white;
      -webkit-text-stroke: 1px black;
   }
   100% {
      color: black;
      -webkit-text-stroke: 1px white;
   }
}