/* Navbar */
.navbar{
    background: linear-gradient(
        90deg,
        #050505,
        #111111,
        #1a1a1a
    );

    border-bottom: 3px solid #d4af37;
    box-shadow: 0 4px 20px rgba(212,175,55,.25);
}

.nav-container{
    max-width: 1400px;
    margin: 0 auto;
    padding: 12px 35px;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Logo */
.logo{
    display: flex;
    align-items: center;
}

.logo img{
    height: 80px;
    width: auto;

    transition: .3s;
    filter: drop-shadow(0 0 10px rgba(212,175,55,.5));
}

.logo img:hover{
    transform: scale(1.05);
}

/* Links */
.nav-links{
    display: flex;
    list-style: none;
    gap: 45px;
}

.nav-links a{
    color: #ffffff;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;

    transition: .3s;
    position: relative;
}

.nav-links a::after{
    content: '';
    position: absolute;

    left: 0;
    bottom: -8px;

    width: 0;
    height: 2px;

    background: #d4af37;

    transition: .3s;
}

.nav-links a:hover{
    color: #d4af37;
}

.nav-links a:hover::after{
    width: 100%;
}

/* Botão */
.btn-login{
    background: linear-gradient(
        135deg,
        #f8d568,
        #d4af37
    );

    color: #000;
    text-decoration: none;

    padding: 12px 24px;
    border-radius: 10px;

    font-weight: 700;
    transition: .3s;
}

.btn-login:hover{
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(212,175,55,.4);
}

/* Mobile */
@media (max-width: 768px){

    .nav-container{
        flex-direction: column;
        gap: 15px;
    }

    .logo img{
        height: 65px;
    }

    .nav-links{
        gap: 20px;
        flex-wrap: wrap;
        justify-content: center;
    }
}