header {
    .site-logo {
        a {
            img {
                transition: all 0.3s ease-in-out;
            }

            &:hover {
                img {
                    opacity: 0.8;
                }
            }
        }
    }
    .menu-item {
        a {
            font-family: var(--f-general);
            font-weight: 600;
            font-size: 14px;
            letter-spacing: 2px;
            color: var(--c-primario);
            line-height: 1.5;
            transition: all 0.3s ease-in-out;

            &:hover {
                color: var(--c-gris-oscuro) !important;
            }
        }
    }

    .navigation-stick {
        .inside-navigation {
            max-width: 100%;
        }
    }
}

/*BARRA SUPERIOR */
.top-bar {
    aside {
        width: 100% !important;

        .barra-superior {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: var(--c-blanco);
            font-family: var(--f-general);
            font-size: 14px;

            .info-contacto {
                text-align: left;
                
                a {
                    text-decoration: none;
                }
            }

            .redes-sociales {
                display: flex;
                gap: 15px;
                justify-content: flex-end;
                align-items: center;

                a {
                    svg {
                        width: 20px;
                        height: 20px;
                        
                        path {
                            fill: var(--c-blanco);
                            transition: all 0.3s ease-in-out;
                        }
                    }

                    &:hover {
                        svg path {
                            fill: var(--c-gris-claro);
                        }
                    }
                }
            }
        }
    }

    @media screen and (max-width: 850px) {
        display: none;
    }
}

/* MENÚ MÓVIL*/
#generate-slideout-menu {
    .menu-item {
        a {
            font-family: var(--f-general);
            font-weight: 600;
            font-size: 14px;
            letter-spacing: 2px;
            color: var(--c-primario);
            line-height: 1.5;
            padding: 10px 20px;
            transition: all 0.3s ease-in-out;

            &:hover {
                color: var(--c-gris-oscuro) !important;
            }
        }
    }
}

#mobile-menu-control-wrapper {
    button {
        background-color: transparent;
    }
}

@media screen and (max-width: 1024px) {
    .site-logo {
        a {
            img {
                max-width: 200px;
            }
        }
    }
}