/* October 7 preview: compact partnership beside the logo. */
/* Clip the rounded site edges without creating an inner scroll container. */
#wbc-store {overflow: clip;}
#wbc-store .wb-header {
  padding: 12px 24px;
  gap: 20px;
  flex-wrap: nowrap;
  box-sizing: border-box;
  position: sticky;
  top: 0;
  z-index: 100;
  background: #FAF3E9;
  transition: transform 220ms ease, box-shadow 220ms ease;
}
#wbc-store .wb-header-identities {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 22px;
  width: auto;
  min-width: 0;
}
#wbc-store .wb-header .wb-brand {font-size: 22px; flex: none; white-space: nowrap; gap: 0;}
#wbc-store .wb-header .wb-brand > i {display: none;}
#wbc-store .wb-header .wb-brand small {font-size: 10px; margin-top: 4px;}
#wbc-store .wb-header-partner {
  flex-direction: row;
  align-items: center;
  gap: 12px;
  border-top: 0;
  border-left: 1px solid #B8935A;
  padding: 0 0 0 22px;
  min-height: 46px;
}
#wbc-store .wb-header-partner > span {
  font: 400 11px/1.45 'Poppins', Arial, sans-serif;
  color: #5A4636;
  white-space: nowrap;
  text-align: left;
}
#wbc-store .wb-header-partner > a img {width: 136px; height: 46px; object-fit: contain;}
#wbc-store .wb-header nav {
  margin-left: auto;
  width: auto;
  flex-wrap: nowrap;
  gap: 18px;
  justify-content: flex-end;
}
#wbc-store .wb-header nav a {white-space: nowrap;}
#wbc-store .wb-header #wb-cart {padding: 8px 14px; min-height: 44px;}
#wbc-store .wb-header.wb-header-is-hidden {transform: translateY(-105%); box-shadow: none;}
#wbc-store .wb-header.wb-header-keyboard-focus:focus-within {transform: translateY(0);}
#wbc-store #wb-shop,
#wbc-store #wb-story-text,
#wbc-store #wb-bag {scroll-margin-top: calc(var(--wb-header-height, 70px) + 10px);}
#wbc-store[data-header-mode="floating"] #wb-shop {scroll-margin-top: 10px;}
@media (max-width: 1050px) {
  #wbc-store .wb-header {flex-wrap: wrap; gap: 6px; padding: 10px 20px;}
  #wbc-store .wb-header-identities {justify-content: space-between; width: 100%;}
  #wbc-store .wb-header nav {width: 100%; justify-content: flex-end; gap: 22px;}
}
@media (max-width: 650px) {
  #wbc-store .wb-header {padding: 9px 12px; gap: 5px;}
  #wbc-store .wb-header-identities {gap: 10px;}
  #wbc-store .wb-header .wb-brand {font-size: 17px;}
  #wbc-store .wb-header .wb-brand small {font-size: 8px; letter-spacing: 1px;}
  #wbc-store .wb-header-partner {gap: 7px; padding-left: 10px; min-height: 38px;}
  #wbc-store .wb-header-partner > span {font-size: 9px;}
  #wbc-store .wb-header-partner > a img {width: 80px; height: 36px;}
  #wbc-store .wb-header nav {gap: 4px; justify-content: space-between;}
  #wbc-store .wb-header nav a {font-size: 10px; min-height: 44px;}
  #wbc-store .wb-header #wb-cart {font-size: 12px; padding: 6px 10px; gap: 5px;}
}
@media (max-width: 360px) {
  #wbc-store .wb-header-identities {gap: 8px;}
  #wbc-store .wb-header .wb-brand {font-size: 15px;}
  #wbc-store .wb-header-partner {gap: 5px; padding-left: 8px;}
  #wbc-store .wb-header-partner > span {font-size: 8px;}
  #wbc-store .wb-header-partner > a img {width: 60px; height: 32px;}
  #wbc-store .wb-header nav a {font-size: 9px;}
  #wbc-store .wb-header #wb-cart {font-size: 11px; padding: 6px 8px;}
}
@media (prefers-reduced-motion: reduce) {
  #wbc-store .wb-header {transition: none;}
}

/* Brand doubles as a keyboard-accessible return to the homepage top. */
#wbc-store .wb-header a.wb-brand{color:inherit;text-decoration:none;cursor:pointer}
#wbc-store .wb-header a.wb-brand:focus-visible{outline:2px solid #9b493d;outline-offset:5px;border-radius:3px}

/* Keep the brand black in every link state. */
#wbc-store .wb-header a.wb-brand,
#wbc-store .wb-header a.wb-brand:link,
#wbc-store .wb-header a.wb-brand:visited,
#wbc-store .wb-header a.wb-brand:hover,
#wbc-store .wb-header a.wb-brand:active,
#wbc-store .wb-header a.wb-brand:focus{color:#000;text-decoration:none}

/* Compact partnership lockup; logo opens the partner story. */
#wbc-store .wb-header-partner{gap:3px}
#wbc-store .wb-header-partner > span{align-self:flex-start;padding-top:1px}
#wbc-store .wb-header-partner > a{display:flex;align-items:center;flex:none;min-height:46px;text-decoration:none}
#wbc-store .wb-header-partner > a img{display:block}
#wbc-store .wb-header-partner > a:focus-visible{outline:2px solid #9b493d;outline-offset:3px;border-radius:3px}
@media(max-width:650px){#wbc-store .wb-header-partner{gap:2px}#wbc-store .wb-header-partner > a{min-height:38px}#wbc-store .wb-header-partner > span{padding-top:2px}}

/* The linked logo retains the original black treatment. */
#wbc-store .wb-header-partner .wb-partner-story-link img{filter:brightness(0);opacity:1}

/* Larger mobile identities, with a compact partnership label. */
/* Keep the desktop section landing gap clean above the section border. */
@media(min-width:651px){
  #wbc-store .wb-native-statement .statement-photo img{object-position:center 88%}
  #wbc-store .wb-header.wb-header-section-landed::after{
    content:"";position:absolute;top:100%;left:0;right:0;height:24px;
    background:#FAF3E9;pointer-events:none;
  }
}
@media(max-width:650px){
  #wbc-store .wb-native-statement .statement-photo{width:100%;height:190px;min-height:190px;overflow:hidden}
  #wbc-store .wb-native-statement .statement-photo img{width:103.3%;max-width:none;height:100%;object-fit:cover;object-position:center 78%}
  #wbc-store .wb-header-identities{gap:8px}
  #wbc-store .wb-header .wb-brand{font-size:clamp(19px,5.35vw,23px)}
  #wbc-store .wb-header .wb-brand small{font-size:8px}
  #wbc-store .wb-header-partner{padding-left:8px;gap:2px}
  #wbc-store .wb-header-partner > span{font-size:8px;line-height:1.3}
  #wbc-store .wb-header-partner > a img{width:clamp(82px,24vw,110px);height:46px}
  #wbc-store .wb-header nav a{font-size:12px}
}
@media(max-width:360px){
  #wbc-store .wb-header .wb-brand{font-size:17px}
  #wbc-store .wb-header-partner > span{font-size:7px}
  #wbc-store .wb-header-partner{padding-left:6px}
  #wbc-store .wb-header nav a{font-size:11px}
}

/* Separate the hero and introduction with the same cream gap as the story tiles. */
/* More prominent desktop branding and navigation within the existing header. */
@media(min-width:651px){
  #wbc-store .wb-header{padding-top:6px;padding-bottom:6px;align-items:center}
  #wbc-store .wb-brand-lockup{transform:translateY(-2px)}
  #wbc-store .wb-header-partner > span{align-self:center}
  #wbc-store .wb-header-partner > a img{width:160px;height:54px}
  #wbc-store .wb-header nav a{font-size:15px;font-weight:500}
}
#wbc-store .wb-native-statement{border-top:12px solid #FAF3E9}
@media(max-width:600px){
  #wbc-store .wb-native-statement{border-top-width:8px}
}