.main-nav { background: var(--navy-900); padding-bottom: 8px; }
.main-nav .container {
  background: linear-gradient(180deg, rgba(10, 45, 110, .85), rgba(5, 24, 66, .95));
  border: 1.5px solid rgba(40, 150, 255, .55);
  border-radius: 999px;
  box-shadow: 0 0 22px rgba(10, 132, 255, .35), inset 0 0 18px rgba(10, 132, 255, .15);
  padding: 0; width: min(100% - 48px, var(--container));
}
.nav-list { display: flex; align-items: stretch; justify-content: space-between; }
.nav-list li { display: flex; flex: 1 1 auto; position: relative; }
.nav-list li + li::before { content: ""; position: absolute; left: 0; top: 24%; height: 52%; width: 1px; background: rgba(120, 180, 255, .3); }
.nav-list a {
  display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%;
  padding: 16px 20px; color: var(--white); font-weight: 600; font-size: clamp(15px, 1.25vw, 20px); white-space: nowrap;
  border-radius: 999px; transition: background .15s ease;
}
.nav-list a:hover { background: rgba(27, 155, 255, .2); }
.nav-list a.is-active { background: linear-gradient(180deg, #31b0ff, #0a84ff); box-shadow: 0 0 20px rgba(49, 176, 255, .7); }
.nav-list a svg { flex: 0 0 auto; }
.nav-toggle { display: none; }