/* NAV TEK OTORİTE (o/web components.css): .nav ana bloğu buradan silindi —
   bulutlu şeffaf nav (nav-bg %92 + blur) ve offset tek kaynaktan gelir. */
.nav__logo {
    font-family: var(--fn-mono);
    font-size: var(--fs-body);
    letter-spacing: var(--ls-label);
    color: var(--text-bright);
    text-decoration: none;
    flex-shrink: 0;
}

.nav__primary {
    display: flex;
    gap: var(--gap);
    margin-left: var(--sp-4);
}

.nav__primary a {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-light);
    text-decoration: none;
    transition: color var(--an-speed-fast);
    white-space: nowrap;
}

.nav__primary a:hover {
    color: var(--accent-bright);
}

.nav__secondary {
    display: none;
    position: absolute;
    top: var(--nav-h);
    right: var(--page-pad);
    background: var(--bg-dark);
    border: var(--border) solid var(--accent-border);
    flex-direction: column;
    min-width: var(--lw-xl);
    max-height: calc(100vh - var(--nav-h));
    overflow-y: auto;
}

.nav__secondary--open {
    display: flex;
}

.nav__secondary a {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-light);
    text-decoration: none;
    padding: var(--sp-2) var(--sp-3);
    transition: background var(--an-speed), color var(--an-speed);
}

.nav__secondary a:hover {
    background: var(--accent-border);
    color: var(--accent-bright);
}

.nav__group {
    display: flex;
    flex-direction: column;
    padding-bottom: var(--sp-1);
}

.nav__group:not(:last-child) {
    border-bottom: var(--border) solid var(--accent-border);
    margin-bottom: var(--sp-1);
}

.nav__group-label {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--accent-bright);
    text-transform: uppercase;
    padding: var(--sp-2) var(--sp-3) var(--sp-1);
    opacity: var(--op-mid);
}

.nav__right {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin-left: auto;
}

.nav__more {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    padding: var(--sp-1) var(--sp-2);
    border: var(--border) solid var(--accent-border);
    background: transparent;
    color: var(--text-light);
    cursor: pointer;
    transition: border-color var(--an-speed), color var(--an-speed);
}

.nav__more:hover {
    border-color: var(--accent);
    color: var(--accent-bright);
}

.nav__login-btn {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--bg-deep);
    background: var(--accent);
    text-decoration: none;
    padding: var(--sp-1) var(--sp-3);
    transition: opacity var(--an-speed);
}

.nav__login-btn:hover {
    opacity: var(--op-mid);
}

.nav__logout-btn {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-mid);
    color: var(--text-light);
    background: transparent;
    border: var(--border) solid var(--accent-border);
    padding: var(--sp-1) var(--sp-3);
    cursor: pointer;
    transition: border-color var(--an-speed), color var(--an-speed);
}

.nav__logout-btn:hover {
    border-color: var(--accent-bright);
    color: var(--accent-bright);
}

.nav__lang-btn {
    font-family: var(--fn-mono);
    font-size: var(--fs-label);
    letter-spacing: var(--ls-label);
    color: var(--text-light);
    text-decoration: none;
    border: var(--border) solid var(--accent-border);
    padding: var(--sp-1) var(--sp-2);
}

.nav__lang-btn:hover {
    color: var(--accent-bright);
    border-color: var(--accent-bright);
}

@media (max-width: var(--brk-m)) {
    .nav {
        padding: 0 var(--page-pad-m);
    }

    .nav__primary {
        gap: var(--gap);
        margin-left: var(--sp-2);
    }

    .nav__primary a {
        font-size: var(--fs-label);
    }

    .nav__secondary {
        right: var(--page-pad-m);
    }
}

.nav__mobile-only {
    display: none;
}

@media (max-width: var(--brk-s)) {
    .nav__mobile-only {
        display: flex;
    }

    .nav__mobile-only.nav__divider {
        border-top: var(--border) solid var(--accent-border);
        margin-top: var(--sp-1);
        padding-top: var(--sp-3);
    }

    .nav__primary {
        display: none;
    }
}