.navbar {
    display: flex;
    justify-content: space-between; /* Logo links, Menü rechts */
    align-items: center; /* Vertikal zentrieren */
    padding: 0 20px; /* Abstand links/rechts */
}

.navbar li{
    position: relative;

}
.navbar a{
    color:var(--text-color);
    font-weight: bold;
    font-size: 1rem;
    padding:10px 20px;
}
.navbar a::after{
    content: '';
    position: absolute;
    width:0;
    height:2px;
    background:var(--main-color);
    left:0;
    bottom:-4px;
    transition:ease .40s;
}

.sticky .navbar a::after{
    background: var(--text-color);
}

.navbar a:hover::after{
    width:100%;
}

@media(max-width:990px){
    .navbar{
        position:absolute;
        top:-700px;
        left:0;
        right:0;
        flex-direction: column;
        background: var(--bg-color);
        text-align: left;
        transition: all .30s;

    }
    .navbar a{
        display: block;
        padding:1.1rem;
        margin:1.3rem;
        border-left: 2px solid var(--text-color); 

    }
    .navbar a:hover{
        background:var(--main-color);
    }
    .navar a::after{
        display: none;
    }
    .navbar.active{
        top:100%;
    }
}