.menu-container {
    display: flex;
    align-items: flex-start;
    gap: var(--gap-gap-md, 12px);
    align-self: stretch;
    padding: 0;
    max-width: var(--device-Breakpoint);
    width: -webkit-fill-available;
    flex-direction: row !important;
    height: 64px;

}

.gu-menu {
    display: flex;
    align-items: center;
    gap: var(--gap-gap-lg, 16px);
}

.gu-menu .nav-item {
    position: relative;
    display: flex;
    height: 64px;
    min-height: 48px;
    padding: var(--padding-padding-sm, 8px) 0;
    justify-content: center;
    align-items: center;
    gap: var(--gap-gap-xs, 4px);
}

.gu-menu .nav-item .nav-link {
    padding: 0;
    color: var(--surface-on-banner-surface, #FFF);
    text-align: center;
    font-family: var(--font-family, Dubai);
    font-size: var(--font-size-body, 16px);
    font-weight: 400;
    line-height: var(--line-height-body, 24px);
}


.is-desktop .gu-menu .nav-item:is(.active, :hover) .nav-link {
    color: var(--surface-on-banner-surface-hovered, #9D3F49);
}

.is-desktop .gu-menu .nav-item:is(.active, :hover)::after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    inset-block-end: 0;
    height: 4px;
    border-radius: 8px 8px 0 0;
    background: var(--surface-on-banner-surface-hovered, #FFF);
}




.is-desktop .nav-item.navbar-custom.dropdown:hover>.dropdown-menu {
    width: 384px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 16px;
    align-self: stretch;
    border-radius: 10px;
    background: #FFF;

    /* elevation/2 */
    box-shadow: 0 4px 12px 0 var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
}

body.is-desktop .nav-item.navbar-custom.dropdown:hover>.dropdown-menu {
    display: flex;
}

.nav-item.dropdown>.dropdown-menu>li {
    display: flex;
    min-height: 48px;
    padding: 0 var(--padding-padding-sm, 8px);
    align-items: center;
    align-self: stretch;
}

.nav-item.navbar-custom.dropdown>.dropdown-menu>li>.dropdown-item {
    display: flex;
    padding: 8px 0;
    gap: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    flex: 1 0 0;
    color: var(--surface-on-surface, #000) !important;

    /* Body/Regular */
    font-family: var(--font-family, Dubai);
    font-size: var(--font-size-body, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body, 24px);
    /* 150% */
}


.is-desktop .nav-item.navbar-custom.dropdown>.dropdown-menu>li:is(.active, :hover, :active)>.dropdown-item,
.is-desktop .nav-item.navbar-custom.dropdown>.dropdown-menu>li:is(.active, :hover, :active)>.dropdown-item:is(.active, :hover, :active),
.is-desktop .nav-item.navbar-custom.dropdown>.dropdown-menu>li>.dropdown-item:is(.active, :hover, :active) {
    background-color: var(--surface-surface-container-lowest, #FCF1F1) !important;
    color: var(--primary-primary, #9D3F49) !important;
}


.right-menu {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--gap-gap-md, 12px);
    height: 64px;
    order: 2;
}

.navbar-header {
    display: flex;
    align-items: center;
    gap: 24px;
    align-self: stretch;
    height: 64px;
}

.GU-Search {
    display: flex;
    height: 40px;
    padding: var(--padding-padding-sm, 8px) var(--padding-padding-md, 12px) var(--padding-padding-sm, 8px) var(--padding-padding-sm, 8px);
    align-items: center;
    gap: var(--gap-gap-xs, 4px);
    border-radius: var(--radius-pill, 999px);
    background: var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
}

.GU-Search .search-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
}

.search-only {
    color: var(--surface-surface, #FFF);

    /* Caption/Regular */
    font-family: var(--font-family, Dubai);
    font-size: var(--font-size-caption, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-caption, 20px);
    /* 142.857% */
    letter-spacing: 0.14px;
}

.GU-Accessibility {
    display: flex;
    width: 40px;
    height: 40px;
    padding: var(--8px, 8px);
    justify-content: center;
    align-items: center;
    border-radius: var(--radius-pill, 999px);
    background: var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
}

.GU-Accessibility .accessibility-icon {
    display: flex;
    width: 24px;
    height: 24px;
    justify-content: center;
    align-items: center;
}

.GU-Language {
    display: flex;
    /*width: 70px;*/
    height: 40px;
    align-items: center;
    background: var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
    border-radius: var(--radius-pill, 999px);
}

.GU-Language .GU-Language-Container {
    display: flex;
    padding: var(--padding-padding-sm, 8px) var(--padding-padding-md, 12px);
    justify-content: center;
    align-items: center;
    gap: var(--gap-gap-xs, 4px);
    flex: 1 0 0;
    align-self: stretch;
    border-radius: var(--26px, 26px);
    color: var(--surface-surface, #FFF);

    /* Body/Regular */
    font-family: var(--font-family, Dubai);
    font-size: var(--font-size-body, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body, 24px);
    /* 150% */
}

.GU-Login-Button {
    display: flex;
    height: 40px;
    width: max-content;
    padding: var(--padding-padding-sm, 8px) var(--padding-padding-md, 12px) var(--padding-padding-sm, 8px) var(--padding-padding-sm, 8px);
    align-items: center;
    gap: var(--gap-gap-xs, 4px);
    border-radius: var(--radius-pill, 999px);
    background: var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
}

.GU-Login-Button .GU-Login-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
}



.scroll-move .right-menu .GU-Search,
.scroll-move .right-menu .GU-Accessibility,
.scroll-move .right-menu .GU-Language,
.scroll-move .right-menu .GU-Login-Button,
.menu-open .quick-link-mobile .GU-Search,
.menu-open .quick-link-mobile .GU-Accessibility,
.menu-open .quick-link-mobile .GU-Language,
.menu-open .quick-link-mobile .GU-Login-Button {
    background: var(--surface-surface-dim, #F5F3F7);
}

.scroll-move .right-menu .GU-Search svg path,
.scroll-move .right-menu .GU-Accessibility svg path,
.scroll-move .right-menu .GU-Language svg path,
.scroll-move .right-menu .GU-Login-Button svg path,
.menu-open .quick-link-mobile .GU-Search svg path,
.menu-open .quick-link-mobile .GU-Accessibility svg path,
.menu-open .quick-link-mobile .GU-Language svg path,
.menu-open .quick-link-mobile .GU-Login-Button svg path {
    fill: var(--surface-on-surface, #000);
}

.scroll-move .right-menu .GU-Search span,
.scroll-move .right-menu .GU-Language span,
.scroll-move .right-menu .GU-Login-Button span,
.menu-open .quick-link-mobile .GU-Search span,
.menu-open .quick-link-mobile .GU-Language span,
.menu-open .quick-link-mobile .GU-Login-Button span {
    color: var(--surface-on-surface, #000);

}


.is-desktop .navbar-nav .dropdown-submenu .dropdown-menu.show,
.navbar-nav>.nav-item.dropdown>.dropdown-menu.show {
    display: none;
}

/*@lg desktop*/
@media (min-width: 769px) and (max-width: 1024px) {
    /*.navbar-expand-lg .navbar-nav {
        flex-direction: row;
    }
    */
}

/*md */
@media (min-width: 641px) and (max-width: 768px) {}

@media (max-width: 1024px) {

    .grfda-lead-element {
        display: flex;
        width: 375px;
        padding: 88px 32px 16px 32px;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        flex-shrink: 0;
        background: var(--surface-surface, #FFF);

        overflow-y: auto;
        height: 100%;
        position: fixed;
        inset-block-start: 0;
        inset-inline-start: 0;
        /* transform: translate(-100%, 0);
        transition: transform 200ms ease 0s;*/
        z-index: 1;

        /* elevation/2 */
        box-shadow: 0 4px 12px 0 var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
    }

    .menu-close-btn {
        display: flex;
        width: 40px;
        height: 40px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        position: absolute !important;
        inset-inline-end: 24px !important;
        inset-block-start: 16px !important;
    }

    .menu-close-icon-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 100px;
    }

    .menu-close-icon-wrapper svg {
        display: flex;
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
    }

    .gu-menu {
        flex-direction: column !important;
        margin-inline-end: unset !important;
        align-items: flex-start;
        align-self: stretch;
        gap: unset;
        height: 100vh;
        flex-wrap: unset;
    }


    .navbar-expand-lg .navbar-toggler {
        display: flex;
    }

    .mobile-menu-title {
        display: flex;
        height: 40px;
        padding: 8px 0;
        align-items: center;
        align-self: stretch;
        color: var(--surface-on-surface, #000);

        /* H6/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-h6, 20px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-h6, 28px);
        /* 140% */

        background-color: unset;
        position: relative;

        width: -webkit-fill-available;
        margin: unset;

    }

    .gu-menu-item {
        display: flex;
        min-height: 40px;
        align-items: flex-start;
        align-self: stretch;
        flex-direction: column;
    }

    .gu-menu .nav-item {
        height: auto;
        min-height: 40px;
        align-items: flex-start;
        align-self: stretch;
        padding: 0;
        gap: 0;

        border-block-end: 1px solid var(--surface-outline, #E4E2E6);

    }

    .gu-menu-item .nav-link {
        display: flex;
        min-height: 48px;
        width: -webkit-fill-available;

        align-items: center;
        gap: 8px;
        flex: 1 0 0;
        padding: 0 8px !important;

        color: var(--surface-on-surface, #000);

        /* Body/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-body, 16px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-body, 24px);
        /* 150% */
    }



    .gu-menu .nav-item:is(.active) .nav-link,
    .navbar-nav>.nav-item>.nav-link.show {


        background: var(--primary-primary-variant, #FFEDEC);
        border-block-end: 2px solid var(--primary-primary, #9D3F49);
        ;
        color: var(--surface-on-surface, #000);

        color: var(--surface-on-surface, #000);

        /* Body/Bold */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-body, 16px);
        font-style: normal;
        font-weight: 700;
        line-height: var(--line-height-body, 24px);
        /* 150% */
    }

    .gu-menu .nav-item:is(.active)::after {
        content: unset;
    }

    .navbar-nav .dropdown-submenu .dropdown-menu.show,
    .navbar-nav>.nav-item.dropdown>.dropdown-menu.show {
        display: flex;
    }

    .navbar-nav>.nav-item.dropdown>.dropdown-menu,
    .nav-item.navbar-custom.dropdown>.dropdown-menu {
        flex-direction: column;
        width: 100%;
        margin: 0;
        padding: 0;
        border: unset;
        box-shadow: none;
        min-width: inherit;
        position: static;
        inset: auto;
        transform: none;
        gap: 0;
    }

    .navbar-nav>.nav-item.dropdown>.dropdown-menu>li {
        display: flex;
        min-height: 40px;
        padding: 0;
        padding-inline-start: 16px;
        align-items: flex-start;
        align-self: stretch;

        background: var(--surface-surface-container-lowest, #FCF1F1);
        border-block-end: 1px solid var(--surface-surface, #FFF);
        ;
    }


    .navbar-nav>.nav-item.dropdown>.dropdown-menu>li>a {
        display: flex;
        min-height: 48px;
        gap: 8px;
        flex: 1 0 0;
        height: 40px;
        align-items: flex-start;

        background: var(--surface-surface-container-lowest, #FCF1F1);

        color: var(--surface-on-surface, #000) !important;

        /* Body/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-body, 16px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-body, 24px);
        /* 150% */
    }

    .navbar-nav>.nav-item.dropdown.active .nav-link:after,
    .navbar-nav>.nav-item.dropdown>.nav-link:after {
        content: "";
        position: absolute;
        width: 8px;
        height: 8px;
        border: solid var(--text-body);
        border-width: 0 3px 3px 0;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        inset-inline-end: 5px;
        display: inline-block;
        background-color: transparent;
        border-radius: 0;
    }

    .navbar-nav>.nav-item.dropdown .dropdown-menu li.dropdown-submenu>a.show:before,
    .navbar-nav>.nav-item.dropdown.active .nav-link.show:after,
    .navbar-nav>.nav-item.dropdown>.nav-link.show:after {
        /*border-width: 0 0 3px 3px;*/
        transform: rotate(225deg);
        -webkit-transform: rotate(225deg);
    }

    .gu-menu .nav-item .nav-link {
        color: var(--surface-on-surface, #000);

        /* Body/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-body, 16px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-body, 24px);
        /* 150% */
    }


    .nav-item.navbar-custom.dropdown>.dropdown-menu>li:is(.active, :active)>.dropdown-item,
    .nav-item.navbar-custom.dropdown>.dropdown-menu>li:is(.active, :active)>.dropdown-item:is(.active, :active),
    .nav-item.navbar-custom.dropdown>.dropdown-menu>li>.dropdown-item:is(.active, :active) {
        border-block-end: 2px solid var(--primary-primary, #9D3F49);
    }

    .collapse:not(.show) {
        display: none !important;
    }
}


@media (max-width: 640px) {


    .grfda-lead-element {
        padding: 16px 32px;
    }


    .gdrfa-trail-element {
        height: 80px;
        justify-content: space-between;
        align-items: center;
        flex-shrink: 0;
        align-self: stretch;
        width: -webkit-fill-available;
        max-width: var(--device-Breakpoint);
        flex-direction: row;
    }

    .navbar-header {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }

    .navbar-menu {
        display: flex;
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
        border: unset;
        padding: 0;
        font-size: unset;
        line-height: unset;
        background-color: transparent;
        border-radius: unset;
    }

    .menu-icon {
        width: 24px;
        height: 24px;
        flex-shrink: 0;
    }

    .menu-icon svg {
        width: 18px;
        height: 12px;
        flex-shrink: 0;
    }


    .right-menu {
        height: 40px;
    }

    .gu-search-button,
    .gu-login-button {
        display: flex;
        height: 40px;
        padding: var(--padding-padding-sm, 8px) var(--padding-padding-md, 8px) var(--padding-padding-sm, 8px) var(--padding-padding-sm, 8px);
        align-items: center;
        gap: var(--gap-gap-xs, 4px);
        border-radius: var(--radius-pill, 999px);
    }

    .search-icon-wrapper,
    .login-icon-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 100px;
        background: transparent;
        padding: 0;
        border: unset;
        width: 24px;
        height: 24px;
    }


    .search-icon,
    .login-icon {
        display: flex;
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        padding: 0;
        inset-inline-end: unset;
        inset-block-end: unset;

    }

    .search-icon svg {
        width: 17.49px;
        height: 17.49px;
        flex-shrink: 0;
    }

    .login-icon svg {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
        aspect-ratio: 1/1;
    }

    .GU-HamburgerMenu {
        display: flex;
        width: 375px;
        height: 812px;
        padding: 16px 32px;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        flex-shrink: 0;
        background: var(--surface-surface, #FFF);

        /* elevation/2 */
        box-shadow: 0 4px 12px 0 var(--opacity-on-surface-opacity12, rgba(0, 0, 0, 0.12));
    }

    .Menus-MenuItem-Group {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        align-self: stretch;
    }

    .Menus-MenuItem-Header {
        display: flex;
        height: 40px;
        padding: 8px 0;
        align-items: center;
        align-self: stretch;
        flex: 1 0 0;
        color: var(--surface-on-surface, #000);

        /* H6/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-h6, 20px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-h6, 28px);
        /* 140% */
    }

    .Menus-MenuItem {
        min-height: 40px;
        align-items: flex-start;
        align-self: stretch;
    }

    .GU-QuickLinks {
        display: flex;
        width: 375px;
        padding: 8px 24px 32px 24px;
        flex-direction: column;
        align-items: center;
        gap: 16px;
        position: absolute;
        inset-block-end: 0;
    }

    .quick-link-mobile {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 16px;
    }

    .GU-Accessibility-Button {
        display: flex;
        width: 40px;
        height: 40px;
        padding: var(--8px, 8px);
        justify-content: center;
        align-items: center;
        border-radius: var(--radius-pill, 999px);
        background: var(--surface-surface-dim, #F5F3F7);
    }

    .GU-quick-link-icon {
        display: flex;
        width: 24px;
        height: 24px;
        justify-content: center;
        align-items: center;
    }

    .GU-quick-link-icon svg {
        width: 24px;
        height: 24px;
        flex-shrink: 0;
    }

    .GU-quick-link-mobile-btn {
        display: flex;
        width: 70px;
        height: 40px;
        align-items: center;
    }

    .GU-quick-link-mobile-btn-container {
        display: flex;
        padding: var(--padding-padding-sm, 8px) var(--padding-padding-md, 12px);
        justify-content: center;
        align-items: center;
        gap: var(--gap-gap-xs, 4px);
        flex: 1 0 0;
        align-self: stretch;
        border-radius: var(--radius-pill, 999px);
        background: var(--surface-surface-dim, #F5F3F7);
        color: var(--surface-on-surface, #000);

        /* Body/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-body, 16px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-body, 24px);
        /* 150% */
    }

    .GU-quick-link-text {
        color: var(--surface-on-surface, #000);

        /* Caption/Regular */
        font-family: var(--font-family, Dubai);
        font-size: var(--font-size-caption, 14px);
        font-style: normal;
        font-weight: 400;
        line-height: var(--line-height-caption, 20px);
        /* 142.857% */
        letter-spacing: 0.14px;
    }

    .menu-container .navbar-collapse.collapse.show .navbar-toggler {
        z-index: 2;
    }

    .menu-container {
        width: auto;
    }

    .gdrfa-sm-quick-links {
        max-width: inherit;
        width: -webkit-fill-available;
        padding-block-start: 8px;
        padding-block-end: 16px;
        padding-inline: 0;
        flex-direction: column;
        align-items: center;
        gap: 16px;
        position: relative;
        bottom: 0;

        background: var(--surface-surface, #FFF);
    }

    .quick-link-mobile {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 16px;
    }

}