/* Phase 3L — visually separate the navigation header from page content */
.site-header{
  isolation:isolate;
  position:sticky!important;
  top:0;
  z-index:400!important;
  margin-bottom:12px!important;
  background:transparent!important;
}
.site-header::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:#fff;
  border-bottom:1px solid #dce5ea;
  box-shadow:0 7px 18px rgba(16,24,32,.07);
}
.site-header .brand,
.site-header .print-menu-toggle{position:relative;z-index:2}
.site-header .primary-menu{z-index:410}

/* Give the content a clean visual start below the navigation bar. */
.hero{padding-top:18px!important}
.product-page-shell,
.category-page-shell{padding-top:10px}

@media(max-width:900px){
  .site-header{margin-bottom:9px!important}
  body.menu-open:before{z-index:350!important}
}
@media(max-width:580px){
  .site-header{margin-bottom:7px!important}
  .site-header::before{box-shadow:0 5px 14px rgba(16,24,32,.065)}
  .hero{padding-top:10px!important}
  .product-page-shell,
  .category-page-shell{padding-top:6px}
}