.at-glow-word {
  
  background: linear-gradient(90deg, #F0460E, #FFB703, #40D082, #409CFF, #BF5AF2, #F0460E);
  background-size: 300% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;

  text-shadow:
    0 0 1px rgba(255, 236, 180, 0.9),
    0 0 5px rgba(240, 70, 14, 0.6),
    0 0 12px rgba(240, 70, 14, 0.45),
    0 0 22px rgba(240, 70, 14, 0.3);

  animation: atGlowWordFlow 6s linear infinite, atGlowWordHalo 6s linear infinite;
}

@keyframes atGlowWordFlow {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 300% 50%;
  }
}

@keyframes atGlowWordHalo {
  0%,
  100% {
    text-shadow:
      0 0 1px rgba(255, 236, 180, 0.9),
      0 0 5px rgba(240, 70, 14, 0.6),
      0 0 12px rgba(240, 70, 14, 0.45),
      0 0 22px rgba(240, 70, 14, 0.3);
  }
  20% {
    text-shadow:
      0 0 1px rgba(255, 236, 180, 0.9),
      0 0 5px rgba(255, 183, 3, 0.6),
      0 0 12px rgba(255, 183, 3, 0.45),
      0 0 22px rgba(255, 183, 3, 0.3);
  }
  40% {
    text-shadow:
      0 0 1px rgba(255, 236, 180, 0.9),
      0 0 5px rgba(64, 208, 130, 0.6),
      0 0 12px rgba(64, 208, 130, 0.45),
      0 0 22px rgba(64, 208, 130, 0.3);
  }
  60% {
    text-shadow:
      0 0 1px rgba(255, 236, 180, 0.9),
      0 0 5px rgba(64, 156, 255, 0.6),
      0 0 12px rgba(64, 156, 255, 0.45),
      0 0 22px rgba(64, 156, 255, 0.3);
  }
  80% {
    text-shadow:
      0 0 1px rgba(255, 236, 180, 0.9),
      0 0 5px rgba(191, 90, 242, 0.6),
      0 0 12px rgba(191, 90, 242, 0.45),
      0 0 22px rgba(191, 90, 242, 0.3);
  }
}

@media (prefers-reduced-motion: reduce) {
  .at-glow-word {
    animation: none;
  }
}

/* Secondary (outline) button hover — a spinning multi-color glow (same
   rainbow set as .at-glow-word / the hero's "up next" thumbnail) floating
   around the button, not a change to the border itself. Lives on a
   ::before so it can fade in/out with a plain opacity transition instead
   of animating box-shadow directly. */
/* .at-btn.at-btn-border-white {
  position: relative;
  z-index: 0;
}
.at-btn.at-btn-border-white::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  opacity: 0;
  box-shadow:
    0 -10px 20px -6px rgba(255, 61, 113, 0.7),
    9px -3px 20px -6px rgba(255, 176, 32, 0.65),
    6px 8px 22px -6px rgba(64, 208, 130, 0.65),
    -6px 8px 20px -6px rgba(64, 156, 255, 0.65),
    -9px -3px 20px -6px rgba(191, 90, 242, 0.6),
    0 8px 18px -8px rgba(0, 0, 0, 0.45);
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.at-btn.at-btn-border-white:hover::before {
  opacity: 1;
  animation: atBtnGlowSpin 3s linear infinite;
}
@keyframes atBtnGlowSpin {
  0% {
    box-shadow:
      0 -10px 20px -6px rgba(255, 61, 113, 0.7),
      9px -3px 20px -6px rgba(255, 176, 32, 0.65),
      6px 8px 22px -6px rgba(64, 208, 130, 0.65),
      -6px 8px 20px -6px rgba(64, 156, 255, 0.65),
      -9px -3px 20px -6px rgba(191, 90, 242, 0.6),
      0 8px 18px -8px rgba(0, 0, 0, 0.45);
  }
  25% {
    box-shadow:
      10px 0 20px -6px rgba(255, 61, 113, 0.7),
      3px 9px 20px -6px rgba(255, 176, 32, 0.65),
      -8px 6px 22px -6px rgba(64, 208, 130, 0.65),
      -8px -6px 20px -6px rgba(64, 156, 255, 0.65),
      3px -9px 20px -6px rgba(191, 90, 242, 0.6),
      0 8px 18px -8px rgba(0, 0, 0, 0.45);
  }
  50% {
    box-shadow:
      0 10px 20px -6px rgba(255, 61, 113, 0.7),
      -9px 3px 20px -6px rgba(255, 176, 32, 0.65),
      -6px -8px 22px -6px rgba(64, 208, 130, 0.65),
      6px -8px 20px -6px rgba(64, 156, 255, 0.65),
      9px 3px 20px -6px rgba(191, 90, 242, 0.6),
      0 8px 18px -8px rgba(0, 0, 0, 0.45);
  }
  75% {
    box-shadow:
      -10px 0 20px -6px rgba(255, 61, 113, 0.7),
      -3px -9px 20px -6px rgba(255, 176, 32, 0.65),
      8px -6px 22px -6px rgba(64, 208, 130, 0.65),
      8px 6px 20px -6px rgba(64, 156, 255, 0.65),
      -3px 9px 20px -6px rgba(191, 90, 242, 0.6),
      0 8px 18px -8px rgba(0, 0, 0, 0.45);
  }
  100% {
    box-shadow:
      0 -10px 20px -6px rgba(255, 61, 113, 0.7),
      9px -3px 20px -6px rgba(255, 176, 32, 0.65),
      6px 8px 22px -6px rgba(64, 208, 130, 0.65),
      -6px 8px 20px -6px rgba(64, 156, 255, 0.65),
      -9px -3px 20px -6px rgba(191, 90, 242, 0.6),
      0 8px 18px -8px rgba(0, 0, 0, 0.45);
  }
}
@media (prefers-reduced-motion: reduce) {
  .at-btn.at-btn-border-white:hover::before {
    animation: none;
  }
} */

.at-btn.at-btn-border-white {
  position: relative;
  z-index: 0;
  text-wrap: nowrap;
  transition:
    background-color 0.3s ease,
    color 0.3s ease;
}

/* White glow behind the button */
.at-btn.at-btn-border-white::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  opacity: 0;

  box-shadow:
    0 -10px 22px -6px rgba(255, 255, 255, 0.25),
    10px -3px 22px -6px rgba(255, 255, 255, 0.25),
    6px 9px 24px -6px rgba(255, 255, 255, 0.25),
    -6px 9px 22px -6px rgba(255, 255, 255, 0.25),
    -10px -3px 22px -6px rgba(255, 255, 255, 0.25);

  transition: opacity 0.3s ease;
  pointer-events: none;
}

/* Hover */
.at-btn.at-btn-border-white:hover {
  background-color: #fff !important;
  color: #000;
}

.at-btn.at-btn-border-white:hover::before {
  opacity: 1;
  animation: atBtnWhiteGlowSpin 3s linear infinite;
}

/* Rotating white glow */
@keyframes atBtnWhiteGlowSpin {
  0% {
    box-shadow:
      0 -10px 20px -6px rgba(255,255,255,.38),
      10px -3px 20px -6px rgba(255,255,255,.34),
      6px 8px 22px -6px rgba(255,255,255,.34),
      -6px 8px 20px -6px rgba(255,255,255,.34),
      -10px -3px 20px -6px rgba(255,255,255,.30);
  }

  25% {
    box-shadow:
      10px 0 20px -6px rgba(255,255,255,.38),
      3px 10px 20px -6px rgba(255,255,255,.34),
      -8px 6px 22px -6px rgba(255,255,255,.34),
      -8px -6px 20px -6px rgba(255,255,255,.34),
      3px -10px 20px -6px rgba(255,255,255,.30);
  }

  50% {
    box-shadow:
      0 10px 20px -6px rgba(255,255,255,.38),
      -10px 3px 20px -6px rgba(255,255,255,.34),
      -6px -8px 22px -6px rgba(255,255,255,.34),
      6px -8px 20px -6px rgba(255,255,255,.34),
      10px 3px 20px -6px rgba(255,255,255,.30);
  }

  75% {
    box-shadow:
      -10px 0 20px -6px rgba(255,255,255,.38),
      -3px -10px 20px -6px rgba(255,255,255,.34),
      8px -6px 22px -6px rgba(255,255,255,.34),
      8px 6px 20px -6px rgba(255,255,255,.34),
      -3px 10px 20px -6px rgba(255,255,255,.30);
  }

  100% {
    box-shadow:
      0 -10px 20px -6px rgba(255,255,255,.38),
      10px -3px 20px -6px rgba(255,255,255,.34),
      6px 8px 22px -6px rgba(255,255,255,.34),
      -6px 8px 20px -6px rgba(255,255,255,.34),
      -10px -3px 20px -6px rgba(255,255,255,.30);
  }
}

@media (prefers-reduced-motion: reduce) {
  .at-btn.at-btn-border-white:hover::before {
    animation: none;
  }
}

/* Ensure footer feature labels never get button hover glow or background */
.footer-feature-label,
.footer-feature-label:hover {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
.footer-feature-label::before,
.footer-feature-label::after,
.footer-feature-label:hover::before,
.footer-feature-label:hover::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  box-shadow: none !important;
}