.navbar-brand{
    margin-left:12px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .35s ease, visibility .35s ease;
}

.navbar.nav-color .navbar-brand{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.user-navbar-wrapper{
    margin-right:12px;
}

.navbar-brand-text{
    font-weight:500;
    font-size:clamp(.9rem,1.1vw,1.3rem);
    letter-spacing:2px;
    text-transform:uppercase;
    color:#fff;
    white-space:nowrap;
    text-shadow:0 .125rem .5rem rgba(0,0,0,.35);
    flex-shrink:0;
}

.navbar{
    position:fixed;
    width:100%;
    z-index:5000 !important;
    padding:clamp(.4rem,.8vw,.7rem) 0;
    background:transparent;
    border:none;
    box-shadow:none;
}

.navbar::before{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(15,45,99,.9);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(255,255,255,.12);
    box-shadow:0 .25rem 1.5rem rgba(0,0,0,.35);
    transform:translateY(-100%);
    transition:transform .45s cubic-bezier(.22,1,.36,1);
    z-index:-1;
}

.navbar.nav-color::before{
    transform:translateY(0);
}

.navbar-brand img{
    width:clamp(72px,5.4vw,108px);
    height:auto;
    max-height:4.3rem;
    object-fit:contain;
    border-radius:.25rem;
    box-shadow:0 .25rem .75rem rgba(0,0,0,.3);
}

.navbar-nav .nav-item{
    margin:0 .08rem;
}

.navbar-nav .nav-link{
    position:relative;
    padding:.45rem .65rem;
    border-radius:.375rem;
    font-size:clamp(.94rem,.98vw,1.04rem);
    font-weight:600;
    color:#fff;
    letter-spacing:1.3px;
    text-transform:uppercase;
    text-align:center;
    white-space:nowrap;
    transition:.25s ease;
}

.navbar-nav .nav-link::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:0;
    width:0;
    height:.125rem;
    background:#ffc107;
    transform:translateX(-50%);
    transition:width .3s ease;
}

.navbar-nav .nav-link:hover{
    color:#ffd857 !important;
}

.navbar-nav .nav-link:hover::after{
    width:80%;
}

.navbar-nav .nav-link.mega-toggle{
    padding-right:1.5rem;
}

.navbar-nav .nav-link.mega-toggle::before{
    content:"";
    position:absolute;
    top:50%;
    right:.55rem;
    width:.4rem;
    height:.4rem;
    border-right:2px solid #ffc107;
    border-bottom:2px solid #ffc107;
    transform:translateY(-60%) rotate(45deg);
    opacity:.85;
    transition:.35s cubic-bezier(.4,0,.2,1);
}

.navbar-nav .nav-link.mega-toggle:hover::before{
    transform:translateY(-40%) rotate(225deg);
}

.dropdown-menu{
    background:rgba(20,33,76,.92);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(255,255,255,.12);
    border-radius:.75rem;
    padding:.5rem 0;
    box-shadow:0 .5rem 1.5rem rgba(0,0,0,.3);
    text-align:center;
}

.dropdown-menu .dropdown-item{
    font-size:clamp(.8rem,.9vw,.92rem);
    font-weight:400;
    color:#fff;
    padding:.55rem 1.1rem;
    border-radius:.375rem;
    transition:.25s ease;
}

.dropdown-menu .dropdown-item:hover{
    background:rgba(255,255,255,.15);
    color:#ffd857;
}

.dropdown-menu .dropdown-item-text{
    color:#fff !important;
    font-weight:600;
    text-align:center;
}

.button-primary,
.button-secondary{
    padding:clamp(.35rem,.7vw,.45rem) clamp(.9rem,1.4vw,1.2rem);
    border-radius:2rem;
    font-size:clamp(.8rem,.9vw,.9rem);
    font-weight:700;
    transition:.3s ease;
}

.icon-user-navbar-wrapper{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 clamp(.5rem,.8vw,.8rem);
}

.icon-user-navbar{
    font-size:clamp(1.1rem,1.5vw,1.6rem);
    color:#fff;
    transition:color .3s ease;
    cursor:pointer;
}

.icon-user-navbar:hover{
    color:#ffc107;
}




@media (max-width:480px){

    .navbar{
        position:fixed;
        padding:12px 0;
        background:rgba(15,45,99,.9) !important;
        backdrop-filter:blur(18px);
        -webkit-backdrop-filter:blur(18px);
        border-bottom:1px solid rgba(255,255,255,.12);
        box-shadow:0 .25rem 1.5rem rgba(0,0,0,.35);
    }

    .navbar::before{
        display:none;
    }

    .navbar .container-fluid{
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding-left:4px;
        padding-right:4px;
    }

    .navbar-brand{
        display:flex;
        align-items:center;
        gap:1px;
        margin:0;
        padding:0;
        flex:0 1 auto;
        width:auto;
        max-width:calc(100% - 52px);
        min-width:0;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto;
    }

    .navbar-brand img{
        width:54px;
        height:auto;
        margin-left:-4px;
        flex-shrink:0;
    }

    .navbar-brand-text{
        font-size:12px;
        font-weight:700;
        line-height:1.15;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .navbar-toggler{
        padding:2px;
        margin:0;
        margin-left:auto;
        margin-right:-4px;
        flex-shrink:0;
    }

    .navbar-toggler-icon{
        width:22px;
        height:22px;
        background-size:contain;
    }

    .navbar-collapse{
        margin-top:15px;
        padding-top:10px;
        border-top:1px solid rgba(255,255,255,.1);
    }

    .navbar-nav{
        margin-top:0;
        gap:2px;
        text-align:center;
    }

    .navbar-nav .nav-item{
        margin:0;
    }

    .navbar-nav .nav-link{
        display:block;
        padding:10px 12px;
        font-size:13px;
        border-radius:8px;
    }

    .navbar-nav .nav-link small{
        font-size:12px;
        font-weight:500;
        letter-spacing:.5px;
    }

    .navbar-nav .nav-link::after{
        bottom:4px;
    }

    .navbar-nav .nav-link.mega-toggle{
        padding-right:12px;
    }

    .navbar-nav .nav-link.mega-toggle::before{
        right:12px;
        width:6px;
        height:6px;
        border-width:1.5px;
    }

    .user-navbar-wrapper{
        margin-top:16px;
        padding-top:14px;
        border-top:1px solid rgba(255,255,255,.1);
    }

    .user-navbar-wrapper .d-flex{
        justify-content:center !important;
    }

    .icon-user-navbar{
        font-size:20px;
    }

    .dropdown-menu-end{
        text-align:center;
        min-width:180px;
    }

    .dropdown-item{
        font-size:13px;
        padding:9px 14px;
    }

    .btn-outline-light,
    .btn-light{
        padding:7px 14px;
        font-size:13px;
    }

    /* PROJECT LINK */
    .project-link{
        display:flex;
        align-items:center;
        justify-content:center;
        gap:4px;
    }

    .project-badge{
        width:14px;
        height:14px;
        padding:0;
        margin-left:2px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        border-radius:50%;
        font-size:8px;
        font-weight:700;
        line-height:1;
    }
}