/* ==========================================
   Navigation
========================================== */

.navbar {

    position: sticky;

    top: 0;

    z-index: 1000;

    backdrop-filter: blur(14px);

    background: rgba(11,17,32,.80);

    border-bottom: 1px solid var(--border);

    padding: 1rem 0;

}

/* ==========================================
   Brand
========================================== */

.navbar-brand {

    display: flex;

    align-items: center;

    gap: .75rem;

    color: white !important;

    text-decoration: none;

}

.brand-icon {

    width: 46px;

    height: 46px;

    border-radius: 12px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: linear-gradient(
        135deg,
        var(--primary),
        #2563eb
    );

    font-size: 1.4rem;

    box-shadow: 0 8px 20px rgba(59,130,246,.35);

}

.brand-text {

    display: flex;

    flex-direction: column;

    line-height: 1.1;

}

.brand-title {

    font-family: "Outfit", sans-serif;

    font-weight: 700;

    font-size: 1.15rem;

    color: white;

}

.brand-subtitle {

    font-size: .80rem;

    color: var(--text-secondary);

}
/* ==========================================
   Navigation Links
========================================== */

.navbar-nav {

    gap: .75rem;

}

.nav-link {

    color: var(--text-secondary) !important;

    padding: .6rem 1rem !important;

    border-radius: 10px;

    transition: var(--transition-normal);

    font-weight: 500;

}

.nav-link:hover {

    color: white !important;

    background: rgba(255,255,255,.05);

}
.nav-link.active {

    background: rgba(59,130,246,.15);

    color: white !important;

    border: 1px solid rgba(59,130,246,.35);

}
.navbar-toggler {

    border: none;

    box-shadow: none !important;

}

.navbar-toggler:focus {

    box-shadow: none !important;

}
@media (max-width: 991px) {

    .navbar-collapse {

        margin-top: 1rem;

        background: rgba(17,24,39,.95);

        border-radius: var(--radius);

        padding: 1rem;

        border: 1px solid var(--border);

    }

    .navbar-nav {

        gap: .25rem;

    }

}