.navbar{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    height:80px;

    display:flex;

    justify-content:center;

    align-items:center;

    backdrop-filter:blur(20px);

    background:rgba(6,12,24,.55);

    border-bottom:1px solid rgba(255,255,255,.06);

    transition:all .35s ease;

    z-index:9999;

}

.navbar .container{
    width:min(1200px,92%);
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.logo{

    font-size:34px;

    font-weight:800;

    letter-spacing:1px;

    color:#00D8FF;

    text-shadow:

    0 0 10px rgba(0,216,255,.5),

    0 0 30px rgba(0,216,255,.25);

}

.logo span{
    color:#fff;
}

.navbar ul{
    display:flex;
    list-style:none;
    gap:36px;
}

.navbar ul li a{

    color:#fff;

    text-decoration:none;

    font-size:18px;

    font-weight:500;

    transition:.35s;

    position:relative;

    display:inline-block;

    padding:5px 0;

}

.navbar ul li a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-6px;

    width:0;

    height:2px;

    background:#00D8FF;

    border-radius:2px;

    transition:width .35s ease;

}

.navbar ul li a:hover::after{

    width:100%;

}

.navbar a:hover::after{

    width:100%;

}

.navbar a:hover{
    color:#00E5FF;
}