.nav-glass-cta {
  position: relative;
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding-inline: 3px;
  color: rgba(239, 245, 255, 0.87) !important;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: color 220ms ease;
}

.nav-glass-cta::before {
  content: "";
  position: absolute;
  left: 3%;
  right: 3%;
  bottom: 3px;
  height: 14px;
  background: radial-gradient(ellipse at 50% 100%, rgba(45, 116, 255, 0.24) 0%, rgba(42, 106, 231, 0.11) 36%, transparent 72%);
  filter: blur(4px);
  opacity: 0.68;
  pointer-events: none;
  transition: opacity 220ms ease, transform 220ms ease;
}

.nav-glass-cta::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 8px;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(24, 83, 196, 0) 0%, rgba(44, 112, 239, 0.42) 18%, rgba(89, 149, 255, 0.78) 38%, rgba(196, 222, 255, 0.98) 50%, rgba(89, 149, 255, 0.78) 62%, rgba(44, 112, 239, 0.42) 82%, rgba(24, 83, 196, 0) 100%);
  filter: drop-shadow(0 0 2px rgba(73, 137, 255, 0.5));
  transform: scaleX(0.8);
  transition: transform 240ms ease, filter 240ms ease;
  pointer-events: none;
}

.nav-glass-cta__border { display: none; }
.nav-glass-cta__label { position: relative; z-index: 1; }

.nav-glass-cta:hover {
  color: #fff !important;
}

.nav-glass-cta:hover::before,
.nav-glass-cta:focus-visible::before {
  opacity: 0.92;
  transform: scaleX(1.08);
}

.nav-glass-cta:hover::after,
.nav-glass-cta:focus-visible::after {
  transform: scaleX(1);
  filter: drop-shadow(0 0 3px rgba(92, 153, 255, 0.66));
}

.nav-glass-cta:focus-visible {
  color: #fff !important;
  outline: 2px solid rgba(82, 140, 255, 0.62);
  outline-offset: 5px;
  border-radius: 2px;
}

@media (max-width: 980px) {
  .header .nav-links {
    display: flex !important;
    align-items: center;
    margin-left: auto;
  }
}

@media (max-width: 760px) {
  .nav-glass-cta {
    min-height: 44px !important;
    font-size: 13.5px;
  }
  .header .nav { gap: 8px; }
  .header .brand { width: 128px; }
}

@media (max-width: 340px) {
  .nav-glass-cta { font-size: 12.5px; }
  .header .brand { width: 116px; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-glass-cta { transition: none; }
  .nav-glass-cta::before,
  .nav-glass-cta::after { transition: none; }
}