/* Site header: colour states, core navigation skin, mobile drawer. */
.pb-header {
    --pb-header-fg: #000000;
    --pb-header-bg: #ffffff;
    --pb-header-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
    --pb-cta-bg: #193798;
    --pb-cta-bg-hover: #1A306A;
    --pb-cta-fg: #ffffff;
    --pb-logo-fg: #193798;
    color: var(--pb-header-fg);
    background: var(--pb-header-bg);
    box-shadow: var(--pb-header-shadow);
    font-family: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
}
/* Transparent over a dark hero (the hero block marks the page with .pb-overlay-hero) until scrolled. */
body:has(.pb-overlay-hero) .pb-header--overlay:not(.is-scrolled):not(.pb-header--preview) {
    --pb-header-fg: #ffffff;
    --pb-header-bg: transparent;
    --pb-header-shadow: none;
    --pb-cta-bg: #ffffff;
    --pb-cta-bg-hover: rgba(255,255,255,0.7);
    --pb-cta-fg: #000000;
    --pb-logo-fg: #ffffff;
}
.pb-header__logo { color: var(--pb-logo-fg); }
.pb-header__logo svg { display: block; height: 100%; width: auto; }
.pb-header__cta.pb-btn {
    background: var(--pb-cta-bg);
    color: var(--pb-cta-fg);
}
.pb-header__cta.pb-btn:hover { background: var(--pb-cta-bg-hover); }

/* Core navigation skin */
.pb-header .wp-block-navigation { font-size: 1rem; }
.pb-header .wp-block-navigation .wp-block-navigation__container { gap: 3rem; align-items: center; }
.pb-header .wp-block-navigation-item__content,
.pb-header .wp-block-navigation-submenu__toggle {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    color: inherit;
    text-decoration: none;
    padding: 0 0 4px;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    transition: border-color 0.2s;
}
.pb-header .wp-block-navigation-item__content:hover,
.pb-header .wp-block-navigation-submenu__toggle:hover { border-bottom-color: currentColor; }
/* Dropdowns */
.pb-header .wp-block-navigation .wp-block-navigation__submenu-container {
    background: #ffffff;
    color: #000000;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
    padding: 0.5rem 0;
    min-width: 280px;
    margin-top: 0.5rem;
}
.pb-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    display: block;
    padding: 0.75rem 1.5rem;
    font-weight: 400;
    color: #000000;
    border-bottom: 0;
    transition: color 0.2s, background-color 0.2s;
}
.pb-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
    color: #193798;
    background: #f3f4f6;
}

/* Hamburger: the design's own icon */
.pb-header .wp-block-navigation__responsive-container-open { color: inherit; padding: 0; }
.pb-header .wp-block-navigation__responsive-container-open svg { display: none; }
.pb-header .wp-block-navigation__responsive-container-open::before {
    content: "";
    display: block;
    width: 32px;
    height: 24px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 12' fill='none' stroke='%23000' preserveAspectRatio='none'%3E%3Cpath d='M17 6L10.9412 6L5.85087 1H0'/%3E%3Cpath d='M0 6L6.05882 6L11.1491 11H17'/%3E%3Cpath d='M17 1H10.5'/%3E%3Cpath d='M6.5 11H0'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 12' fill='none' stroke='%23000' preserveAspectRatio='none'%3E%3Cpath d='M17 6L10.9412 6L5.85087 1H0'/%3E%3Cpath d='M0 6L6.05882 6L11.1491 11H17'/%3E%3Cpath d='M17 1H10.5'/%3E%3Cpath d='M6.5 11H0'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

/* Mobile drawer: core's overlay container stays rendered off-canvas and slides in from the right (300ms
   ease-in-out, like the design), with the backdrop fading alongside. Every rule below carries specificity (0,5,0)
   so it wins in BOTH states: core styles the open menu (`.is-menu-open ...`) and the closed menu differently, and
   any property left to core changes the instant the class flips, which shows as a jump while the panel slides out.
   Core's mobile breakpoint is 600px. Values follow the design's drawer (14px root). */
@media (max-width: 599px) {
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: auto;
        width: 80%;
        max-width: 400px;
        padding: 0 !important;
        background-color: #ffffff !important;
        color: #000000;
        z-index: 100000;
        overflow: hidden;
        transform: translateX(100%);
        visibility: hidden;
        box-shadow: 0 0 0 100vmax rgba(0,0,0,0);
        transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out, visibility 0s linear 0.3s;
        animation: none;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel).is-menu-open {
        transform: none;
        visibility: visible;
        box-shadow: 0 0 0 100vmax rgba(0,0,0,0.5);
        transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out, visibility 0s;
        animation: none;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__responsive-close { height: 100%; width: 100%; }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__responsive-dialog { height: 100%; width: 100%; display: flex; flex-direction: column; position: relative; margin: 0 !important; padding: 0 !important; }
    /* Logged in: core pushes the open dialog below the admin bar with a margin and removes it on close (a 46px jump
       while sliding out). The panel itself starts below the bar instead, in both states. */
    body.admin-bar .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) { top: var(--wp-admin--admin-bar--height, 46px); }
    .pb-header .pb-header__drawer-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1.5rem;
        border-bottom: 1px solid #e5e7eb;
        color: #193798;
        flex: none;
    }
    .pb-header .pb-header__drawer-logo { display: block; height: 3rem; width: auto; color: #193798; }
    .pb-header .pb-header__drawer-logo svg { display: block; height: 100%; width: auto; }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__responsive-container-close {
        display: block;
        position: static;
        margin: 0;
        color: #000000;
        padding: 0;
        width: 2rem;
        height: 2rem;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__responsive-container-content {
        flex: 1 1 auto;
        min-height: 0;
        height: auto;
        overflow-y: auto;
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        justify-content: flex-start;
        gap: 0;
        color: #000000;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__container {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 1.5rem;
        padding: 0;
        margin: 0;
        width: 100%;
        height: auto;
        position: static;
        flex: none;
        overflow: visible;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation-item,
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation-submenu {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        position: static;
        height: auto;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation-item__content,
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation-submenu__toggle {
        display: block;
        width: 100%;
        white-space: normal;
        color: #000000;
        font-size: 1rem;
        font-weight: 500;
        line-height: 1.5;
        padding: 0.5rem 0;
        border: 0;
        background: transparent;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__submenu-container {
        position: static;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        height: auto;
        overflow: visible;
        opacity: 1;
        visibility: visible;
        box-shadow: none;
        border: 0;
        border-radius: 0;
        background: transparent;
        padding: 0.5rem 0 0 1rem;
        margin: 0;
        min-width: 0;
        gap: 0.75rem;
        transform: none;
        transition: none;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__submenu-container::before { content: none; }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        padding: 0.5rem 0;
        font-weight: 400;
        color: rgba(0,0,0,0.7);
        background: transparent;
    }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: transparent; color: #193798; }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__submenu-container .pb-nav-cta { border-top: 0; margin-top: 0; padding-top: 0; }
    .pb-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.pb-no-panel) .wp-block-navigation__submenu-container .pb-nav-cta .wp-block-navigation-item__content { color: #193798; font-weight: 500; }
    .pb-header__cta--mobile {
        display: flex;
        width: 100%;
        margin-top: auto;
        padding-top: 1.5rem;
        border-top: 1px solid #e5e7eb;
        flex: none;
    }
    .pb-header__cta--mobile .pb-btn { width: 100%; padding: 1.25rem 1.5rem; background: #193798; color: #ffffff; }
    .pb-header__cta--mobile .pb-btn:hover { background: #1A306A; }
}
@media (prefers-reduced-motion: reduce) {
    .pb-header .wp-block-navigation__responsive-container { transition: none; }
}
@media (min-width: 600px) {
    .pb-header__cta--mobile, .pb-header__drawer-head { display: none; }
}

/* Editor preview: show the solid state in place. */
.pb-header--preview { position: relative; }

/* Highlighted dropdown entry (menu item class pb-nav-cta): divider above, accent colour. */
.pb-header .wp-block-navigation__submenu-container .pb-nav-cta {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f3f4f6;
}
.pb-header .wp-block-navigation__submenu-container .pb-nav-cta .wp-block-navigation-item__content {
    color: #193798;
    font-weight: 500;
}

/* Dropdowns: an invisible strip bridges the gap under the parent item so the pointer can travel into the menu,
   and the parent keeps its underline while the pointer is anywhere in the open menu. */
.pb-header .wp-block-navigation .wp-block-navigation__submenu-container::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -0.5rem;
    height: 0.5rem;
}
.pb-header .wp-block-navigation .has-child:hover > .wp-block-navigation-item__content,
.pb-header .wp-block-navigation .has-child:focus-within > .wp-block-navigation-item__content { border-bottom-color: currentColor; }