.nav.scrolled {
  top: 8px;
  background: hsl(270 18% 7% / 98%);
  border-color: #ffffff2e;
  box-shadow: 0 16px 45px #120b16aa;
}

.nav nav > a {
  position: relative;
}

.nav nav > a.active:not(.navCta) {
  background: linear-gradient(135deg, hsl(32 58% 48% / 28%), hsl(275 42% 62% / 20%));
  color: #fff;
  opacity: 1;
}

.nav nav > a:not(.navCta)::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: 4px;
  height: 1px;
  background: linear-gradient(90deg, var(--gold), hsl(275 45% 70%));
  transition: 0.25s;
}

.nav nav > a:hover::after,
.nav nav > a.active::after {
  left: 13px;
  right: 13px;
}

.floatWa {
  transition: transform 0.25s, box-shadow 0.25s;
}

.floatWa:hover {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 16px 36px #0006;
}

@media (max-width: 900px) {
  .nav nav > a:not(.navCta)::after {
    bottom: 2px;
  }
}
