/* Compact header: one continuously visible catalog moves between rows. */
:root{--compact-header-height:108px;--header-motion:380ms;--header-ease:cubic-bezier(.4,0,.2,1)}
html:has(.header-space){scroll-padding-top:124px}
body>.topbar{display:none}
.header-space{height:108px;background:#202d3d}
body>.header{position:fixed;inset:0 0 auto;z-index:40;height:108px;border:0;background:#1a222e;isolation:isolate;transition:height var(--header-motion) var(--header-ease),box-shadow var(--header-motion) ease}
body>.header::after{content:"";position:absolute;top:64px;left:0;right:0;height:44px;z-index:0;background:#202d3d;transform:scaleY(1);transform-origin:top;transition:transform var(--header-motion) var(--header-ease);pointer-events:none}
.header .header-inner{position:relative;z-index:2;height:64px;gap:22px;background:transparent}
.header .brand{font-size:22px;gap:9px}
.header .brand-symbol{width:34px;height:38px}
.header-navigation-stage{position:relative;flex:1;min-width:0;height:64px;isolation:isolate}
.header .desktop-nav{position:absolute;inset:0;display:flex;justify-content:flex-end;gap:22px;height:64px;margin:0;font-size:14px;opacity:1;transition:opacity 160ms ease 220ms;will-change:opacity}
.header-compact-row{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:flex-end;gap:18px;height:64px;opacity:0;pointer-events:none;transition:opacity 120ms ease;will-change:opacity}
.header .header-phone{font-size:16px;margin-left:0;display:flex;align-items:center;min-height:24px}
.header .header-callback{font-size:11px;min-height:24px;padding:1px 0}
.header .header-quote{display:none}
.header .cart-open{min-height:44px;padding:8px 12px}
/* One catalog stays visible and moves between rows; no cloned fading layer. */
.header .header-categories{position:absolute;top:0;left:0;right:auto;z-index:3;width:var(--header-categories-expanded-width,628px);height:40px;border:0;background:transparent;opacity:1;transform:translate3d(var(--header-categories-expanded-x,48px),66px,0);transition:transform var(--header-motion) var(--header-ease),width var(--header-motion) var(--header-ease);will-change:transform}
.header .header-categories>.container{width:100%;height:40px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;transition:gap var(--header-motion) var(--header-ease)}
.header .header-categories a{min-width:0;width:100%;height:40px;font-size:14px;padding:0 10px;background:#2a3b4e;transition:background var(--header-motion) ease}
.header .header-categories a:hover{background:#2a3b4e;color:#ffba86}
.header-more{display:block;position:relative;flex-shrink:0;border:0;color:#fff}
.header-more>summary{min-height:44px;gap:7px;padding:8px 6px;font-size:14px;font-weight:600;border:0;white-space:nowrap}
.header-more>summary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.header-more[open]>summary svg{transform:rotate(180deg)}
.header-more-menu{position:absolute;right:-12px;top:calc(100% + 5px);min-width:238px;padding:8px;background:#202d3d;border:1px solid #40536c;border-radius:14px;box-shadow:0 12px 30px #0c15273d}
.header-more-menu a{display:flex;align-items:center;min-height:44px;padding:10px 14px;border-radius:9px;font-size:14px;white-space:nowrap}
.header-more-menu a:hover{background:#304155;color:#ffba86}
body>.header.is-compact{height:64px;box-shadow:0 3px 18px #101a292b}
body>.header.is-compact::after{transform:scaleY(0)}
.header.is-compact .desktop-nav{opacity:0;pointer-events:none;transition:opacity 120ms ease}
.header.is-compact .header-compact-row{opacity:1;pointer-events:auto;transition:opacity 160ms ease 220ms}
.header.is-compact .header-categories{width:var(--header-categories-compact-width,584px);transform:translate3d(var(--header-categories-compact-x,200px),12px,0)}
.header.is-compact .header-categories>.container{gap:8px}
.header.is-compact .header-categories a:not([aria-current]){background:transparent}
html:has(.header.is-compact){scroll-padding-top:80px}
/* A wholesale landing without retail categories keeps one service row. */
body>.header:not(:has(.header-categories)),.header-space:not(:has(+.header .header-categories)){height:64px}
body>.header:not(:has(.header-categories))::after{display:none}
html:not(:has(.header .header-categories)){scroll-padding-top:80px}
@media (max-width:1280px) and (min-width:1101px){
 .header .header-inner{gap:16px}
 .header .desktop-nav{gap:16px;font-size:13px}
 .header .header-phone{font-size:14px}
 .header-compact-row{gap:12px}
 .header-more>summary{font-size:13px}
 .header .cart-open{font-size:13px}
}
@media (max-width:1100px){
 :root{--compact-header-height:64px}
 html:has(.header-space),html:has(.header.is-compact){scroll-padding-top:80px}
 .header-space{height:64px}
 body>.header,body>.header.is-compact{height:64px}
 body>.header::after{display:none}
 .header .header-inner{height:64px;gap:12px}
 .header-navigation-stage,.header .desktop-nav,.header .header-categories,.header.is-compact .header-categories,.header .header-more{display:none}
 .header .header-contact{margin-left:auto}
 .header .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;border:0;background:none;gap:6px;padding:0}
 .header .menu-toggle span{height:2px;width:22px;background:#fff}
 .header .mobile-nav{position:absolute;top:64px;left:0;right:0;max-height:calc(100dvh - 64px);overflow:auto;overscroll-behavior:contain;background:#1a222e;border-bottom:1px solid #40536c}
}
@media (max-width:560px){
 .header .brand{font-size:19px;gap:7px}
 .header .brand-symbol{width:29px;height:34px}
 .header .header-inner,.header.is-compact .header-inner{gap:8px}
 .header .header-phone{font-size:0}
 .header .header-callback{display:none}
 .header .cart-open{padding:4px;gap:3px}
}
body>.header.header-no-motion,body>.header.header-no-motion::after,body>.header.header-no-motion *{transition:none!important}
@media (prefers-reduced-motion:reduce){body>.header,body>.header::after,body>.header *{transition:none!important}}
