/* Header assembled from website building blocks ("global" variant).
 *
 * The navigation content block ships its own sticky positioning, background and
 * height. Inside a tenant header that is one layer too many: the header itself
 * is already fixed and already carries the brand background. These rules hand
 * the element back into the tenant's own rhythm so the logo keeps the same
 * breathing room it has in the built header (96px bar, 72px logo, 12px above
 * and below). Unlayered on purpose — layered rules would lose against the
 * content block's own unlayered CSS.
 */

.ce-header--global .header__container {
    min-height: 96px;
    align-items: center;
    gap: 1.5rem;
}

.ce-header--global .ce-header__global-nav {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end;
    min-width: 0;
}

.ce-header--global .min-navmain {
    position: static;
    flex: 1 1 auto;
    background: none;
    box-shadow: none;
    border: 0;
    min-width: 0;
}

/* The element centres its own 1400px container with side padding. Inside a
 * header that already has a container and a logo beside it, that padding is
 * what pushes the menu over the logo on the tenants with a wide wordmark.
 * min-width:0 lets the flex item shrink instead of overflowing to the left. */
.ce-header--global .min-navmain__container {
    max-width: none;
    margin-inline: 0;
    padding-inline: 0;
    min-height: 0;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.ce-header--global .header__logo,
.ce-header--global .ce-header__logo--global {
    flex: 0 0 auto;
}

.ce-header--global .ce-header__logo--global img,
.ce-header--global .ce-header__logo--global picture {
    display: block;
    max-height: 72px;
    width: auto;
}

/* The menu list is a non-wrapping flex row: beside a wide wordmark it simply
 * runs over the logo. It gets permission to shrink and, as a last resort, to
 * wrap onto a second line rather than overlap. */
.ce-header--global .min-navmain__nav {
    min-width: 0;
    width: 100%;
}

.ce-header--global .min-nav__list--level-1 {
    flex-wrap: wrap;
    justify-content: flex-end;
    min-width: 0;
    column-gap: 1rem;
}