/* ==========================================
   VS TECH Premium Navbar
========================================== */

:root{
    --primary:#1D4ED8;
    --secondary:#00C2FF;
    --dark:#0B132B;
    --white:#ffffff;
    --gray:#CBD5E1;
}

.navbar{
    padding:18px 0;
    transition:.4s ease;
    z-index:999;
}

.navbar.scrolled{
    background:rgba(11,19,43,.92);
    backdrop-filter:blur(20px);
    box-shadow:0 10px 35px rgba(0,0,0,.25);
    padding:12px 0;
}

.navbar-brand img{
    height:60px;
    transition:.3s;
}

.navbar-brand:hover img{
    transform:scale(1.05);
}

.navbar-nav{
    gap:10px;
}

.nav-link{
    position:relative;
    color:white !important;
    font-weight:600;
    padding:10px 16px !important;
    transition:.3s;
}

.nav-link:hover{
    color:var(--secondary)!important;
    transform:translateY(-2px);
}

.nav-link.active{
    color:var(--secondary)!important;
}

.nav-link::after{
    content:"";
    position:absolute;
    left:15px;
    bottom:4px;
    width:0;
    height:2px;
    background:linear-gradient(90deg,var(--primary),var(--secondary));
    transition:.35s;
}

.nav-link:hover::after,
.nav-link.active::after{
    width:calc(100% - 30px);
}

.btn-contact{
    background:linear-gradient(135deg,var(--primary),var(--secondary));
    color:white;
    padding:12px 26px;
    border-radius:50px;
    font-weight:700;
    text-decoration:none;
    transition:.35s;
    box-shadow:0 10px 25px rgba(0,194,255,.25);
}

.btn-contact:hover{
    transform:translateY(-3px) scale(1.05);
    box-shadow:0 15px 35px rgba(0,194,255,.45);
    color:white;
}

.navbar-toggler{
    border:none;
    box-shadow:none!important;
}

.navbar-toggler-icon{
    filter:invert(1);
}

@media(max-width:991px){

.navbar-collapse{
    margin-top:15px;
    padding:25px;
    border-radius:20px;
    background:#13203f;
}

.nav-link{
    padding:14px!important;
}

.btn-contact{
    margin-top:15px;
    display:block;
    text-align:center;
}

}