/* Header stability layer: keeps the global chrome predictable at every width. */
#cj-header.hh{width:100%;height:var(--cj-header-h);isolation:isolate}
#cj-header.hh-transparent{background:transparent!important;border-bottom-color:transparent!important;box-shadow:none!important;color:var(--cj-text-inverse)}
#cj-header.hh-transparent{position:fixed;top:0;left:0;right:0}
#cj-header.hh-transparent .hh-link,#cj-header.hh-transparent .hh-iconbtn,#cj-header.hh-transparent .hh-login,#cj-header.hh-transparent .hh-burger{color:#fff!important}
#cj-header.hh-transparent.is-scrolled{background:rgba(4,11,20,.92)!important;border-bottom-color:var(--cj-border-dark)!important;box-shadow:var(--shadow-md)!important}
#cj-header .hh-inner{width:100%;max-width:var(--container-xl);min-height:var(--cj-header-h);height:var(--cj-header-h);margin-inline:auto;display:flex;align-items:center}
#cj-header .hh-logo{display:inline-flex;align-items:center;flex:0 0 auto;z-index:2}
#cj-header .hh-logo img{display:block;width:auto;height:56px;max-width:150px;object-fit:contain}
#cj-header .hh-actions{display:flex;align-items:center}
#cj-header .hh-actions>*{align-self:center}
/* Search / cart are plain .btn-icon (no .btn), so they were display:block with the glyph stuck to the top. */
#cj-header .hh-iconbtn{display:inline-flex;align-items:center;justify-content:center}
#cj-header .hh-nav{flex:1 1 auto;min-width:0}
#cj-header .hh-nav ul{justify-content:center;min-width:0}
#cj-header .hh-actions{flex:0 0 auto;min-width:max-content}
#cj-header .hh-link{line-height:1.1}
#cj-header .hh-drop{z-index:var(--z-sheet)}
#cj-header .hh-mnav{top:var(--cj-header-h);height:calc(100dvh - var(--cj-header-h));max-height:calc(100dvh - var(--cj-header-h));}
#cj-header .hh-search{z-index:calc(var(--z-sheet) + 1)}
/* The full nav (9 links + language + search + cart + sign in + CTA) needs
   ~1280px. Below that it overlapped the logo, so the burger menu is used up
   to 1279px (Sign in + CTA stay visible from 1024px). Keep in sync with
   header.css, global-polish.css and localization.css. */
@media (max-width:1023px){
  #cj-header .hh-inner{padding-inline:max(1rem,env(safe-area-inset-left)) max(1rem,env(safe-area-inset-right));}
  #cj-header .hh-logo img{height:48px;max-width:132px}
  #cj-header .hh-actions{gap:.25rem}
  #cj-header .hh-actions .hh-login,#cj-header .hh-actions .hh-cta,#cj-header .hh-actions .hh-acctbtn{display:none}
}
@media (max-width:1279px){
  #cj-header .hh-nav{display:none}
  #cj-header .hh-burger{display:inline-flex}
}
@media (prefers-reduced-motion:reduce){#cj-header.hh-transparent{position:fixed}}
@media (min-width:1024px){
  #cj-header .hh-login,#cj-header .hh-cta,#cj-header .hh-acctbtn{display:inline-flex}
}
@media (min-width:1280px){
  #cj-header .hh-nav{display:block}
  #cj-header .hh-burger{display:none}
  #cj-header .hh-mnav{display:none!important}
}
@media (min-width:1280px) and (max-width:1439px){
  #cj-header .hh-link{padding-inline:.5rem;font-size:.875rem}
  #cj-header .hh-inner{gap:.75rem}
  #cj-header .hh-cta{padding-inline:.9rem}
}