/* AMPLE shared public shell 69.60.0
   The storefront header has one markup source (store_shell.py) and one style
   source (this file) for catalog, product and information pages. */
#storeHeader.store-header-root{
  position:sticky;
  top:0;
  z-index:120;
  display:block;
  width:100%;
  background:#fff;
  color:#111;
  font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;
}
#storeHeader *,#storeHeader *::before,#storeHeader *::after{box-sizing:border-box}
#storeHeader button,#storeHeader input{font:inherit}
#storeHeader button{cursor:pointer}
#storeHeader a{color:inherit}
#storeHeader .site-container{width:min(calc(100% - 40px),1600px);margin-inline:auto}
#storeHeader .site-announcement{
  display:block;
  min-height:36px;
  border:0;
  background:#111;
  color:#fff;
  font-size:11px;
  font-weight:650;
  letter-spacing:.015em;
}
#storeHeader .site-announcement .site-container{display:flex;min-height:36px;align-items:center;justify-content:center;text-align:center}
#storeHeader .site-announcement-track{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px}
#storeHeader .site-header{display:block;border-bottom:1px solid #e4e4e4;background:#fff}
#storeHeader .site-header-main{
  display:grid;
  grid-template-columns:minmax(150px,1fr) minmax(300px,620px) minmax(300px,1fr);
  grid-template-areas:"logo search actions";
  align-items:center;
  gap:28px;
  min-height:74px;
}
#storeHeader .site-logo{
  grid-area:logo;
  display:inline-flex;
  width:max-content;
  align-items:center;
  color:#111;
  font-size:30px;
  font-weight:900;
  line-height:1;
  letter-spacing:-2.4px;
  text-decoration:none;
  text-transform:uppercase;
  white-space:nowrap;
}
#storeHeader .site-search{
  grid-area:search;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 42px;
  align-items:center;
  width:100%;
  height:44px;
  min-width:0;
  margin:0;
  overflow:hidden;
  border:1px solid #dedede;
  border-radius:999px;
  background:#f7f7f7;
}
#storeHeader .site-search>span{display:grid;place-items:center;color:#4b4b4b}
#storeHeader .site-search input{width:100%;height:100%;min-width:0;border:0;outline:0;background:transparent;color:#111;font-size:13px;text-overflow:ellipsis}
#storeHeader .site-search input::placeholder{color:#818181}
#storeHeader .site-search-go{display:block;width:42px;height:42px;border:0;background:transparent}
#storeHeader .site-search:focus-within{border-color:#111;background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.06)}
#storeHeader svg,#authModal .auth-close svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#storeHeader .site-actions{grid-area:actions;display:flex;align-items:center;justify-content:flex-end;gap:4px;min-width:0}
#storeHeader .site-icon{
  position:relative;
  display:inline-flex;
  min-width:54px;
  height:52px;
  padding:4px 7px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#111;
  font-size:10px;
  font-weight:650;
  line-height:1.1;
  text-decoration:none;
}
#storeHeader .site-icon:hover{background:#f6f6f6}
#storeHeader .site-icon>span{display:block;white-space:nowrap}
#storeHeader .site-icon b{position:absolute;top:1px;right:4px;display:grid;min-width:17px;height:17px;padding:0 4px;place-items:center;border:1px solid #fff;border-radius:999px;background:#111;color:#fff;font-size:9px;line-height:1}
#storeHeader .site-menu-toggle,#storeHeader .site-search-toggle{display:none}
#storeHeader .site-nav{display:block;border-top:1px solid #f0f0f0;background:#fff}
#storeHeader .site-nav .site-container{display:flex;height:47px;align-items:stretch;justify-content:center;gap:clamp(18px,2.1vw,34px);overflow-x:auto;scrollbar-width:none}
#storeHeader .site-nav .site-container::-webkit-scrollbar{display:none}
#storeHeader .site-nav a{position:relative;display:inline-flex;align-items:center;flex:0 0 auto;color:#202020;font-size:12px;font-weight:650;letter-spacing:.015em;text-decoration:none;white-space:nowrap}
#storeHeader .site-nav a::after{content:"";position:absolute;right:0;bottom:7px;left:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:center;transition:transform .18s ease}
#storeHeader .site-nav a:hover::after,#storeHeader .site-nav a.active::after{transform:scaleX(1)}
#storeHeader .site-nav .sale-link{color:#d71920}
#storeHeader .site-mobile-menu{
  position:fixed;
  inset:0 auto 0 0;
  z-index:150;
  display:block;
  width:min(88vw,380px);
  padding:20px;
  overflow-y:auto;
  background:#fff;
  box-shadow:20px 0 70px rgba(0,0,0,.2);
  transform:translateX(-105%);
  visibility:hidden;
  pointer-events:none;
  transition:transform .25s ease,visibility 0s linear .25s;
}
#storeHeader .site-mobile-menu.open,#storeHeader .site-mobile-menu[aria-hidden="false"]{transform:translateX(0);visibility:visible;pointer-events:auto;transition-delay:0s}
#storeHeader .site-mobile-head{display:flex;align-items:center;justify-content:space-between;padding:6px 0 18px;border-bottom:1px solid #e4e4e4;font-size:21px}
#storeHeader .site-mobile-head button{display:grid;width:40px;height:40px;place-items:center;border:0;border-radius:50%;background:#f4f4f4;color:#111}
#storeHeader .site-mobile-menu nav{display:grid;padding-top:12px}
#storeHeader .site-mobile-menu nav a,#storeHeader .site-mobile-menu nav button{display:block;width:100%;padding:14px 3px;border:0;border-bottom:1px solid #e8e8e8;background:#fff;color:#111;font-weight:750;text-align:left;text-decoration:none}
body.menu-open{overflow:hidden}
/* Auth and footer logos use the same wordmark without inheriting page CSS. */
#authModal .auth-brand,#storeFooter .site-logo{display:inline-flex;width:max-content;align-items:center;color:#111;font-weight:900;line-height:1;letter-spacing:-1.7px;text-decoration:none;text-transform:uppercase}
#authModal .auth-brand{font-size:24px}
#storeFooter .site-logo{font-size:25px}

@media (max-width:1180px){
  #storeHeader .site-header-main{grid-template-columns:140px minmax(260px,1fr) auto;gap:20px}
  #storeHeader .site-icon>span{display:none}
  #storeHeader .site-icon{min-width:45px}
}
@media (max-width:1000px){
  #storeHeader .site-header-main{
    grid-template-columns:44px minmax(0,1fr) auto;
    grid-template-areas:"menu logo actions" "search search search";
    gap:0 8px;
    min-height:66px;
  }
  #storeHeader .site-menu-toggle{grid-area:menu;display:inline-flex}
  #storeHeader .site-logo{justify-self:start;font-size:27px}
  #storeHeader .site-actions{gap:0}
  #storeHeader .site-actions .site-search-toggle{display:inline-flex}
  #storeHeader .site-search{display:none;margin:0 0 12px}
  #storeHeader .site-search.mobile-open{display:grid}
  #storeHeader .site-nav{display:none}
}
@media (max-width:760px){
  #storeHeader .site-container{width:min(calc(100% - 24px),1440px)}
  #storeHeader .site-announcement{display:none}
  #storeHeader .site-header-main{min-height:62px}
  #storeHeader .site-icon{width:40px;min-width:40px;height:44px;padding:3px}
  #storeHeader .site-icon svg{width:21px;height:21px}
  #storeHeader .site-icon b{top:0;right:0}
}
@media (max-width:430px){
  #storeHeader .site-logo{font-size:24px;letter-spacing:-1.9px}
  #storeHeader .site-actions [data-account]{display:none}
}
@media (prefers-reduced-motion:reduce){
  #storeHeader .site-nav a::after,#storeHeader .site-mobile-menu{transition:none}
}