/* Compact bar plus drawer */
@media (max-width: 1240px) {
    .gi-site-header__inner {
        align-items: center;
        column-gap: 1rem;
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 4.5rem;
        padding-block: .6rem;
    }

    .gi-nav-toggle {
        align-items: center;
        background: transparent;
        border: 1px solid var(--gi-border);
        border-radius: .6rem;
        color: var(--gi-moss-900);
        cursor: pointer;
        display: inline-flex;
        justify-content: center;
        min-height: 2.9rem;
        min-width: 2.9rem;
        position: relative;
        z-index: 1200;
        padding: 0;
    }
    .gi-nav-toggle__icon { display: block; height: 1rem; position: relative; width: 1.15rem; }
    .gi-nav-toggle__icon span {
        background: currentColor;
        border-radius: 2px;
        display: block;
        height: 1.6px;
        left: 0;
        position: absolute;
        transition: transform 220ms var(--gi-ease), opacity 140ms var(--gi-ease);
        width: 100%;
    }
    .gi-nav-toggle__icon span:nth-child(1) { top: 2px; }
    .gi-nav-toggle__icon span:nth-child(2) { top: 7.5px; }
    .gi-nav-toggle__icon span:nth-child(3) { top: 13px; }
    .gi-nav-toggle[aria-expanded='true'] .gi-nav-toggle__icon span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
    .gi-nav-toggle[aria-expanded='true'] .gi-nav-toggle__icon span:nth-child(2) { opacity: 0; }
    .gi-nav-toggle[aria-expanded='true'] .gi-nav-toggle__icon span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

    .gi-nav-backdrop[hidden] { display: none; }
    .gi-nav-backdrop {
        background: color-mix(in oklch, var(--gi-moss-900) 42%, transparent);
        border: 0;
        cursor: pointer;
        display: block;
        inset: 0;
        opacity: 0;
        padding: 0;
        position: fixed;
        transition: opacity 240ms var(--gi-ease);
        z-index: 900;
    }
    .gi-nav-backdrop:not([hidden]) { opacity: 1; }

    .gi-header-panel {
        background: var(--gi-header-surface);
        border-inline-start: 1px solid var(--gi-header-line);
        bottom: 0;
        box-shadow: -18px 0 48px color-mix(in oklch, var(--gi-moss-900) 12%, transparent);
        gap: 1.35rem;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 5.5rem 1.25rem 2.25rem;
        position: fixed;
        right: 0;
        top: 0;
        transform: translateX(100%);
        transition: transform 320ms var(--gi-ease), visibility 0s linear 320ms;
        visibility: hidden;
        width: min(100%, 23rem);
        z-index: 1100;
    }
    .gi-site-header[data-nav-open='true'] .gi-header-panel {
        transform: translateX(0);
        transition: transform 320ms var(--gi-ease), visibility 0s;
        visibility: visible;
    }

    .gi-header-utilities {
        align-items: stretch;
        display: grid;
        gap: .35rem;
        order: 2;
    }
    .gi-primary-navigation { order: 1; }
    .gi-header-search { min-height: 3rem; order: -3; }
    .gi-header-shortcut { justify-content: flex-start; order: -2; }
    .gi-header-rule { display: none; }
    .gi-header-badge {
        gap: .85rem;
        justify-content: flex-start;
        min-height: 3rem;
        padding-inline: .85rem;
    }
    .gi-header-badge__label { display: inline; font-size: .9375rem; font-weight: 600; }
    .gi-header-badge--dot::after { left: 1.75rem; right: auto; top: .8rem; }
    .gi-header-badge__count { left: 1.6rem; right: auto; top: .65rem; }
    .gi-header-account { display: grid; gap: .6rem; margin-top: .4rem; }
    .gi-header-account:has(.gi-account-access) { grid-template-columns: 1fr 1fr; }
    .gi-account-access { border: 1px solid var(--gi-border); }
    .gi-account-trigger { justify-content: flex-start; }
    .gi-account-menu { border: 0; box-shadow: none; padding: 0; position: static; }

    .gi-menu { display: block; margin-inline-start: 0; }
    .gi-menu > li {
        border-bottom: 1px solid var(--gi-border);
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto 1fr;
        transition: grid-template-rows 280ms var(--gi-ease);
    }
    .gi-menu > li > a {
        border-radius: 0;
        grid-column: 1;
        grid-row: 1;
        padding: .95rem 0;
        white-space: normal;
    }
    .gi-menu > li:not(.menu-item-has-children) > a { border-radius: 0; padding-inline: 0; }
    .gi-submenu-toggle { border-radius: .5rem; grid-column: 2; grid-row: 1; min-width: 2.75rem; padding: 0; }
    .gi-menu > li:hover > a,
    .gi-menu > li:hover > .gi-submenu-toggle,
    .gi-menu > li:focus-within > a,
    .gi-menu > li:focus-within > .gi-submenu-toggle,
    .gi-menu > li[data-open='true'] > a { background: transparent; }
    .gi-menu > li[data-open='true'] > .gi-submenu-toggle { background: var(--gi-header-soft); }

    .gi-megamenu[hidden] { display: none; }
    .gi-megamenu {
        align-self: stretch;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        grid-column: 1 / -1;
        grid-row: 2;
        min-height: 0;
        overflow: hidden;
        position: static;
        width: auto;
    }
    .gi-menu > li[data-open='false'] { grid-template-rows: auto 0fr; }
    .gi-megamenu__inner { padding: 0 0 .6rem; }
    .gi-megamenu__links { column-rule: 0; columns: 1; }
    .gi-megamenu__links a { padding: .55rem .5rem; }
    .gi-megamenu__feature { display: none; }

    body.gi-nav-open { overflow: hidden; }
    .admin-bar .gi-header-panel { top: 32px; }
}

@media (max-width: 782px) {
    .admin-bar .gi-header-panel { top: 46px; }
}

@media (max-width: 420px) {
    .gi-header-panel { width: 100%; }
}


@media (max-width: 1240px) {
    .gi-header-search { width: 100%; }
    .gi-header-search__submit { flex-basis: 2.75rem; }
}

@media (max-width: 1240px) {
    .gi-site-header:not([data-nav-ready]) .gi-header-panel { grid-column: 1 / -1; padding: 1rem 0; position: static; transform: none; visibility: visible; width: 100%; }
    .gi-site-header:not([data-nav-ready]) .gi-nav-toggle { display: none; }
}
