#header-general {
    .header-content {
        position: relative;
        backdrop-filter: blur(8px);
    }
}

.menu-header {
    .menu-item {
        a {
            color: var(--c-white) !important;
            position: relative;
            transition: var(--all-transition);
            letter-spacing: var(--letter-spacing-tit);
            font-weight: 400;
            text-transform: uppercase;

            &::after {
                position: absolute;
                content: "";
                width: 0%;
                height: 2px;
                bottom: 0;
                left: 0;
                background-color: var(--c-beige-dark);
                transition: var(--all-transition);
            }

            &:hover {
                background-color: var(--c-azul-opalance) !important;
                transition: var(--all-transition);

                &::after {
                    width: 100%;
                    transition: var(--all-transition);
                }
            }
        }

        &.menu-contacto {
            a {
                background-color: var(--c-secondary) !important;
                border-radius: 50px;
                &::after {
                    opacity: 1;
                    width: 100%;
                    background-color: var(--c-white);
                }
            }
        }
    }
    .sub-menu {
        .menu-item {
            min-width: 200px;
        }
    }
}

#menu_general {
    .link-menu {
        text-transform: uppercase;
        color: var(--color-blanco) !important;
    }
}


/* ---------- RESPONSIVE ---------- */

@media screen and (max-width: 780px) {
    #masthead {
        .inside-header {
            flex-direction: row;
            padding: 20px !important;

            #sticky-navigation {
                width: 90% !important;
                top: 20px !important;
                left: 10px !important;
                right: auto !important;

                .navigation-branding img {
                    height: 40px;
                    padding: 10px 20px;
                }
            }
        }

        .header-image {
            width: 200px;
        }

        .main-navigation {
            .menu-item a {
                color: var(--color-negro) !important;
            }
        }
    }
}