/* Final header layer. Loaded after legacy styles to keep every viewport intentional. */
@media (min-width: 1381px) {
    .site-header .top-nav {
        grid-template-columns: 350px minmax(470px, 1fr) auto;
        gap: 16px;
        min-height: 80px;
        padding: 10px clamp(24px, 3vw, 56px);
    }

    .top-nav .brand-group {
        gap: 12px;
    }

    .top-nav .brand-logo-box:first-child {
        width: 156px;
    }

    .top-nav .brand-logo-box:last-child {
        width: 166px;
    }

    .top-nav .brand-divider {
        height: 40px;
    }

    .top-nav .nav-links {
        width: 100%;
        justify-content: center;
        gap: 2px;
        padding: 2px;
    }

    .top-nav .nav-links a {
        min-height: 36px;
        padding: 0 10px;
        font-size: 0.74rem;
    }

    .nav-actions {
        gap: 8px;
    }

    .nav-actions .nav-button {
        min-width: 152px;
        padding-inline: 16px;
    }

    .nav-actions .cart-nav-button {
        min-width: 96px;
        padding-inline: 13px;
    }

    .nav-actions .header-auth-button {
        min-width: 124px;
        padding-inline: 14px;
    }
}

@media (min-width: 981px) and (max-width: 1380px) {
    .site-header .top-nav {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "brand actions"
            "links links";
        gap: 10px 18px;
        min-height: 112px;
        padding: 12px clamp(24px, 3vw, 48px);
    }

    .top-nav .brand-group {
        grid-area: brand;
        gap: 12px;
    }

    .top-nav .nav-links {
        grid-area: links;
        display: flex;
        width: 100%;
        justify-content: center;
        gap: 3px;
    }

    .top-nav .nav-links a {
        min-height: 36px;
        padding: 0 12px;
        font-size: 0.72rem;
    }

    .nav-actions {
        grid-area: actions;
        gap: 8px;
    }

    .nav-actions .nav-button {
        min-width: 150px;
        padding-inline: 15px;
    }

    .nav-actions .cart-nav-button {
        min-width: 96px;
        padding-inline: 13px;
    }

    .nav-actions .header-auth-button {
        min-width: 124px;
        padding-inline: 14px;
    }
}

@media (max-width: 760px) {
    .site-header .top-nav {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        min-height: auto;
        padding: 12px 14px 11px;
    }

    .top-nav .brand-group {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
        gap: 8px;
        width: 100%;
        align-items: center;
    }

    .top-nav .brand-logo-box,
    .top-nav .brand-logo-box:first-child,
    .top-nav .brand-logo-box:last-child {
        display: flex;
        width: 100%;
        height: 42px;
    }

    .top-nav .brand-divider {
        display: block;
        width: 1px;
        height: 32px;
    }

    .nav-actions {
        display: grid;
        grid-template-columns: minmax(0, 1.25fr) minmax(72px, 0.72fr) minmax(0, 1fr);
        gap: 8px;
        width: 100%;
    }

    .nav-actions .nav-button,
    .nav-actions .cart-nav-button,
    .nav-actions .header-auth-nav,
    .nav-actions .header-auth-button,
    .nav-actions .header-account-menu,
    .nav-actions .header-account-button {
        grid-column: auto;
        width: 100%;
        min-width: 0;
    }

    .nav-actions .nav-button,
    .nav-actions .cart-nav-button,
    .nav-actions .header-auth-button {
        min-height: 46px;
        padding-inline: 8px;
        font-size: 0.69rem;
    }

    .nav-actions .cart-nav-button {
        gap: 5px;
    }

    .nav-actions .cart-count {
        min-width: 20px;
        min-height: 20px;
        padding: 1px 6px;
        font-size: 0.65rem;
    }

    .top-nav .nav-links {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        order: 3;
        width: 100%;
        gap: 6px;
        padding: 8px 0 0;
        overflow: visible;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 0;
        background: transparent;
        scrollbar-width: none;
    }

    .top-nav .nav-links::-webkit-scrollbar {
        display: none;
    }

    .top-nav .nav-links a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 0;
        min-height: 35px;
        padding: 0 7px;
        font-size: 0.58rem;
        line-height: 1.05;
        text-align: center;
        white-space: normal;
    }
}

@media (max-width: 420px) {
    .site-header .top-nav {
        padding-inline: 10px;
    }

    .top-nav .brand-logo-box,
    .top-nav .brand-logo-box:first-child,
    .top-nav .brand-logo-box:last-child {
        height: 38px;
    }

    .nav-actions {
        grid-template-columns: minmax(0, 1.22fr) minmax(68px, 0.72fr) minmax(0, 1fr);
        gap: 7px;
    }

    .nav-actions .nav-button,
    .nav-actions .cart-nav-button,
    .nav-actions .header-auth-button {
        min-height: 43px;
        padding-inline: 6px;
        font-size: 0.64rem;
    }

    .top-nav .nav-links a {
        min-height: 34px;
        font-size: 0.56rem;
    }
}

@media (max-width: 360px) {
    .top-nav .nav-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .top-nav .nav-links a {
        font-size: 0.6rem;
    }
}

/* Suppressor page mobile header polish. */
@media (max-width: 760px) {
    .suppressor-info-body .site-header {
        position: sticky;
        top: 0;
        z-index: 1000;
        background:
            linear-gradient(180deg, rgba(6, 6, 6, 0.98), rgba(6, 6, 6, 0.92));
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
    }

    .suppressor-info-body .site-header .top-nav {
        gap: 8px;
        padding: 9px 10px 10px;
    }

    .suppressor-info-body .top-nav .brand-group {
        grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
        gap: 8px;
    }

    .suppressor-info-body .top-nav .brand-logo-box,
    .suppressor-info-body .top-nav .brand-logo-box:first-child,
    .suppressor-info-body .top-nav .brand-logo-box:last-child {
        height: 38px;
    }

    .suppressor-info-body .top-nav .nav-links {
        margin-inline: -2px;
        padding: 6px 2px 0;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .suppressor-info-body .top-nav .nav-links a,
    .suppressor-info-body .top-nav .nav-links .nav-link-button {
        min-height: 32px;
        padding: 0 7px;
        border-radius: 7px;
        font-size: 0.57rem;
    }

    .suppressor-info-body .nav-actions {
        grid-template-columns: minmax(0, 1.2fr) minmax(74px, 0.62fr) minmax(0, 0.88fr);
        gap: 7px;
    }

    .suppressor-info-body .nav-actions .nav-button,
    .suppressor-info-body .nav-actions .cart-nav-button,
    .suppressor-info-body .nav-actions .header-auth-button {
        min-height: 42px;
        padding-inline: 7px;
        border-radius: 7px;
        font-size: 0.64rem;
        letter-spacing: 0.025em;
    }

    .suppressor-info-body .header-account-dropdown {
        right: 0;
        width: min(272px, calc(100vw - 20px));
        padding: 9px;
        border-radius: 8px;
    }

    .suppressor-info-body .header-account-dropdown::before {
        right: 18px;
    }

    .suppressor-info-body .header-account-dropdown > a,
    .suppressor-info-body .header-dropdown-logout {
        min-height: 42px;
        border-radius: 7px;
        font-size: 0.8rem;
    }
}

@media (max-width: 390px) {
    .suppressor-info-body .nav-actions .nav-button,
    .suppressor-info-body .nav-actions .cart-nav-button,
    .suppressor-info-body .nav-actions .header-auth-button {
        font-size: 0.6rem;
    }
}

@media (max-width: 760px) {
    .suppressor-info-body .top-nav .nav-links a[aria-current="page"] {
        order: -1;
    }
}