.menu-item.active {
    z-index: 100;
}

.menu-item .menu-content {
    transition: all 0.75s ease;
}
.top-level-item {
font-family: Roboto;
font-style: normal;
font-weight: 500;
    color: white !important;
    padding-bottom: 30px;
padding-top: 30px;
}

.top-level-item::after{
    content:"";
    transition: all 300ms ease;
    height: 2px;
    position: relative;
    background-color: #E1FE64;
    display: block;
    bottom: -5px;
    width: 0;
}
.top-level-item:hover::after{
    width: calc(100%);
}

.no-chevron:hover::after{
    width: 100% !important;
}

.menu-content a.wp-block-navigation-item__content {
    position: relative;
    width: 100%;
}

.menu-item ul.wp-block-navigation__container {
    gap: 0 !important;
    width: 100% !important;
}
.menu-item .wp-block-navigation__container li {
    height: 48px !important;
    display: flex;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
    font-weight: 600;
}

.menu-item .wp-block-navigation__container li:before {
    position: absolute;
    content: "";
    bottom: 0;
    right: 0;
    height: 1px;
    width: 100%;
    background-color: #a0a0a0;
}

@media screen and (max-width: 1279px) {
    .menu-item:before {
        position: absolute;
        content: "";
        bottom: 0;
        right: 0;
        height: 1px;
        width: 100%;
        background-color: #a0a0a0;
    }

    .menu-item > * {
        width: 100%;
    }
    header .header-btn {
        display: none !important;
    }

    .menu-item .back-btn-container {
        padding: var(--wp--style--root--padding-right);
    }
    .menu-item .back-btn {
        position: relative;
        background-color: transparent;
        color: #686E72 !important;
        border: 0;
        font-size: clamp(0.875rem, 0.625rem + 0.5vw, 1.125rem);
        padding-left: 30px;
        font-size: 18px;
    }

    .menu-item .back-btn:after {
        left: 0;
        top: 4px;
        width: 20px !important;
        height: 20px !important;
        margin-right: 10px;
    }
    .menu-item .menu-content {
        transform: translateX(100%);
    }
    .menu-item
        .menu-content
        > div:not(.back-btn-container, .top-level-item-mobile-link) {
        height: calc(100svh - (var(--header-height) + 70px));
        padding-top: var(--wp--style--root--padding-right);
        padding-bottom: var(--wp--style--root--padding-right);
        margin-bottom: 2rem;
        position: relative;
        z-index: 5;
        overflow-y: scroll;
    }
    .menu-item.active .menu-content {
        transform: translateY(0);
    }
    .menu-content {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .menu-item {
        position: relative;
        padding: 0;
    }

    .menu-item > .top-level-item {
        display: flex;
        padding-bottom: var(--wp--style--root--padding-right);
        align-items: flex-end;
        position: relative;

    }

    .menu .menu-item > .is-dropdown:after {
        transform: rotate(-90deg);
        right: 0;
        bottom: calc(50% + 4px);
    }

    .menu .wp-block-column {
        padding: 0 !important;
    }

    .menu .menu-item > .is-dropdown:after,
    .menu-item .back-btn:after {
        height: 8px;
        width: 14px;
        position: absolute;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Layer_1' version='1.1' viewBox='0 0 9.414 5.207'%3E%3Cpath fill='none' stroke='%23838a8d' stroke-linecap='square' stroke-linejoin='round' d='m.7.7 4 4 4-4'/%3E%3C/svg%3E");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        content: "";
    }

    .menu-item:last-child > .is-dropdown {
        border-bottom: 0;
        padding-bottom: 0;
    }

    .menu-content a.wp-block-navigation-item__content:after {
        background-position: center;
    }
    .menu-item h2 {
        margin-top: var(--wp--preset--spacing--sm) !important;
    }

    .menu .has-mobile-overflow {
        overflow-y: scroll;
    }
}

@media screen and (max-width: 780px) {
    .menu .wp-block-cover {
        /* aspect-ratio: 1 / 1 !important; */
        height: calc(
            100vw - (var(--wp--style--root--padding-right) * 2)
        ) !important;
        min-height: unset !important;
    }
}
@media screen and (max-width: 1280px) {
    .menu .wp-block-cover {
        aspect-ratio: unset !important;
        height: 100% !important;
        min-height: 300px !important;
    }
}
@media screen and (min-width: 1280px) {
    .menu-item .menu-content {
        opacity: 0;
        transform: translateY(-100%);
        transition: all 0.75s ease;
    }
    .menu-item.active .menu-content {
        opacity: 1;
        transform: translateY(0);
    }

    .menu-item {
      
        display: flex;
        align-items: center;
    }

    .menu-item .is-dropdown {

    }
    .menu-item .top-level-item {
        position: relative;
        transition: color 0.75s ease;
    }

    .menu-item .is-dropdown:before {

    }

    .menu-item .is-dropdown:before {
        transition:
            transform 0.75s ease,
            background-image 0.3s ease;
    }

    /* Safari override */
    @supports (-webkit-touch-callout: none) {
        .menu-item .is-dropdown:before {
            transition: transform 0.75s ease; /* disable bg-image fade in Safari */
        }
    }
    .menu-item.active .is-dropdown:before {

    }

    body:not(.home) .menu-item .is-dropdown:before,
    body.home header.active .menu-item .is-dropdown:before {
    }

    .menu-item.active .top-level-item,
    .menu-item:hover .top-level-item {
        color: white !important;
    }

    .menu-content a.wp-block-navigation-item__content:hover:after {
        opacity: 1;
        background-position: 0% center;
    }

    .menu-content a.wp-block-navigation-item__content:after {
        opacity: 0;
        transition: all 0.25s ease;
        background-position: -100% center;
        transform-origin: left;
    }
    .menu-content .wp-block-navigation-item:hover a {
        color: white;
        position: relative;
        z-index: 1;
        transition: all 0.25s ease;
        transform: translateX(15px);
    }
    .menu-content .wp-block-navigation-item:after {
        content: "";
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        left: 0;
        background: white;
        z-index: 0;
        transform: scaleY(0);
        transition: all 0.25s ease;
        transform-origin: bottom;
    }

    .menu-content .wp-block-navigation-item:hover:after {
        transform: scaleY(1);
    }

    .menu-item
        .wp-block-navigation__container.overflow-border
        .wp-block-navigation-item:after {
        width: calc(100% - 15px);
    }

    .menu-item .wp-block-navigation__container.overflow-border li:before {
        width: 100vw;
    }
}

@media screen and (max-width: 1280px) {
    .menu-content .wp-block-columns {
        flex-direction: column !important;
    }
}