.site-header {
    --header-accent: #dc3522;
    position: sticky;
    top: 0;
    z-index: 1020;
    color: #222;
    background: #fff;
    border-bottom: 1px solid #e7e7e7;
}

.site-header__container {
    width: 100%;
    max-width: 1320px;
    margin-inline: auto;
    padding-inline: 12px;
}

.site-header a { color: inherit; text-decoration: none; }
.site-header a:hover, .site-menu a:hover { color: #b12b1b; }
.site-header :is(a, button, input):focus-visible,
.site-menu :is(a, button):focus-visible { outline: 3px solid #258cfb; outline-offset: 3px; }

.site-header__shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px 44px;
    grid-template-areas: "brand contacts actions";
    align-items: center;
    gap: 12px;
    padding-block: 10px;
}

.site-header__brand {
    grid-area: brand;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: 0;
    max-width: 210px;
}
.site-header__brand img { display: block; width: 160px; max-width: 100%; height: 44px; object-fit: contain; object-position: left center; }
.site-header__brand > span { display: none; color: #666; font-size: 12px; line-height: 16px; white-space: nowrap; }
.site-header__office, .site-header__quote, .site-header__desktop-account, .site-header__phone-hint { display: none; }

.site-header__contacts { grid-area: contacts; }
.site-header__phone { display: flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; border-radius: 6px; }
.site-header__phone > span { display: none; }
.site-header__actions { grid-area: actions; display: flex; align-items: center; gap: 8px; }
.site-header__icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: inherit; }
.site-header__cart { position: relative; color: var(--header-accent) !important; }
.site-header__cart-count { position: absolute; top: 0; right: 0; display: flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding-inline: 4px; border-radius: 12px; background: var(--header-accent); color: #fff; font: 600 11px/1 system-ui, sans-serif; }

.site-header__navigation { border-top: 1px solid #eee; background: #fafafa; }
.site-header__nav-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; gap: 8px; padding-block: 8px; }
.site-header__mobile-action { display: flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; min-height: 44px; padding: 8px; border: 1px solid #ddd; border-radius: 6px; background: #fff; color: #333; font-size: 14px; font-weight: 500; line-height: 1.2; white-space: nowrap; }
.site-header__mobile-action svg { flex-shrink: 0; }
.site-header__menu-toggle { color: #b12b1b; border-color: #e6b7b0; }
.site-header__search-toggle { min-width: 44px; }
.site-header__search-toggle > span { display: none; }
.site-header__search-toggle[aria-expanded="true"] { border-color: #258cfb; background: #f1f7ff; }
.site-header__desktop-nav { display: none; }
.site-header__compact-actions { display: none; }
.site-header__search-panel { display: none; grid-column: 1 / -1; min-width: 0; }
.site-header__search-panel.is-open { display: block; }

.site-header__search { position: relative; display: flex; min-width: 0; height: 44px; border: 1px solid #d6d6d6; border-radius: 6px; background: #fff; }
.site-header__search:focus-within { border-color: #258cfb; box-shadow: 0 0 0 2px rgb(37 140 251 / 18%); }
.site-header__search input { flex: 1; width: 100%; min-width: 0; padding: 9px 12px; border: 0; border-radius: inherit; background: transparent; color: #222; font: inherit; font-size: 16px; }
.site-header__search input:focus-visible { outline: none; }
.site-header__search-submit { flex: 0 0 44px; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 0 6px 6px 0; background: transparent; color: #555; }
.site-header__search-results { position: absolute; top: calc(100% + 8px); right: 0; left: 0; z-index: 1030; max-height: min(55vh, 400px); overflow-y: auto; overflow-x: hidden; border: 1px solid #ddd; border-radius: 6px; background: #fff; box-shadow: 0 8px 24px rgb(0 0 0 / 12%); }
.site-header__search-results .result-item + .result-item { border-top: 1px solid #eee; }
.site-header__search-results .result-item > a, .site-header__search-results .result-item:not(:has(a)) { display: block; padding: 12px; overflow-wrap: anywhere; font-size: 14px; }
.site-header__search-results img { flex-shrink: 0; max-height: 60px; object-fit: contain; }
.site-header__search-results a:hover, .site-header__search-results a.is-active { background: #f7f1ef; color: #8c2519; }

.site-header__account { display: flex; align-items: center; gap: 16px; margin: 0; padding: 0; list-style: none; }
.site-header__account a, .site-header__account button { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: none; color: inherit; font: inherit; white-space: nowrap; }
.site-header__desktop-account .site-header__account > li + li { display: none; }
.site-header__desktop-account .site-header__account a { position: relative; justify-content: center; width: 44px; }
.site-header__desktop-account .site-header__account svg { width: 22px; height: 22px; }
.site-header__desktop-account .site-header__account-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.site-header__quote, .site-menu__quote { align-items: center; justify-content: center; min-height: 44px; padding: 10px 14px; border: 1px solid #dc3522; border-radius: 6px; background: #dc3522; color: #fff; font-size: 14px; font-weight: 600; white-space: nowrap; }
.site-header__quote:hover, .site-menu__quote:hover { border-color: #b12b1b; background: #b12b1b; }
.site-header__quote-icon { display: none; flex-shrink: 0; }
.site-header [aria-current], .site-menu [aria-current] { color: #b12b1b; font-weight: 600; }

.site-menu { width: min(360px, 100vw); color: #222; }
.site-menu .offcanvas-header { min-height: 64px; border-bottom: 1px solid #e7e7e7; }
.site-menu .offcanvas-title { font-size: 20px; }
.site-menu .btn-close { min-width: 44px; min-height: 44px; padding: 14px; }
.site-menu .offcanvas-body { padding: 20px; }
.site-menu h3 { margin: 0 0 8px; color: #666; font-size: 13px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.site-menu ul { margin: 0; padding: 0; list-style: none; }
.site-menu a { display: flex; align-items: center; min-height: 44px; padding-block: 10px; color: inherit; text-decoration: none; }
.site-menu__catalog a { font-size: 16px; font-weight: 500; }
.site-menu__quote { display: flex; width: 100%; margin-block: 20px; }
.site-menu__information, .site-menu__account { padding-block: 12px; border-top: 1px solid #e7e7e7; }
.site-menu .site-header__account { justify-content: space-between; }
.site-menu__contacts { display: flex; flex-direction: column; margin: 0 0 24px; padding: 0 0 16px; border-bottom: 1px solid #e7e7e7; font-size: 14px; }
.site-menu__contacts > a:first-child { font-size: 18px; font-weight: 700; }
.site-menu__contacts > span { padding-block: 6px; color: #666; font-size: 13px; }
.site-menu__route { color: #b12b1b !important; font-weight: 600; }

@media (min-width: 576px) {
    .site-header__brand > span, .site-header__search-toggle > span { display: inline; }
    .site-header__search-toggle { padding-inline: 16px; }
}

@media (min-width: 768px) {
    .site-header__container { padding-inline: 24px; }
    .site-header__shell { grid-template-columns: 180px minmax(180px, 1fr) 44px auto 44px; grid-template-areas: "brand office contacts quote actions"; gap: 16px; padding-block: 12px; }
    .site-header__brand img { width: 180px; height: 52px; }
    .site-header__office { grid-area: office; display: flex; flex-direction: column; gap: 3px; min-width: 0; font-size: 13px; line-height: 18px; }
    .site-header__office-title { font-size: 14px; font-weight: 600; }
    .site-header__office-details { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
    .site-header__office-details a { color: #b12b1b; text-decoration: underline; text-underline-offset: 3px; }
    .site-header__office-details > span { display: none; color: #777; font-size: 11px; }
    .site-header__quote { display: inline-flex; grid-area: quote; }
}

@media (min-width: 992px) {
    .site-header__office-details > span { display: inline; }
}

@media (min-width: 1200px) {
    .site-header.is-desktop-enhanced { top: calc(-1 * var(--header-main-height, 60px)); }
    .site-header.has-primary-focus { top: 0; }
    .site-header__shell { grid-template-columns: 184px minmax(260px, 1fr) 168px auto 96px; gap: 16px; padding-block: 8px; }
    .site-header__brand img { width: 174px; height: 44px; }
    .site-header__brand > span { display: none; }
    .site-header__office { display: grid; grid-template-columns: max-content max-content; justify-content: start; gap: 2px 8px; font-size: 13px; line-height: 16px; }
    .site-header__office-title { font-size: 13px; }
    .site-header__office > span { white-space: nowrap; }
    .site-header__office-details { display: contents; }
    .site-header__office > span, .site-header__office-details > span { text-align: center; }
    .site-header__desktop-account { display: block; }
    .site-header__contacts { text-align: center; }
    .site-header__phone-hint { display: block; margin-bottom: 2px; color: #666; font-size: 13px; line-height: 18px; }
    .site-header__phone { justify-content: center; width: auto; min-height: 26px; font-size: 18px; font-weight: 700; white-space: nowrap; }
    .site-header__phone > span { display: inline; }
    .site-header__phone-icon { display: none; }
    .site-header__quote { gap: 10px; min-height: 46px; padding-inline: 16px; border-color: #ca2c1d; border-radius: 8px; background: linear-gradient(180deg, #e34230, #cf2e1e); box-shadow: 0 4px 10px rgb(177 43 27 / 16%), inset 0 1px 0 rgb(255 255 255 / 18%); font-size: 15px; transition: transform .15s ease, box-shadow .15s ease; }
    .site-header__quote-icon { display: block; }
    .site-header__quote:hover { background: linear-gradient(180deg, #d63827, #b82a1b); box-shadow: 0 6px 14px rgb(177 43 27 / 22%); transform: translateY(-1px); }
    .site-header__quote:active { box-shadow: 0 2px 6px rgb(177 43 27 / 16%); transform: translateY(0); }
    .site-header__nav-inner { display: flex; justify-content: space-between; gap: 24px; padding-block: 6px; }
    .site-header__mobile-action { display: none; }
    .site-header__desktop-nav { display: flex; align-items: center; gap: 14px; min-width: 0; }
    .site-header__nav-link { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 8px 0; border: 0; background: transparent; color: #333; font-size: 15px; font-weight: 500; white-space: nowrap; }
    .site-header__desktop-nav .site-header__service-link { color: #666; font-size: 14px; font-weight: 400; }
    .site-header__desktop-nav .site-header__service-link[aria-current] { color: #b12b1b; font-weight: 600; }
    .site-header__nav-link:not(.site-header__service-link) + .site-header__service-link { border-left: 1px solid #ddd; padding-left: 16px; }
    .site-header__brick-menu { min-width: 240px; margin-top: 6px !important; padding: 8px; border: 1px solid #e0e0e0; border-radius: 6px; box-shadow: 0 8px 24px rgb(0 0 0 / 12%); }
    .site-header__brick-menu .dropdown-item { min-height: 44px; padding: 12px; border-radius: 3px; font-size: 15px; }
    .site-header__search-panel, .site-header__search-panel.is-open { display: block; flex: 1 1 220px; max-width: 280px; }
    .site-header__search input { font-size: 14px; }

    .site-header.is-compact .site-header__main :is(.site-header__brand, .site-header__office, .site-header__contacts) { visibility: hidden; }
    .site-header.is-compact .site-header__service-link { display: none; }
    .site-header.is-compact .site-header__nav-inner { gap: 16px; }
    .site-header.is-compact .site-header__desktop-nav { flex: 1 0 auto; }
    .site-header.is-compact .site-header__search-panel { flex: 0 1 220px; max-width: 220px; }
    .site-header.is-compact .site-header__compact-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
    .site-header.is-compact .site-header__phone-hint { display: none; }
    .site-header.is-compact .site-header__phone { justify-content: center; width: 146px; min-height: 44px; font-size: 15px; }
}

@media (min-width: 1200px) and (prefers-reduced-motion: reduce) {
    .site-header__quote { transition: none; }
    .site-header__quote:hover { transform: none; }
}
