/* Site header: two pinned tiers (.site-header itself is defined in research.css).
   Tier 1 (navy): investment product categories (parent buttons) with language and account.
   Tier 2 (white): wordmark, the research destinations of the selected category, and the Resources menu.
   Loaded after research.css and research-sections.css; builds on their tokens (--ink, --muted, --line,
   --raised, --mint) and the shared .site-utility / .site-dropdown / .site-logo / .site-research-* rules. */

html {
    scroll-padding-top: 128px
}

/* offsetParent of the scrolling rows, used to centre the selected item */
.site-parents-nav,
.site-children-nav {
    position: relative
}

/* ---------- Tier 1: product categories ---------- */
.site-header .site-assets .site-utility-row {
    min-height: 46px;
    gap: 16px
}

.site-parents-nav {
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    /* scroll shadows: edge fades appear only on the side that still has hidden items */
    background:
        linear-gradient(to right, #0e1b33 30%, #0e1b3300) left center / 36px 100% no-repeat local,
        linear-gradient(to left, #0e1b33 30%, #0e1b3300) right center / 36px 100% no-repeat local,
        radial-gradient(farthest-side at 0 50%, #ffffff40, #ffffff00) left center / 14px 100% no-repeat scroll,
        radial-gradient(farthest-side at 100% 50%, #ffffff40, #ffffff00) right center / 14px 100% no-repeat scroll
}

.site-parents-nav::-webkit-scrollbar {
    display: none
}

.site-parents {
    display: flex;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none
}

.site-parent {
    display: flex;
    align-items: center;
    height: 46px;
    padding: 0 13px;
    background: transparent;
    color: #c9d3e6;
    font: 600 14px/1 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    text-decoration: none;
    white-space: nowrap
}

.site-parent:hover {
    color: #ffffff;
    background: #ffffff14
}

.site-parent[aria-current] {
    color: #ffffff;
    box-shadow: inset 0 -3px 0 #c8102e
}

.site-header .site-parent:focus-visible,
.site-header .site-assets .site-dropdown>summary:focus-visible,
.site-header .site-assets .site-login:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: -3px
}

.site-header .site-assets .site-utility-tools {
    flex: none;
    gap: 6px
}

.site-header .site-assets .site-dropdown>summary,
.site-header .site-assets .site-login {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 8px;
    white-space: nowrap
}

.site-header .site-assets .site-login svg {
    width: 14px;
    height: 14px
}

/* A long account name must not push the last category out of the tier */
.site-header .site-assets .site-tool-label {
    max-width: 6rem;
    overflow: hidden;
    text-overflow: ellipsis
}

/* ---------- Tier 2: selected category and Resources ---------- */
.site-subnav-row {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 56px;
    position: relative
}

.site-subnav-row .site-logo {
    flex: none
}

.site-children-nav {
    flex: 1;
    min-width: 0;
    align-self: stretch;
    overflow-x: auto;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    background:
        linear-gradient(to right, #ffffff 30%, #ffffff00) left center / 36px 100% no-repeat local,
        linear-gradient(to left, #ffffff 30%, #ffffff00) right center / 36px 100% no-repeat local,
        radial-gradient(farthest-side at 0 50%, #0e1b3333, #0e1b3300) left center / 14px 100% no-repeat scroll,
        radial-gradient(farthest-side at 100% 50%, #0e1b3333, #0e1b3300) right center / 14px 100% no-repeat scroll
}

.site-children-nav::-webkit-scrollbar {
    display: none
}

.site-children {
    display: flex;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none
}

.site-children a {
    display: flex;
    align-items: center;
    height: 100%;
    min-height: 44px;
    padding: 0 13px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: inset 0 -2px 0 transparent
}

.site-children a:hover {
    color: var(--ink);
    background: var(--raised)
}

.site-children a[aria-current] {
    color: var(--ink);
    font-weight: 600;
    box-shadow: inset 0 -2px 0 var(--mint)
}

.site-header .site-resources {
    flex: none
}

.site-header .site-resources>summary {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 4px;
    color: var(--ink);
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer
}

.site-header .site-resources>summary:hover,
.site-header .site-resources[open]>summary {
    background: var(--raised)
}

.site-header .site-resources.is-current>summary {
    border-color: var(--ink)
}

.site-header .site-resources>summary svg {
    transition: transform .15s ease
}

.site-header .site-resources[open]>summary svg {
    transform: rotate(180deg)
}

.site-header .site-resources .site-dropdown-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: auto;
    z-index: 60;
    width: 320px;
    min-width: 0;
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 150px);
    margin: 0;
    padding: 8px 0;
    overflow-y: auto;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface);
    box-shadow: 0 12px 32px #172d4914
}

.site-header .site-cta {
    display: none;
    flex: none;
    min-height: 44px;
    padding: 10px 18px;
    background: #0e1b33;
    border-color: #0e1b33;
    font-size: 14px;
    white-space: nowrap
}

.site-header .site-cta:hover {
    background: #22345a;
    border-color: #22345a
}

@media (min-width: 1200px) {
    .site-header .site-cta {
        display: inline-flex
    }
}

/* ---------- Narrow screens: both tiers stay visible; categories scroll sideways ---------- */
@media (max-width: 1000px) {
    /* icon-only language / account in the navy tier; names stay available to assistive technology */
    .site-tool-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap
    }

    .site-header .site-assets .site-dropdown>summary,
    .site-header .site-assets .site-login {
        padding: 0 10px
    }

    .site-header .site-assets .site-dropdown>summary svg:last-child {
        display: none
    }

    .site-header .site-assets .site-dropdown-panel {
        min-width: 160px
    }

    .site-subnav-row {
        flex-wrap: wrap;
        gap: 0 12px;
        padding-top: 4px;
        min-height: 0
    }

    .site-subnav-row .site-logo {
        order: 1;
        font-size: 24px
    }

    .site-header .site-resources {
        order: 2;
        margin-left: auto
    }

    .site-children-nav {
        order: 3;
        flex: 0 0 100%;
        align-self: auto;
        min-height: 44px
    }

    .site-children {
        min-height: 44px
    }

    html {
        scroll-padding-top: 170px
    }
}