.page-header-wide__menu__wrapper {
    --alignment-horizontal: flex-end;
    --flex-grow: 1;
    --min-height: 3rem;
}

.page-header-wide__menu__link {
    --color-background: transparent;
    --color-background__active: transparent;
    --color-background__hover: transparent;

    --width-border-horizontal-small: var(--root-border-width);
    --color-border-horizontal-small: transparent;
    --color-border-vertical-small__interactive: var(--root-color--primary);
    --color-border-vertical-small__active: var(--root-color--primary);
    --color-icon-arrow-small: currentColor;

    --width-border-vertical-wide: var(--root-border-width);
    --color-border-vertical-wide: transparent; /* Border left/right whole block */
    --color-border-horizontal-wide: var(--root-color--primary);
    --color-border-horizontal-wide__active: var(--root-color--primary);
    --condition-border-horizontal-position__interactive: 0; /* -1 = top, 0 = none, 1 = bottom */
    --condition-border-vertical__visibility: 0; /* 1 = visible, 0 = not visible */

    --flex-grow: 0;

    --font-family: var(--root-font-family--primary);
    --font-size: 1rem;
    --font-style: normal;
    --font-weight: var(--root-font-weight--bold);
    --line-height: normal;

    --color-text: var(--root-color--primary);
    --color-text__active: var(--root-color--secondary);
    --color-text__hover: var(--root-color--secondary);

    --padding-horizontal: .75em;
}

.page-header-wide__submenu {
    --color-background: var(--root-color--white);
}

.page-header-wide__submenu__link-parent {
    --font-family: var(--root-font-family--primary);
    --font-size: 1.1875rem;
    --font-style: normal;
    --font-weight: var(--root-font-weight--bold);
    --line-height: 1.5;

    --color-text: var(--root-color--primary);
    --color-text__active: var(--root-color--secondary);
    --color-text__hover: var(--root-color--secondary);
}

@media (min-width: 62rem) {
    .page-header-wide__submenu__link-parent {
        --font-size: 1.3125rem;
    }
}

.page-header-wide__submenu__link {
    --font-family: var(--root-font-family--primary);
    --font-size: 1rem;
    --font-style: normal;
    --font-weight: var(--root-font-weight--light);
    --line-height: 1.5;

    --color-text: var(--root-color--primary);
    --color-text__active: var(--root-color--primary);
    --color-text__hover: var(--root-color--primary);
}

@media (min-width: 62rem) {
    .page-header-wide__submenu__link {
        --font-size: 1.125rem;
    }
}

.page-header-wide__submenu__back {
    --font-family: var(--root-font-family--primary);
    --font-size: 1rem;
    --font-style: normal;
    --font-weight: var(--root-font-weight--light);
    --line-height: 1.5;

    --color-text: var(--root-color--primary);
    --color-text__active: var(--root-color--primary);
    --color-text__hover: var(--root-color--primary);
}

.page-header-wide__menu__wrapper {
    display: flex;
}

@media (max-width: 61.999rem) {
    .page-header-wide__menu {
        position: absolute;
        right: 0;
        left: 0;
        top: 0;
        display: block;
        transition: .1s ease;
        visibility: hidden;
        opacity: 0;
    }

    .page-header-wide__menu__wrapper {
        padding: var(--height) 1rem 1rem 1rem;
        position: relative;
        z-index: 1;
        flex-direction: column;
        width: 100%;
        max-height: 100dvh;
        transition: translate .2s ease;
        transform-origin: top center;
        translate: 0 -20px;
    }

    .page-header-wide__menu::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 100dvh;
        z-index: 1;
        background: rgba(0, 0, 0, .35);
    }

    .page-header-wide__menu.active {
        visibility: visible;
        opacity: 1;
        transition: .2s ease;
    }

    .page-header-wide__menu.active .page-header-wide__menu__wrapper {
        translate: 0;
        transition: translate .2s ease;
    }

    .page-header-wide__menu.active.submenu-active .page-header-wide__menu__wrapper>.page-header-wide__menu__link {
        visibility: hidden;
    }
}

@media (min-width: 62rem) {
    .page-header-wide__menu {
        display: flex;
        align-items: center;
        flex-grow: 1;
        opacity: 1;
    }

    .page-header-wide__menu__wrapper {
        align-items: stretch;
    }
}

.page-header__button-menu {
    justify-content: var(--alignment-horizontal, flex-end);
}

@media (max-width: 61.999rem) {
    .page-header-wide__menu__wrapper {
        background-color: var(--color-background, #fff);
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 4px 16px 0 rgba(0, 0, 0, 0.05);
    }
}

@media (min-width: 62rem) {
    .page-header-wide__menu__wrapper {
        justify-content: var(--alignment-horizontal, flex-end);
        flex-grow: var(--flex-grow, 1);
        min-height: var(--min-height, 3rem);
    }
}