/* ============================================================
   Vijas unified navigation — shared across every page
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=DM+Sans:wght@400;500;700&display=swap');

:root {
  --vnav-h: 72px;
  --vnav-ink: #0f1b3d;
  --vnav-brand: #1e3a5f;
  --vnav-brand-2: #3b6fa0;
}

body { padding-top: var(--vnav-h) !important; }

.vnav {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 9999;
  height: var(--vnav-h);
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 0 clamp(16px, 4vw, 48px);
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(20px) saturate(170%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: 0 8px 30px rgba(15, 27, 61, 0.08);
  font-family: 'DM Sans', system-ui, sans-serif;
}

.vnav__brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.vnav__brand img { height: 42px; width: auto; display: block; }
.vnav__brand span {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: .02em;
  color: var(--vnav-ink);
  white-space: nowrap;
}

.vnav__links {
  display: flex;
  align-items: center;
  gap: .35rem;
  margin-left: auto;
  list-style: none;
  padding: 0;
}
.vnav__links a {
  display: block;
  padding: .55rem .85rem;
  border-radius: 999px;
  font-size: .93rem;
  font-weight: 500;
  line-height: 1;
  color: var(--vnav-ink);
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.vnav__links a:hover { background: rgba(59, 111, 160, .12); transform: translateY(-1px); }
.vnav__links a.is-active {
  background: linear-gradient(135deg, var(--vnav-brand), var(--vnav-brand-2));
  color: #fff;
  box-shadow: 0 6px 16px rgba(30, 58, 95, .28);
}

.vnav__toggle {
  display: none;
  margin-left: auto;
  width: 44px; height: 44px;
  border: 1px solid rgba(15, 27, 61, .15);
  border-radius: 12px;
  background: rgba(255, 255, 255, .7);
  cursor: pointer;
  position: relative;
}
.vnav__toggle span,
.vnav__toggle span::before,
.vnav__toggle span::after {
  position: absolute;
  left: 50%; transform: translateX(-50%);
  width: 20px; height: 2px;
  background: var(--vnav-ink);
  border-radius: 2px;
  content: '';
}
.vnav__toggle span { top: 50%; margin-top: -1px; }
.vnav__toggle span::before { top: -6px; }
.vnav__toggle span::after { top: 6px; }

@media (max-width: 1024px) {
  .vnav__toggle { display: block; }
  .vnav__links {
    position: fixed;
    top: var(--vnav-h); left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: .2rem;
    padding: 1rem clamp(16px, 4vw, 48px) 1.4rem;
    background: rgba(255, 255, 255, .93);
    backdrop-filter: blur(20px) saturate(170%);
    border-bottom: 1px solid rgba(255, 255, 255, .7);
    box-shadow: 0 18px 40px rgba(15, 27, 61, .12);
    display: none;
  }
  .vnav__links.is-open { display: flex; }
  .vnav__links a { padding: .8rem 1rem; font-size: 1rem; }
}

@media (max-width: 520px) {
  .vnav__brand span { display: none; }
}