/* ==========================================================================
   COMPONENT: site-header (global navbar)
   ========================================================================== */
.bc-site-header {
    position: sticky;
    top: 0;
    z-index: 800;
    background: var(--glass-panel);
    backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--border-subtle);
}
.bc-site-header__inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 1rem 1.5rem;
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 2rem;
}
.bc-site-header__logo {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    height: 32px;
}
.bc-site-header__logo img { height: 100%; width: auto; display: block; }
.bc-site-header__logo .logo-light { display: none; }
[data-theme="light"] .bc-site-header__logo .logo-dark { display: none; }
[data-theme="light"] .bc-site-header__logo .logo-light { display: block; }
.bc-site-header__nav {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
}
.bc-site-header__nav ul,
.bc-site-header__nav li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.bc-site-header__nav > ul,
.bc-site-header__nav-list {
    display: inline-flex;
    gap: 0.25rem;
}
.bc-site-header__nav > ul > li,
.bc-site-header__nav-list > li {
    position: relative;
    contain: layout style;
}
/* Invisible bridge that spans the 6px gap between parent item and submenu.
   Without this, the cursor briefly leaves both elements while crossing
   from the trigger to the dropdown, and the submenu collapses before the
   user can click a child link. */
.bc-site-header__nav .menu-item-has-children::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 12px;
    z-index: 9;
    pointer-events: auto;
}
.bc-site-header__nav a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    padding: 0.5rem 1rem;
    border-radius: var(--radius-pill);
    transition: all var(--duration-fast);
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.bc-site-header__nav a:hover,
.bc-site-header__nav .current-menu-item > a,
.bc-site-header__nav .current-menu-parent > a,
.bc-site-header__nav .current-menu-ancestor > a {
    color: var(--text-primary);
    background: var(--bg-surface-1);
}
.bc-site-header__nav .current-menu-item > a,
.bc-site-header__nav .current_page_item > a {
    color: var(--accent-primary);
}

/* Dropdown indicator on parent items */
.bc-site-header__nav .menu-item-has-children > a::after {
    content: '';
    width: 6px;
    height: 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform var(--duration-fast);
    margin-left: 0.25rem;
}
.bc-site-header__nav .menu-item-has-children:hover > a::after,
.bc-site-header__nav .menu-item-has-children:focus-within > a::after {
    transform: rotate(225deg) translateY(-2px);
}

/* Desktop submenu panel */
.bc-site-header__nav .sub-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    min-width: 220px;
    background: var(--bg-surface-1);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg, 14px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(253, 224, 71, 0.05);
    padding: 0.4rem;
    display: flex !important;
    flex-direction: column;
    gap: 0.15rem;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    /* 120ms linger before disappearing so cursor jitter doesn't close it */
    transition: opacity var(--duration-fast) ease 120ms,
                transform var(--duration-fast) ease 120ms,
                visibility 0s linear calc(var(--duration-fast) + 120ms);
    z-index: 10;
}
.bc-site-header__nav .menu-item-has-children:hover > .sub-menu,
.bc-site-header__nav .menu-item-has-children:focus-within > .sub-menu {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    transition-delay: 0s;
}
.bc-site-header__nav .sub-menu > li {
    width: 100%;
}
.bc-site-header__nav .sub-menu a {
    width: 100%;
    padding: 0.55rem 0.9rem;
    border-radius: var(--radius-md, 10px);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    white-space: nowrap;
}
.bc-site-header__nav .sub-menu a:hover,
.bc-site-header__nav .sub-menu .current-menu-item > a {
    background: rgba(253, 224, 71, 0.08);
    color: var(--accent-primary);
}
.bc-site-header__actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}
.bc-site-header__theme-toggle,
.bc-site-header__icon-btn {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-pill);
    font-family: inherit;
    font-size: 1rem;
    cursor: pointer;
    transition: all var(--duration-fast);
}
.bc-site-header__theme-toggle:hover,
.bc-site-header__icon-btn:hover { border-color: var(--accent-primary); color: var(--accent-primary); }
.bc-site-header__hamburger {
    display: none;
    background: transparent;
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    width: 44px;
    height: 44px;
    border-radius: var(--radius-pill);
    font-size: 1rem;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}

/* Mobile drawer + backdrop.
   Stacking: site-header 800, cookie consent 950, drawer must sit on top of both. */
.bc-site-header__backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 990;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--duration-base);
}
.bc-site-header__backdrop.is-open {
    display: block;
    opacity: 1;
    pointer-events: auto;
}
.bc-site-header__drawer {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 85%;
    max-width: 340px;
    background: var(--bg-base);
    border-left: 1px solid var(--border-subtle);
    padding: 1.25rem 1.25rem 2rem;
    z-index: 999;
    flex-direction: column;
    gap: 0.25rem;
    transform: translateX(100%);
    visibility: hidden;
    content-visibility: hidden;
    transition: transform var(--duration-base) var(--ease-out),
                visibility 0s linear var(--duration-base);
    overflow-y: auto;
}
.bc-site-header__drawer.is-open {
    transform: translateX(0);
    visibility: visible;
    content-visibility: visible;
    transition: transform var(--duration-base) var(--ease-out),
                visibility 0s linear 0s;
}
.bc-site-header__drawer ul,
.bc-site-header__drawer ol,
.bc-site-header__drawer li {
    list-style: none;
    padding: 0;
    margin: 0;
}
.bc-site-header__drawer ul { display: flex; flex-direction: column; gap: 0.1rem; }
.bc-site-header__drawer li { display: block; }

/* Mobile accordion for sub-menus */
.bc-site-header__drawer .menu-item-has-children { position: relative; }
.bc-site-header__drawer .menu-item-has-children > a::after {
    content: '';
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    margin-left: auto;
    transition: transform var(--duration-fast);
    opacity: 0.6;
}
.bc-site-header__drawer .menu-item-has-children.is-expanded > a::after {
    transform: rotate(225deg);
    opacity: 1;
    color: var(--accent-primary);
}
.bc-site-header__drawer .sub-menu {
    max-height: 0;
    overflow: hidden;
    padding-left: 1rem;
    transition: max-height var(--duration-base) var(--ease-out, ease);
    border-left: 1px solid var(--border-subtle);
    margin-left: 0.75rem;
    margin-top: 0.1rem;
}
.bc-site-header__drawer .menu-item-has-children.is-expanded > .sub-menu {
    max-height: 600px;
}
.bc-site-header__drawer .sub-menu a {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    padding: 0.6rem 0.75rem;
    color: var(--text-secondary);
}
.bc-site-header__drawer__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 1rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-subtle);
}
.bc-site-header__drawer__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: var(--fw-bold);
    font-size: var(--text-sm);
    color: var(--text-primary);
    text-decoration: none;
}
.bc-site-header__drawer__close {
    width: 36px;
    height: 36px;
    background: transparent;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    color: var(--text-primary);
    font-size: 1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--duration-fast);
}
.bc-site-header__drawer__close:hover { border-color: var(--accent-primary); color: var(--accent-primary); }
.bc-site-header__drawer a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.85rem 1rem;
    color: var(--text-primary);
    text-decoration: none;
    font-size: var(--text-base);
    font-weight: var(--fw-semibold);
    border-radius: var(--radius-md);
    background: transparent;
    transition: background var(--duration-fast) var(--ease-out, ease),
                color var(--duration-fast) var(--ease-out, ease),
                padding var(--duration-fast) var(--ease-out, ease);
    position: relative;
    overflow: hidden;
}
/* Arrow affordance — present but transparent; slides in on hover/active. */
.bc-site-header__drawer a::after {
    content: '→';
    font-size: var(--text-sm);
    color: var(--accent-primary);
    opacity: 0;
    transform: translateX(-0.5rem);
    transition: opacity var(--duration-fast) var(--ease-out, ease),
                transform var(--duration-fast) var(--ease-out, ease);
    pointer-events: none;
}
.bc-site-header__drawer a:hover,
.bc-site-header__drawer a:focus-visible {
    color: var(--accent-primary);
    background: linear-gradient(90deg, rgba(253, 224, 71, 0.10), rgba(253, 224, 71, 0.02) 70%, transparent);
    padding-left: 1.25rem;
    outline: none;
}
.bc-site-header__drawer a:hover::after,
.bc-site-header__drawer a:focus-visible::after {
    opacity: 1;
    transform: translateX(0);
}

/* Active state — covers both our own .is-active and every flavor WP core
   emits on current menu items. Gold dot indicator on the left + accent color. */
.bc-site-header__drawer a.is-active,
.bc-site-header__drawer .current-menu-item > a,
.bc-site-header__drawer .current_page_item > a,
.bc-site-header__drawer .current-menu-ancestor > a,
.bc-site-header__drawer .current-menu-parent > a,
.bc-site-header__drawer .current_page_parent > a {
    color: var(--accent-primary);
    background: linear-gradient(90deg, rgba(253, 224, 71, 0.08), transparent 80%);
    padding-left: 1.75rem;
}
.bc-site-header__drawer a.is-active::before,
.bc-site-header__drawer .current-menu-item > a::before,
.bc-site-header__drawer .current_page_item > a::before,
.bc-site-header__drawer .current-menu-ancestor > a::before,
.bc-site-header__drawer .current-menu-parent > a::before,
.bc-site-header__drawer .current_page_parent > a::before {
    content: '';
    position: absolute;
    left: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-primary);
    box-shadow: 0 0 10px rgba(253, 224, 71, 0.55);
}
.bc-site-header__drawer a.is-active::after,
.bc-site-header__drawer .current-menu-item > a::after,
.bc-site-header__drawer .current_page_item > a::after {
    opacity: 0.8;
    transform: translateX(0);
}

/* Defeat Astra parent / WP default squared highlights that target the <li> */
.bc-site-header__drawer li.current-menu-item,
.bc-site-header__drawer li.current_page_item,
.bc-site-header__drawer li {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
.bc-site-header__drawer__cta {
    margin-top: 1rem !important;
    padding-top: 1rem !important;
    border-top: 1px solid var(--border-subtle);
}
.bc-site-header__drawer__search {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.7rem 0.9rem;
    margin-bottom: 0.75rem;
    background: var(--bg-surface-1);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-pill, 9999px);
    color: var(--text-secondary);
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    transition: all var(--duration-fast);
}
.bc-site-header__drawer__search:hover {
    border-color: var(--accent-primary);
    color: var(--text-primary);
}
.bc-site-header__drawer__search > span:first-of-type {
    flex: 1;
    text-align: left;
}
.bc-site-header__drawer__search-kbd {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 0.65rem;
    padding: 0.15rem 0.4rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    color: var(--text-tertiary);
    letter-spacing: 0.05em;
}
.bc-site-header__drawer__legal {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.bc-site-header__drawer__section-label {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-widest);
    padding: 0.3rem 1rem;
}
.bc-site-header__drawer__legal-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.bc-site-header__drawer__legal a {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-weight: var(--fw-semibold);
    padding: 0.55rem 1rem;
}
.bc-site-header__drawer__cta .bc-btn-pill {
    width: 100%;
    text-align: center;
    padding: 0.75rem 1.5rem;
}

@media (max-width: 900px) {
    /* Nav track is 1fr but hidden; assign explicit grid columns so
       auto-placement doesn't drop the actions div into the empty center
       track (which made the moon toggle float mid-viewport). */
    .bc-site-header__inner {
        grid-template-columns: auto 1fr auto auto;
        padding: 0.85rem 1rem;
        gap: 0.5rem;
    }
    .bc-site-header__logo      { grid-column: 1; }
    .bc-site-header__nav       { display: none; grid-column: 2; }
    .bc-site-header__actions   { grid-column: 3; gap: 0.5rem; }
    .bc-site-header__hamburger { grid-column: 4; display: flex; }
    .bc-site-header__inner > .bc-btn-pill { display: none; }
    .bc-site-header__drawer { display: flex; }
}