/* ============================================================================
   VIRTUE COMPLIANCE — Navigation
   ============================================================================ */

.nav {
    position: fixed; top: 0; left: 0; right: 0;
    z-index: 100;
    padding: 20px 0;
    transition: all 0.3s ease;
}
.nav.scrolled {
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--border-light);
    padding: 14px 0;
}
.nav-inner {
    max-width: 1140px; margin: 0 auto; padding: 0 32px;
    display: flex; align-items: center; justify-content: space-between;
}
.nav-logo {
    display: flex; align-items: center; gap: 12px;
    text-decoration: none; color: var(--ink);
}
.nav-logo-icon     { width: 36px; height: 36px; }
.nav-logo-icon img { width: 100%; height: 100%; object-fit: contain; }
.nav-logo-text     { font-weight: 600; font-size: 16.5px; letter-spacing: -0.2px; }
.nav-logo-text span { color: var(--ink-3); font-weight: 400; }

.nav-links {
    display: flex; align-items: center; gap: 4px; list-style: none;
}
.nav-links a {
    text-decoration: none; color: var(--ink-2); font-size: 14px; font-weight: 500;
    padding: 8px 14px; border-radius: 8px; transition: all 0.2s;
}
.nav-links a:hover  { color: var(--ink); background: var(--surface-1); }
.nav-links a.active { color: var(--accent); font-weight: 600; }

.nav-cta {
    background: var(--primary) !important; color: white !important;
    padding: 9px 20px !important; border-radius: 8px !important;
    font-weight: 600 !important; transition: all 0.2s !important;
}
.nav-cta:hover { background: var(--primary-deep) !important; }

/* Hamburger */
.nav-toggle {
    display: none; background: none; border: none; cursor: pointer;
    width: 32px; height: 32px; position: relative;
}
.nav-toggle span {
    display: block; width: 20px; height: 1.5px; background: var(--ink);
    position: absolute; left: 6px; transition: 0.3s;
}
.nav-toggle span:nth-child(1) { top: 10px; }
.nav-toggle span:nth-child(2) { top: 15px; }
.nav-toggle span:nth-child(3) { top: 20px; }

/* Mobile nav */
@media (max-width: 768px) {
    .nav-links   { display: none; }
    .nav-toggle  { display: block; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; }
    .nav-inner   { padding: 0 16px; }
    .nav-logo-text { font-size: 14px; }
    .nav-links[style*="display: flex"] { animation: slideDown 0.25s ease; }
}
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}
