.pre-menu-banner {
    display: block;
    padding: 4px 0;

    li {
        list-style: none;
    }

    a {
        text-decoration: none;
        color: inherit;
    }
}

.menu {
    display: flex;
    align-items: center;
    list-style: none;

    .menu-item {
        &:hover {
            a {
                border-bottom-color: #fff;
            }
        }

        &.current-menu-item a:not([href^="/#"]),
        a.is-passed {
            border-bottom-color: #fff;
        }
    }

    a {
        color: #fff;
        text-decoration: none;
        padding: 14px 22px;
        font-size: 16px;
        font-weight: 500;

        &:not(.is-button) {
            border-bottom: 3px solid transparent;
            transition: border-color .3s;
        }

        &.is-button {
            display: block;
            background-color: var(--primary-color);
            padding: 10px 20px;
            border-radius: 14px;
            font-size: 15px;
            font-weight: 700;
            line-height: 1;
            text-transform: uppercase;
            text-align: center;
            max-width: 135px;
            margin-left: 15px;
        }
    }
}