/* Axencia.co — Navbar: Smooth • Modern • Sleek • Interactive */

@media (prefers-reduced-motion: reduce) {
  .nav-links a, .nav-logo, .nav-cta, .nav-cybershield, .navbar, .nav-progress { animation: none !important; }
  .nav-links a::after, .nav-links a::before, .nav-logo::after { animation: none !important; }
}

/* ===== NAVBAR — Sleek glass, smooth scroll ===== */
.navbar {
  -webkit-backdrop-filter: blur(32px) saturate(180%);
  backdrop-filter: blur(32px) saturate(180%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  transition: background 0.5s ease, border-color 0.4s ease, box-shadow 0.4s ease !important;
}

.navbar.scrolled {
  border-bottom-color: rgba(59, 130, 246, 0.08);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}

/* ===== LINK UNDERLINE — Sleek gradient reveal ===== */
.nav-links a:not(.nav-cta):not(.nav-cybershield)::after {
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 0 !important;
  height: 2px !important;
  bottom: 8px !important;
  border-radius: 1px !important;
  background: linear-gradient(90deg, #60a5fa, #38bdf8, #60a5fa) !important;
  background-size: 200% 100% !important;
  transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              opacity 0.3s ease !important;
  box-shadow: none !important;
}

.nav-links a:not(.nav-cta):not(.nav-cybershield):hover::after,
.nav-links a:not(.nav-cta):not(.nav-cybershield).active::after {
  width: 70% !important;
  animation: navUnderlineFlow 3s ease-in-out infinite;
}

@keyframes navUnderlineFlow {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* ===== LINK HOVER — Smooth, minimal lift ===== */
.nav-links a:not(.nav-cta) {
  transition: color 0.35s ease,
              background 0.35s ease,
              border-color 0.35s ease,
              box-shadow 0.35s ease,
              transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.nav-links a:not(.nav-cta):hover {
  transform: translateY(-2px) !important;
  color: #e2e8f0 !important;
  background: rgba(15, 23, 42, 0.6) !important;
  border-color: rgba(59, 130, 246, 0.15) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
}

.nav-links a:not(.nav-cta).active {
  color: #93c5fd !important;
  border-color: rgba(59, 130, 246, 0.2) !important;
}

/* ===== IRIDESCENT RING — Subtle, only on hover ===== */
.nav-links a:not(.nav-cta)::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: 10px;
  padding: 1px;
  background: linear-gradient(135deg, 
    rgba(96, 165, 250, 0.4) 0%, 
    rgba(56, 189, 248, 0.3) 50%, 
    rgba(96, 165, 250, 0.4) 100%);
  background-size: 200% 200%;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.nav-links a:not(.nav-cta):hover::before {
  opacity: 1;
}

/* ===== LETTER SPACING — Subtle breath ===== */
.nav-links a:not(.nav-cta) {
  letter-spacing: 0.01em;
  transition: letter-spacing 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.nav-links a:not(.nav-cta):hover {
  letter-spacing: 0.04em;
}

/* ===== ACTIVE PRESS — Satisfying click ===== */
.nav-links a:active {
  transition: transform 0.15s ease !important;
  transform: translateY(0) scale(0.98) !important;
}

/* ===== LOGO — Sleek hover glow ===== */
.nav-logo {
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.nav-logo:hover {
  transform: scale(1.02) !important;
}

.nav-logo::after {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 10px;
  background: radial-gradient(circle at 50% 50%, rgba(96, 165, 250, 0.25) 0%, transparent 70%);
  opacity: 0;
  filter: blur(8px);
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.nav-logo:hover::after {
  opacity: 1;
}

/* ===== CTA — Smooth glass hover ===== */
.nav-cta {
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.nav-cta:hover {
  transform: translateY(-3px) !important;
}

.nav-cta::after {
  transition: left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* ===== CYBERSHIELD — Sleek accent ===== */
.nav-cybershield {
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.nav-cybershield:hover {
  box-shadow: 
    0 8px 24px rgba(59, 130, 246, 0.3),
    0 0 24px rgba(59, 130, 246, 0.1) !important;
}

/* ===== SEARCH — Smooth expand ===== */
.nav-search-wrap {
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* ===== PROGRESS BAR — Smooth fill ===== */
.nav-progress {
  transition: width 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}
