/* ------------------------- navbar -- */
.navbar{
    width:100%;
    background:#1f2937;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0;
    height:70px;
    position:fixed;
    top:0;
    left:0;
    z-index:1000;
}

.nav-container{
    max-width:1100px;
    width:100%;
    height:100%;
    margin:0 auto;
    padding:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.nav-logo{
    font-size:1.5rem;
    font-weight:bold;
    text-decoration:none;
    color:white;
}

.nav-logo img{
    height:40px;
    width:auto;
    display:block;
}

.nav-links{
    display:flex;
    list-style:none;
    align-items:center;
    gap:24px;
}

.nav-links a{
    color:white;
    text-decoration:none;
    font-size:1rem;
    transition: color .3s ease;
}

.nav-links a:hover{
    color:#00ff99;
}

.ins-btn{
    background:#00ff99;
    display: inline-block;
    color:#111827 !important;
    text-decoration: none;
    padding:8px 14px;
    border-radius:8px;
    cursor: pointer;
}

.hamburger{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    cursor:pointer;
}

.hamburger span{
    width:28px;
    height:3px;
    background:white;
    border-radius:5px;
    transition:.3s;
}

.eigh-link{
    margin-top: auto;
    padding-bottom: 20px;
    display:none;
}

.eigh-link img{
    height:30px;
    width:auto;
    display:block;
}

@media (max-width: 1150px){

    .nav-container{
        padding:0 24px;
    }

    .hamburger{
        display:flex;
    }

    .nav-links{
        position: fixed;
        top: 70px;
        bottom: 0;      
        right: -100%;
        width: 260px;
        height: auto;   
        background: #111827;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 40px 0 20px; 
        gap: 30px;
        transition: right .35s ease;
        overflow-y: auto; 
    }

    .eigh-link{
        margin-top: auto;
        padding-top: 0px;
        padding-bottom: 0px;
        display: block;
    }

    .nav-links.menu-open{
        right:0;
    }

    .hamburger.menu-open span:nth-child(1){
        transform:translateY(8px) rotate(45deg);
    }

    .hamburger.menu-open span:nth-child(2){
        opacity:0;
    }

    .hamburger.menu-open span:nth-child(3){
        transform:translateY(-8px) rotate(-45deg);
    }
}
