/* One shared desktop header for every storefront view. */
body[data-page="home"] .site-header,
body[data-page="collection"] > header,
body[data-page="category"] > header,
body[data-page="product"] > header,
body[data-page="atelier"] .site-header,
body[data-page="search"] > header,
body[data-page="custom-order"] .service-header,
body[data-page="support"] .service-header {
  width:100%;
  max-width:1280px !important;
  height:86px !important;
  min-height:86px;
  margin-inline:auto;
  padding:0 2rem !important;
  display:grid !important;
  grid-template-columns:minmax(160px,1fr) auto minmax(280px,1fr) !important;
  align-items:center !important;
  column-gap:1.25rem;
}

body[data-page] .store-header-actions {
  justify-self:end !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:.45rem !important;
  min-height:36px;
  white-space:nowrap;
}

body[data-page] .store-header-actions .member-actions {
  display:inline-flex !important;
  align-items:center !important;
  align-self:center;
  gap:0 !important;
  height:32px;
  margin:0;
  white-space:nowrap;
}

body[data-page] .store-header-actions .member-actions a {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center;
  min-height:32px !important;
  height:32px;
  margin:0 !important;
  padding:0 .68rem !important;
  border:1px solid var(--ink) !important;
  border-radius:0 !important;
  font:500 .69rem/1 Arial,Helvetica,sans-serif !important;
  letter-spacing:0 !important;
  text-decoration:none !important;
}

body[data-page] .store-header-actions .member-actions a:first-child {
  border-radius:99px 0 0 99px !important;
}

body[data-page] .store-header-actions .member-actions a + a {
  margin-left:-1px !important;
  border-radius:0 99px 99px 0 !important;
  background:var(--ink) !important;
  color:var(--cream) !important;
}

body[data-page] .store-header-actions .member-actions.is-signed-in a {
  border-radius:99px !important;
  background:transparent !important;
  color:var(--ink) !important;
}

body[data-page] .store-header-actions .header-search,
body[data-page] .store-header-actions .icon-button {
  width:32px !important;
  min-width:32px !important;
  height:32px !important;
  min-height:32px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:1px solid var(--ink) !important;
  border-radius:50% !important;
  background:transparent !important;
  color:var(--ink) !important;
  font:400 1.08rem/1 Georgia,serif !important;
}

body[data-page] .store-header-actions .bag,
body[data-page] .store-header-actions .bag-button {
  min-height:32px;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center;
  margin:0 !important;
  padding:.42rem .7rem !important;
  border:1px solid var(--ink) !important;
  border-radius:99px !important;
  background:transparent;
  color:var(--ink);
  font:500 .72rem/1 Arial,Helvetica,sans-serif !important;
  white-space:nowrap;
}

body[data-page] .store-header-actions .bag span,
body[data-page] .store-header-actions .bag-button span {
  display:inline-grid;
  place-items:center;
  min-width:16px;
  height:16px;
  margin-left:.28rem;
  padding:0 .22rem;
  border-radius:99px;
  background:var(--ink);
  color:var(--cream);
  font-size:.62rem;
}

@media (max-width:820px) {
  body[data-page="home"] .site-header,
  body[data-page="collection"] > header,
  body[data-page="category"] > header,
  body[data-page="product"] > header,
  body[data-page="atelier"] .site-header,
  body[data-page="search"] > header,
  body[data-page="custom-order"] .service-header,
  body[data-page="support"] .service-header {
    height:68px !important;
    min-height:68px;
    padding-inline:1rem !important;
    grid-template-columns:auto 1fr auto !important;
    column-gap:.7rem;
  }

  body[data-page] header nav,
  body[data-page] .store-header-actions .member-actions,
  body[data-page] .store-header-actions .header-search,
  body[data-page] .store-header-actions .icon-button {
    display:none !important;
  }
}

/* The rendered header uses these classes on every storefront page. */
body[data-page] .store-header {
  width:100%;
  max-width:1280px !important;
  height:86px !important;
  min-height:86px;
  margin-inline:auto;
  padding:0 2rem !important;
  display:grid !important;
  grid-template-columns:minmax(160px,1fr) auto minmax(280px,1fr) !important;
  align-items:center !important;
  column-gap:1.25rem;
  border-bottom:1px solid var(--line) !important;
  background:var(--cream);
}

body[data-page] .store-header .store-brand {
  display:inline-block;
  justify-self:start;
  color:var(--ink);
  font:700 1rem/1 Arial,Helvetica,sans-serif;
  letter-spacing:.17em;
  text-decoration:none;
  white-space:nowrap;
}

body[data-page] .store-header .store-brand em {
  font:400 1.05rem/1 Georgia,serif;
  letter-spacing:.05em;
}

body[data-page] .store-header .primary-nav {
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:1.35rem !important;
  margin:0;
  padding:0;
  font:400 .74rem/1 Arial,Helvetica,sans-serif !important;
  letter-spacing:.025em;
}

body[data-page] .store-header .primary-nav a {
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:.35rem 0 !important;
  white-space:nowrap;
  border-bottom:1px solid transparent !important;
  color:var(--ink);
  text-decoration:none;
}

body[data-page] .store-header .primary-nav a.active {
  border-bottom-color:currentColor !important;
  font-weight:500 !important;
}

body[data-page] .store-header .menu-button {
  display:none;
  width:32px;
  height:32px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ink);
  font-size:1.2rem;
  cursor:pointer;
}

/* Tablet landscape and compact laptops: retain every shopping destination
   without allowing the shared header to force a horizontal page scroll. */
@media (min-width:821px) and (max-width:1100px) {
  body[data-page] .store-header {
    height:76px !important;
    min-height:76px;
    padding-inline:1rem !important;
    grid-template-columns:minmax(0,.72fr) auto minmax(0,.9fr) !important;
    column-gap:.75rem;
  }

  body[data-page] .store-header .store-brand img {
    width:132px !important;
  }

  body[data-page] .store-header .primary-nav {
    gap:.7rem !important;
    font-size:.67rem !important;
  }

  body[data-page] .store-header .primary-nav a {
    font-size:.67rem !important;
  }

  body[data-page] .store-header-actions {
    gap:.25rem !important;
  }

  body[data-page] .store-header-actions .member-actions a {
    padding-inline:.48rem !important;
  }

  body[data-page] .store-header-actions .bag,
  body[data-page] .store-header-actions .bag-button {
    padding-inline:.55rem !important;
  }
}

@media (max-width:820px) {
  body[data-page] .store-header {
    height:68px !important;
    min-height:68px;
    padding-inline:1rem !important;
    grid-template-columns:auto 1fr auto !important;
    column-gap:.7rem;
  }

  body[data-page] .store-header .menu-button {
    display:block;
  }

  body[data-page] .store-header .primary-nav,
  body[data-page] .store-header .member-actions,
  body[data-page] .store-header .header-search {
    display:none !important;
  }

  body[data-page] .store-header .store-brand {
    justify-self:center;
    font-size:.86rem;
  }
}
