/* CenterServ charcoal header v1. Presentation only; no checkout/body styles.
   Original CenterServ logo retained. Scoped to the shared header and Twenty-One header. */
#cs-site-header,#cs-site-header *{box-sizing:border-box}
#cs-site-header{
  position:relative;inset:auto;z-index:1001;display:block;float:none;
  width:100%;height:auto;margin:0;overflow:visible;transform:none;
  background:#202225;color:#f5f6f8;border-bottom:1px solid #383b40;
  box-shadow:0 3px 18px #00000012;text-align:left;
  font:400 15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
#cs-site-header *{font-family:inherit}
#cs-site-header .cs-head-wrap{
  display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;
  max-width:1280px;min-height:90px;margin:0 auto;padding:14px 28px;gap:28px;
}
#cs-site-header .cs-brand{
  display:inline-flex;align-items:center;flex:0 0 auto;line-height:1;
  padding:0;margin:0;border:0;background:none;white-space:nowrap;
  color:#fff;letter-spacing:normal;text-decoration:none!important;
}
#cs-site-header .cs-brand img.cs-brand-logo{
  display:block;width:218px;height:auto;max-width:100%;margin:0;padding:0;
  border:0;border-radius:0;object-fit:contain;box-shadow:none;transform:none;
}
#cs-site-header a,#cs-site-header summary{
  color:#d9dce1;text-transform:none;letter-spacing:normal;font:inherit;
  text-decoration:none!important;transition:color .16s ease,background-color .16s ease,border-color .16s ease;
}
#cs-site-header .cs-menu{
  display:flex;flex:1 1 auto;min-width:0;align-items:center;justify-content:flex-end;
  flex-wrap:nowrap;gap:4px;margin:0;padding:0;border:0;
}
#cs-site-header .cs-menu>a,#cs-site-header .cs-menu>details>summary{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;margin:0;padding:10px 12px;border-radius:7px;
  font-size:14px;font-weight:500;line-height:1.5;white-space:nowrap;
}
#cs-site-header details{position:relative;flex:0 0 auto;margin:0;padding:0}
#cs-site-header summary{cursor:pointer;list-style:none;gap:8px}
#cs-site-header summary::-webkit-details-marker{display:none}
#cs-site-header summary::after{
  content:"";display:block;width:6px;height:6px;flex:0 0 6px;
  margin-top:-3px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);transition:transform .16s ease;
}
#cs-site-header details[open]>summary::after{margin-top:3px;transform:rotate(225deg)}
#cs-site-header .cs-menu>a:not(.cs-nav-cta):hover,
#cs-site-header .cs-menu>details>summary:hover,
#cs-site-header .cs-menu>details[open]>summary{background:#303338;color:#fff;text-decoration:none!important}
#cs-site-header .cs-menu>.cs-account-login{margin-left:13px;position:relative}
#cs-site-header .cs-account-login::before{
  content:"";position:absolute;left:-9px;top:12px;bottom:12px;width:1px;background:#4b4f56;
}
#cs-site-header .cs-menu>.cs-account-signup{border:1px solid #565c65;padding:9px 13px;margin-left:3px}
#cs-site-header .cs-menu>.cs-nav-cta{
  padding:11px 18px;margin-left:6px;border:1px solid #0875c5;border-radius:7px;
  background:#0875c5;color:#fff;font-size:14px;font-weight:650;box-shadow:none;
}
#cs-site-header .cs-menu>.cs-nav-cta:hover{background:#0768b0;border-color:#0768b0;color:#fff}
#cs-site-header .cs-submenu{
  position:absolute;inset:calc(100% + 8px) auto auto 0;z-index:1010;
  width:270px;max-width:calc(100vw - 36px);margin:0;padding:7px;
  background:#292c31;border:1px solid #454a52;border-radius:10px;
  box-shadow:0 16px 36px #00000035;color:#f5f6f8;
}
#cs-site-header .cs-submenu::before{content:"";position:absolute;left:0;right:0;top:-9px;height:9px}
#cs-site-header .cs-submenu a{
  display:flex;align-items:center;min-height:44px;padding:11px 13px;border-radius:6px;
  color:#e2e5ea;font-size:14px;font-weight:400;line-height:1.45;white-space:normal;
}
#cs-site-header .cs-submenu a:hover,#cs-site-header .cs-submenu a:focus-visible{background:#383c43;color:#fff}
#cs-site-header a:focus-visible,#cs-site-header summary:focus-visible,#cs-site-header button:focus-visible{
  outline:2px solid #88cfff;outline-offset:3px;
}
#cs-site-header .cs-mobile-toggle{display:none}
@media(min-width:1001px) and (max-width:1150px){
  #cs-site-header .cs-head-wrap{padding-left:22px;padding-right:22px;gap:16px}
  #cs-site-header .cs-brand img.cs-brand-logo{width:198px}
  #cs-site-header .cs-menu>a,#cs-site-header .cs-menu>details>summary{padding-left:9px;padding-right:9px}
  #cs-site-header .cs-menu>.cs-nav-cta{padding-left:14px;padding-right:14px}
}
@media(max-width:1000px){
  #cs-site-header .cs-head-wrap{flex-wrap:wrap;gap:0 12px;min-height:78px;padding:12px 20px}
  #cs-site-header .cs-brand img.cs-brand-logo{width:196px}
  #cs-site-header.cs-mobile-ready .cs-mobile-toggle{
    display:inline-flex;align-items:center;justify-content:center;gap:9px;
    appearance:none;position:static;float:none;width:auto;min-width:94px;max-width:none;
    min-height:44px;height:auto;margin:0;padding:9px 12px;border:1px solid #565c65;
    border-radius:7px;background:#292c31;color:#fff;box-shadow:none;cursor:pointer;
    font:500 15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
    letter-spacing:normal;text-transform:none;
  }
  #cs-site-header .cs-mobile-toggle:hover{background:#383c43}
  #cs-site-header .cs-menu-icon{display:inline-block;font:400 22px/1 Arial,sans-serif}
  #cs-site-header .cs-mobile-toggle[aria-expanded="true"] .cs-menu-icon{font-size:0}
  #cs-site-header .cs-mobile-toggle[aria-expanded="true"] .cs-menu-icon::after{content:'\00d7';font-size:26px}
  #cs-site-header .cs-menu{
    flex:0 0 100%;width:100%;flex-direction:column;align-items:stretch;justify-content:flex-start;
    gap:4px;margin:12px 0 0;padding:12px 0 3px;border-top:1px solid #454a52;
  }
  #cs-site-header.cs-mobile-ready[data-cs-menu-open="false"] .cs-menu{display:none}
  #cs-site-header .cs-menu>details{position:relative;width:100%;margin:0}
  #cs-site-header .cs-menu>a,#cs-site-header .cs-menu>details>summary{
    display:flex;justify-content:flex-start;width:100%;min-height:48px;
    padding:11px 12px;font-size:16px;white-space:normal;
  }
  #cs-site-header .cs-menu>details>summary{justify-content:space-between}
  #cs-site-header .cs-submenu{
    position:static;inset:auto;width:100%;max-width:none;margin:4px 0 8px;
    padding:5px;border-radius:7px;box-shadow:none;
  }
  #cs-site-header .cs-submenu::before,#cs-site-header .cs-account-login::before{display:none}
  #cs-site-header .cs-submenu a{min-height:48px;padding:12px;font-size:15px}
  #cs-site-header .cs-menu>.cs-account-login{margin:7px 0 0;border-top:1px solid #454a52;border-radius:0}
  #cs-site-header .cs-menu>.cs-account-signup{margin:3px 0 0;justify-content:center}
  #cs-site-header .cs-menu>.cs-nav-cta{margin:5px 0 0;justify-content:center;font-size:16px}
}
@media(max-width:380px){
  #cs-site-header .cs-head-wrap{padding:11px 14px;min-height:74px;gap:0 8px}
  #cs-site-header .cs-brand img.cs-brand-logo{width:174px}
  #cs-site-header.cs-mobile-ready .cs-mobile-toggle{min-width:86px;padding:9px 10px}
}
/* Native Twenty-One header: preserve all menu, account, search and cart controls. */
body>header#header.header{background:#202225;color:#f5f6f8;border-bottom:1px solid #383b40;box-shadow:0 3px 18px #00000012}
body>header#header.header>.navbar{background:#202225;color:#f5f6f8}
body>header#header.header>.navbar.navbar-light{padding-top:15px;padding-bottom:15px}
body>header#header.header .navbar-brand{padding:0;margin-top:0;margin-bottom:0;color:#fff!important;text-decoration:none!important}
body>header#header.header .navbar-brand .logo-img{display:block;width:218px;height:auto;max-width:100%;max-height:none;object-fit:contain}
body>header#header.header .main-navbar-wrapper{background:#202225;border-top:1px solid #383b40;border-bottom:0;padding-top:5px;padding-bottom:5px}
body>header#header.header .navbar-nav>.nav-item>.nav-link,
body>header#header.header .navbar-nav>li>a,
body>header#header.header .toolbar .btn{color:#dde0e5;background:transparent;border-radius:6px;text-decoration:none!important}
body>header#header.header .navbar-nav>.nav-item>.nav-link:hover,
body>header#header.header .navbar-nav>li>a:hover,
body>header#header.header .navbar-nav>.show>.nav-link,
body>header#header.header .toolbar .btn:hover{color:#fff;background:#363a40}
body>header#header.header .navbar-nav>.active>.nav-link{color:#fff;background:#30343a}
body>header#header.header .navbar-nav .nav-link{font-size:14px;font-weight:500;min-height:42px}
body>header#header.header .dropdown-menu{background:#292c31;border:1px solid #454a52;border-radius:9px;padding:6px;box-shadow:0 14px 30px #00000030}
body>header#header.header .dropdown-menu .dropdown-item{color:#e2e5ea;border-radius:5px;padding:10px 12px;line-height:1.45;white-space:normal}
body>header#header.header .dropdown-menu .dropdown-item:hover,
body>header#header.header .dropdown-menu .dropdown-item:focus{background:#383c43;color:#fff}
body>header#header.header .dropdown-divider{border-color:#454a52}
body>header#header.header .search .form-control,
body>header#header.header .search .btn{background:#292c31;color:#f5f6f8;border-color:#565c65;min-height:42px;box-shadow:none}
body>header#header.header .search .form-control::placeholder{color:#c7cbd3;opacity:1}
body>header#header.header .cart-btn .badge{background:#0875c5;color:#fff}
body>header#header.header .topbar{background:#191b1e;border-bottom:1px solid #383b40;color:#d9dce1}
body>header#header.header .topbar .btn,
body>header#header.header .topbar .input-group-text{background:transparent;color:#e2e5ea;border-color:#454a52}
body>header#header.header .topbar .btn:hover{background:#30343a;color:#fff}
body>header#header.header .topbar .btn-return-to-admin{border:1px solid #b8904c;color:#ffdd9c}
body>header#header.header a:focus-visible,
body>header#header.header button:focus-visible,
body>header#header.header input:focus-visible{outline:2px solid #88cfff;outline-offset:3px}
@media(max-width:575px){
  body>header#header.header .navbar-brand .logo-img{width:184px}
  body>header#header.header>.navbar.navbar-light{padding-top:12px;padding-bottom:12px}
  body>header#header.header .toolbar .nav-item{margin-left:6px!important}
  body>header#header.header .toolbar .nav-link{padding:9px 7px}
}
@media(max-width:350px){body>header#header.header .navbar-brand .logo-img{width:162px}}
@media(prefers-reduced-motion:reduce){#cs-site-header a,#cs-site-header summary,#cs-site-header summary::after{transition:none}}

/* centerserv-header-wordmark-v2: display-only crop; original PNG unchanged. */
#cs-site-header .cs-brand img.cs-brand-logo[src="/images/centerserv-header-logo-v1.png"],
body>header#header.header .navbar-brand img.logo-img[src="/images/centerserv-header-logo-v1.png"]{
  aspect-ratio:238 / 41;
  height:auto;
  object-fit:cover;
  object-position:50% 0%;
}
