.header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    padding: var(--padding-template-y-axis) var(--padding-template-x-axis);
    width: 100%;
    z-index: 2000;

    .logo {
        /*per al menu movil*/
        z-index: 1000;

        img {
            height: clamp(var(--mobile-logo-height), 1.662vw + 3.0035rem, var(--logo-height));
        }
    }

    .nav-links a {
        font-size: 1.125rem;
        margin-left: 1.5rem;
        text-decoration: none;
        color: var(--text-color);
        font-weight: 400;
        transition: color 0.3s;
        &:hover,
        &:hover *,
        &:focus,
        &:focus *, &.active {
            color: var(--accent-color);
        }
    }

    .languages-links {
        position: absolute;
        top: calc(var(--padding-template-y-axis) * .5);
        transform: translateY(-50%);
        right: var(--padding-template-x-axis);
        display: flex;
        padding: 0;
        margin: 0;
        color: white;
        list-style-type: none;
        font-size: 0.75rem;
        font-weight: 400;
        gap: 1rem;
        li {
            a {
                color: inherit;
                text-decoration: none;
                &.active{
                    color: var(--accent-color);
                    font-weight: 600;
                }
            }
        }
    }
    
    @media (max-width: 767px) {
        .nav-links {
            display: none;
            position: static;
            width: auto;
            height: auto;
            transform: none;
            box-shadow: none;
        }
        .languages-links {
            display: none;
        }
    }

    @media (max-width: 600px){
        padding: var(--mobile-padding-page-wrappercontent-top) var(--mobile-padding-page-wrappercontent-lateral);
    }
}