:root {
  --okra-header-h: 88px;
  --okra-header-h-mobile: 68px;
  --okra-header-z: 9990;

  --okra-burgundy: #551912;
  --okra-burgundy-deep: #2a0e0a;
  --okra-ivory: #f8efe4;

  --okra-header-page-bg: #f8efe4;
  --okra-header-hero-bg: #25110d;
  --okra-header-auth-bg: #361C19;
  --okra-header-page-border: rgba(85, 25, 18, 0.12);
  --okra-header-hero-border: rgba(248, 239, 228, 0.12);
  --okra-header-content-gap: clamp(36px, 3vw, 52px);
  --okra-header-content-gap-mobile: clamp(26px, 7vw, 36px);

  --okra-header-side-padding: clamp(22px, 4vw, 72px);
  --okra-header-side-padding-mobile: clamp(14px, 4vw, 18px);
  --okra-header-icon-gap: clamp(10px, 1.2vw, 18px);
  --okra-header-icon-gap-mobile: 8px;
  --okra-header-icon-size: 24px;
  --okra-header-icon-size-mobile: 22px;
  --okra-header-icon-stroke: 1.5;
}

[id],
.item-scroll-target,
[data-scroll] {
  scroll-margin-top: calc(var(--okra-header-h) + 28px);
}

html,
body {
  overflow-x: clip;
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

#header.okra-header-shell,
#header.okra-header-shell.okra-glass-header,
html body[class] #wrapper #header.okra-header-shell,
html body[class] #wrapper #header.okra-header-shell.okra-glass-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: var(--okra-header-h) !important;
  min-height: var(--okra-header-h) !important;
  z-index: var(--okra-header-z) !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  isolation: isolate !important;
  color: var(--okra-burgundy) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: color 260ms ease !important;
  --okra-header-icon-size: 24px !important;
  --okra-header-icon-size-mobile: 22px !important;
  --okra-header-icon-stroke: 1.5 !important;
}

#header.okra-header-shell::before,
#header.okra-header-shell.okra-glass-header::before,
html body[class] #wrapper #header.okra-header-shell::before,
html body[class] #wrapper #header.okra-header-shell.okra-glass-header::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: 0 !important;
  background: var(--okra-header-page-bg) !important;
  border-bottom: 1px solid var(--okra-header-page-border) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  transition: opacity 260ms ease !important;
}

body.okra-home #header.okra-header-shell,
body.okra-home #header.okra-header-shell.okra-glass-header {
  color: var(--okra-ivory) !important;
}

body.okra-home #header.okra-header-shell::before,
body.okra-home #header.okra-header-shell.okra-glass-header::before {
  opacity: 0 !important;
  background: var(--okra-header-hero-bg) !important;
  border-bottom-color: var(--okra-header-hero-border) !important;
}

body.okra-home #header.okra-header-shell.is-scrolled::before,
body.okra-home #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
}

body:not(.okra-home) #header.okra-header-shell,
body:not(.okra-home) #header.okra-header-shell.okra-glass-header {
  color: var(--okra-burgundy) !important;
}

body:not(.okra-home) #header.okra-header-shell.is-scrolled::before,
body:not(.okra-home) #header.okra-header-shell.okra-glass-header.is-scrolled::before,
body.okra-shop-wood #header.okra-header-shell.is-scrolled::before,
body.okra-shop-wood #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
}

body.okra-shop-chrome #header.okra-header-shell,
body.okra-shop-chrome #header.okra-header-shell.okra-glass-header,
body[data-theme="chrome"] #header.okra-header-shell,
body[data-theme="chrome"] #header.okra-header-shell.okra-glass-header {
  color: var(--okra-ivory) !important;
}

body.okra-shop-chrome #header.okra-header-shell::before,
body.okra-shop-chrome #header.okra-header-shell.okra-glass-header::before,
body[data-theme="chrome"] #header.okra-header-shell::before,
body[data-theme="chrome"] #header.okra-header-shell.okra-glass-header::before {
  opacity: 0 !important;
  background: var(--okra-header-hero-bg) !important;
  border-bottom-color: var(--okra-header-hero-border) !important;
}

body.okra-shop-chrome #header.okra-header-shell.is-scrolled::before,
body.okra-shop-chrome #header.okra-header-shell.okra-glass-header.is-scrolled::before,
body[data-theme="chrome"] #header.okra-header-shell.is-scrolled::before,
body[data-theme="chrome"] #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
}

#header.okra-header-shell > *,
#header.okra-header-shell.okra-glass-header > *,
html body[class] #wrapper #header.okra-header-shell > *,
html body[class] #wrapper #header.okra-header-shell.okra-glass-header > * {
  position: relative !important;
  z-index: 1 !important;
}

#header.okra-header-shell .okra-topbar,
#header.okra-header-shell .header-inner,
#header.okra-header-shell .site-header-inner,
#header.okra-header-shell .nav,
#header.okra-header-shell .navbar,
#header.okra-header-shell .header-shell,
html body[class] #wrapper #header.okra-header-shell .okra-topbar,
html body[class] #wrapper #header.okra-header-shell .header-inner,
html body[class] #wrapper #header.okra-header-shell .site-header-inner,
html body[class] #wrapper #header.okra-header-shell .nav,
html body[class] #wrapper #header.okra-header-shell .navbar,
html body[class] #wrapper #header.okra-header-shell .header-shell {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

#header.okra-header-shell > .okra-topbar,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
}

#header.okra-header-shell > .okra-topbar > .okra-brand,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-brand {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  color: currentColor !important;
  text-decoration: none !important;
}

#header.okra-header-shell > .okra-topbar > .okra-brand img,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-brand img {
  display: block !important;
  width: auto !important;
  height: clamp(34px, 3vw, 50px) !important;
  max-width: min(32vw, 164px) !important;
  object-fit: contain !important;
}

body.okra-home #header.okra-header-shell .okra-brand img {
  filter: brightness(0) invert(1) !important;
}

body:not(.okra-home) #header.okra-header-shell .okra-brand img {
  filter: brightness(0) saturate(100%) invert(12%) sepia(65%) saturate(2508%) hue-rotate(351deg) brightness(83%) contrast(93%) !important;
}

body.okra-shop-chrome #header.okra-header-shell .okra-brand img,
body[data-theme="chrome"] #header.okra-header-shell .okra-brand img {
  filter: brightness(0) invert(1) !important;
}

#header.okra-header-shell a,
#header.okra-header-shell button,
html body[class] #wrapper #header.okra-header-shell a,
html body[class] #wrapper #header.okra-header-shell button {
  color: currentColor !important;
}

#header.okra-header-shell .okra-menu-toggle,
#header.okra-header-shell .okra-header-wishlist-link,
#header.okra-header-shell .okra-search-trigger,
#header.okra-header-shell .okra-cart-link,
#header.okra-header-shell .okra-header-icon-button,
#header.okra-header-shell .okra-header-icon-btn,
html body[class] #wrapper #header.okra-header-shell .okra-menu-toggle,
html body[class] #wrapper #header.okra-header-shell .okra-header-wishlist-link,
html body[class] #wrapper #header.okra-header-shell .okra-search-trigger,
html body[class] #wrapper #header.okra-header-shell .okra-cart-link,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-button,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-btn {
  position: relative !important;
  inset: auto !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  color: currentColor !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  line-height: 0 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
  transform: none !important;
  -webkit-tap-highlight-color: transparent;
  transition:
    opacity 220ms ease,
    transform 220ms ease,
    background-color 220ms ease !important;
}

#header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
}

#header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin-left: calc(44px + var(--okra-header-icon-gap)) !important;
}

#header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-search-trigger {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  margin-right: calc(44px + var(--okra-header-icon-gap)) !important;
}

#header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-cart-link {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
}

#header.okra-header-shell > .okra-topbar > .okra-header-actions,
html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  position: relative !important;
  inset: auto !important;
  width: auto !important;
  height: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

#header.okra-header-shell .okra-header-actions > .okra-search-trigger,
#header.okra-header-shell .okra-header-actions > .okra-cart-link,
html body[class] #wrapper #header.okra-header-shell .okra-header-actions > .okra-search-trigger,
html body[class] #wrapper #header.okra-header-shell .okra-header-actions > .okra-cart-link {
  grid-column: auto !important;
  grid-row: auto !important;
  justify-self: auto !important;
  margin: 0 !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand img {
  height: var(--okra-shared-logo-height, clamp(34px, 3vw, 57px)) !important;
  max-width: min(32vw, 164px) !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-menu-toggle,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-wishlist-link,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-search-trigger,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-cart-link,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-icon-button,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-icon-btn {
  position: relative !important;
  inset: auto !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  flex: 0 0 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin-left: calc(44px + var(--okra-header-icon-gap)) !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  position: relative !important;
  inset: auto !important;
  width: auto !important;
  height: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-actions > .okra-search-trigger,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-actions > .okra-cart-link {
  grid-column: auto !important;
  grid-row: auto !important;
  justify-self: auto !important;
  position: relative !important;
  inset: auto !important;
  margin: 0 !important;
  transform: none !important;
}

#header.okra-header-shell svg,
#header.okra-header-shell svg path,
#header.okra-header-shell svg line,
#header.okra-header-shell svg circle,
#header.okra-header-shell svg rect,
html body[class] #wrapper #header.okra-header-shell svg,
html body[class] #wrapper #header.okra-header-shell svg path,
html body[class] #wrapper #header.okra-header-shell svg line,
html body[class] #wrapper #header.okra-header-shell svg circle,
html body[class] #wrapper #header.okra-header-shell svg rect {
  color: currentColor !important;
  stroke: currentColor !important;
}

#header.okra-header-shell .okra-header-svg,
#header.okra-header-shell .okra-header-icon-button > svg,
#header.okra-header-shell .okra-header-icon-btn > svg,
html body[class] #wrapper #header.okra-header-shell .okra-header-svg,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-button > svg,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-btn > svg {
  width: var(--okra-header-icon-size) !important;
  height: var(--okra-header-icon-size) !important;
  min-width: var(--okra-header-icon-size) !important;
  min-height: var(--okra-header-icon-size) !important;
  max-width: var(--okra-header-icon-size) !important;
  max-height: var(--okra-header-icon-size) !important;
  display: block !important;
  flex: 0 0 var(--okra-header-icon-size) !important;
  fill: none !important;
  stroke-width: var(--okra-header-icon-stroke) !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

#header.okra-header-shell .okra-menu-toggle:hover,
#header.okra-header-shell .okra-header-wishlist-link:hover,
#header.okra-header-shell .okra-search-trigger:hover,
#header.okra-header-shell .okra-cart-link:hover,
#header.okra-header-shell .okra-header-icon-button:hover,
#header.okra-header-shell .okra-header-icon-btn:hover,
html body[class] #wrapper #header.okra-header-shell .okra-menu-toggle:hover,
html body[class] #wrapper #header.okra-header-shell .okra-header-wishlist-link:hover,
html body[class] #wrapper #header.okra-header-shell .okra-search-trigger:hover,
html body[class] #wrapper #header.okra-header-shell .okra-cart-link:hover,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-button:hover,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-btn:hover {
  opacity: 0.78 !important;
  background: transparent !important;
  transform: none !important;
}

#header.okra-header-shell .okra-menu-toggle:focus-visible,
#header.okra-header-shell .okra-header-wishlist-link:focus-visible,
#header.okra-header-shell .okra-search-trigger:focus-visible,
#header.okra-header-shell .okra-cart-link:focus-visible,
#header.okra-header-shell .okra-header-icon-button:focus-visible,
#header.okra-header-shell .okra-header-icon-btn:focus-visible,
html body[class] #wrapper #header.okra-header-shell .okra-menu-toggle:focus-visible,
html body[class] #wrapper #header.okra-header-shell .okra-header-wishlist-link:focus-visible,
html body[class] #wrapper #header.okra-header-shell .okra-search-trigger:focus-visible,
html body[class] #wrapper #header.okra-header-shell .okra-cart-link:focus-visible,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-button:focus-visible,
html body[class] #wrapper #header.okra-header-shell .okra-header-icon-btn:focus-visible {
  outline: 1px solid currentColor !important;
  outline-offset: 3px !important;
}

#header.okra-header-shell .okra-cart-link::before,
#header.okra-header-shell .okra-cart-link::after,
html body[class] #wrapper #header.okra-header-shell .okra-cart-link::before,
html body[class] #wrapper #header.okra-header-shell .okra-cart-link::after {
  content: none !important;
  display: none !important;
}

#header.okra-header-shell .okra-cart-count[data-cart-count],
#header.okra-header-shell .okra-cart-count.count-box,
#header.okra-header-shell .okra-header-wishlist-count[data-header-wishlist-count],
html body[class] #wrapper #header.okra-header-shell .okra-cart-count[data-cart-count],
html body[class] #wrapper #header.okra-header-shell .okra-cart-count.count-box,
html body[class] #wrapper #header.okra-header-shell .okra-header-wishlist-count[data-header-wishlist-count] {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 6px !important;
  min-width: 6px !important;
  height: 6px !important;
  min-height: 6px !important;
  max-width: 6px !important;
  max-height: 6px !important;
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: currentColor !important;
  color: currentColor !important;
  box-shadow: 0 0 0 1px rgba(250, 246, 238, 0.72) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#header.okra-header-shell .okra-cart-link.has-items .okra-cart-count[data-cart-count],
#header.okra-header-shell .okra-header-wishlist-link.has-items .okra-header-wishlist-count[data-header-wishlist-count],
html body[class] #wrapper #header.okra-header-shell .okra-cart-link.has-items .okra-cart-count[data-cart-count],
html body[class] #wrapper #header.okra-header-shell .okra-header-wishlist-link.has-items .okra-header-wishlist-count[data-header-wishlist-count] {
  opacity: 1 !important;
}

body.okra-home main,
body.okra-home .page-main,
body.okra-home .home-main,
body.okra-home .okra-stage {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

body.okra-home .okra-hero {
  padding-top: calc(var(--okra-header-h) + clamp(12px, 2vw, 28px)) !important;
}

body:not(.okra-home) main,
body:not(.okra-home) .page-main {
  padding-top: calc(var(--okra-header-h) + var(--okra-header-content-gap)) !important;
}

body:not(.okra-home) .okra-shop-page {
  padding-top: calc(var(--okra-header-h) + var(--okra-header-content-gap)) !important;
}

body.okra-shop-wood:not(.okra-home) .okra-shop-page,
body.okra-shop-chrome:not(.okra-home) .okra-shop-page {
  padding-top: calc(var(--okra-header-h) + var(--okra-header-content-gap)) !important;
}

body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-pdp-sticky-scope,
body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-product-loading,
body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-product-error {
  padding-top: calc(var(--okra-header-h) + var(--okra-header-content-gap)) !important;
}

@media (min-width: 1200px) {
  body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-pdp-sticky-scope .flat-spacing.pb-0 > .container > .row > .col-md-6:last-child > .sticky-top {
    position: sticky !important;
    top: calc(var(--okra-header-h) + var(--okra-header-content-gap)) !important;
    align-self: start !important;
  }

  body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-pdp-sticky-scope .okra-pdp-left-stack > .slider-scroll {
    top: calc(var(--okra-header-h) + clamp(12px, 1.6vw, 24px)) !important;
  }
}

@media (min-width: 1101px) {
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper .okra-policy-sidebar {
    top: calc(var(--okra-header-h) + var(--okra-header-content-gap)) !important;
  }
}

@media (min-width: 768px) and (max-width: 1100px) {
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper .okra-policy-sidebar {
    top: var(--okra-header-h) !important;
  }
}

html body .okra-stage > .okra-hero,
html body .okra-shop-page > .okra-hero {
  margin-top: 0 !important;
}

html body .okra-search-modal-overlay {
  z-index: 10040 !important;
}

html body .okra-search-modal {
  z-index: 10041 !important;
}

html body .okra-cart-overlay,
html body .cart-overlay,
html body .okra-cart-overlay.cart-overlay {
  z-index: 10020 !important;
}

html body .okra-cart-drawer,
html body .cart-drawer,
html body .okra-cart-drawer.cart-drawer {
  z-index: 10021 !important;
}

html body .okra-menu-scrim {
  z-index: 10030 !important;
}

html body .okra-menu-panel {
  z-index: 10031 !important;
}

@media (max-width: 768px) {
  [id],
  .item-scroll-target,
  [data-scroll] {
    scroll-margin-top: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px) + 22px);
  }

  #header.okra-header-shell,
  #header.okra-header-shell.okra-glass-header,
  html body[class] #wrapper #header.okra-header-shell,
  html body[class] #wrapper #header.okra-header-shell.okra-glass-header {
    height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    padding-top: env(safe-area-inset-top, 0px) !important;
  }

  #header.okra-header-shell > .okra-topbar,
  html body[class] #wrapper #header.okra-header-shell > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
  }

  #header.okra-header-shell > .okra-topbar > .okra-brand img,
  html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-brand img {
    height: clamp(34px, 8.5vw, 40px) !important;
    max-width: min(30vw, 112px) !important;
  }

  #header.okra-header-shell .okra-menu-toggle,
  #header.okra-header-shell .okra-header-wishlist-link,
  #header.okra-header-shell .okra-search-trigger,
  #header.okra-header-shell .okra-cart-link,
  #header.okra-header-shell .okra-header-icon-button,
  #header.okra-header-shell .okra-header-icon-btn,
  html body[class] #wrapper #header.okra-header-shell .okra-menu-toggle,
  html body[class] #wrapper #header.okra-header-shell .okra-header-wishlist-link,
  html body[class] #wrapper #header.okra-header-shell .okra-search-trigger,
  html body[class] #wrapper #header.okra-header-shell .okra-cart-link,
  html body[class] #wrapper #header.okra-header-shell .okra-header-icon-button,
  html body[class] #wrapper #header.okra-header-shell .okra-header-icon-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
  }

  #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
  html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link {
    margin-left: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
  html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-search-trigger {
    margin-right: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  #header.okra-header-shell > .okra-topbar > .okra-header-actions,
  html body[class] #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-actions {
    height: 40px !important;
    min-height: 40px !important;
    gap: var(--okra-header-icon-gap-mobile) !important;
  }

  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
    align-items: center !important;
  }

  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand img {
    width: auto !important;
    height: auto !important;
    max-width: min(30vw, 112px) !important;
    max-height: clamp(24px, 6.4vw, 34px) !important;
  }

  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-menu-toggle,
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-wishlist-link,
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-search-trigger,
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-cart-link,
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-icon-button,
  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header .okra-header-icon-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    flex-basis: 40px !important;
  }

  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link {
    margin-left: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions {
    height: 40px !important;
    min-height: 40px !important;
    gap: var(--okra-header-icon-gap-mobile) !important;
  }

  #header.okra-header-shell .okra-header-svg,
  #header.okra-header-shell .okra-header-icon-button > svg,
  #header.okra-header-shell .okra-header-icon-btn > svg,
  html body[class] #wrapper #header.okra-header-shell .okra-header-svg,
  html body[class] #wrapper #header.okra-header-shell .okra-header-icon-button > svg,
  html body[class] #wrapper #header.okra-header-shell .okra-header-icon-btn > svg {
    width: var(--okra-header-icon-size-mobile) !important;
    height: var(--okra-header-icon-size-mobile) !important;
    min-width: var(--okra-header-icon-size-mobile) !important;
    min-height: var(--okra-header-icon-size-mobile) !important;
    max-width: var(--okra-header-icon-size-mobile) !important;
    max-height: var(--okra-header-icon-size-mobile) !important;
    flex-basis: var(--okra-header-icon-size-mobile) !important;
  }

  body:not(.okra-home) main,
  body:not(.okra-home) .page-main,
  body:not(.okra-home) .okra-shop-page {
    padding-top: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px) + var(--okra-header-content-gap-mobile)) !important;
  }

  body.okra-shop-wood:not(.okra-home) .okra-shop-page,
  body.okra-shop-chrome:not(.okra-home) .okra-shop-page {
    padding-top: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px) + var(--okra-header-content-gap-mobile)) !important;
  }

  body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-pdp-sticky-scope,
  body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-product-loading,
  body.okra-vintage-pdp:not(.okra-contact-page):not(.okra-auth) #wrapper > .okra-product-error {
    padding-top: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px) + var(--okra-header-content-gap-mobile)) !important;
  }

  html body.okra-policy-page:not(.okra-wishlist-page) #wrapper .okra-policy-sidebar {
    top: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
  }

  body.okra-home .okra-hero {
    padding-top: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px) + 14px) !important;
  }
}

body[data-view][data-material] #header.okra-header-shell,
body[data-view][data-material] #header.okra-header-shell.okra-glass-header {
  color: var(--okra-burgundy) !important;
}

body[data-view][data-material] #header.okra-header-shell::before,
body[data-view][data-material] #header.okra-header-shell.okra-glass-header::before {
  opacity: 0 !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body[data-view][data-material="wood"] #header.okra-header-shell .okra-brand img {
  filter: brightness(0) saturate(100%) invert(12%) sepia(65%) saturate(2508%) hue-rotate(351deg) brightness(83%) contrast(93%) !important;
}

body[data-view][data-material="chrome"] #header.okra-header-shell,
body[data-view][data-material="chrome"] #header.okra-header-shell.okra-glass-header {
  color: var(--okra-ivory) !important;
}

body[data-view][data-material="chrome"] #header.okra-header-shell .okra-brand img {
  filter: brightness(0) invert(1) !important;
}

body.okra-vintage-pdp:not(.okra-auth) #header.okra-header-shell.is-scrolled,
body.okra-vintage-pdp:not(.okra-auth) #header.okra-header-shell.okra-glass-header.is-scrolled,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.is-scrolled,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.okra-glass-header.is-scrolled,
body.okra-search-page #header.okra-header-shell.is-scrolled,
body.okra-search-page #header.okra-header-shell.okra-glass-header.is-scrolled,
body[data-view][data-material] #header.okra-header-shell.is-scrolled,
body[data-view][data-material] #header.okra-header-shell.okra-glass-header.is-scrolled {
  color: var(--okra-burgundy) !important;
  background: var(--okra-header-page-bg) !important;
  background-color: var(--okra-header-page-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--okra-header-page-border) !important;
  box-shadow: none !important;
}

body.okra-vintage-pdp:not(.okra-auth) #header.okra-header-shell.is-scrolled::before,
body.okra-vintage-pdp:not(.okra-auth) #header.okra-header-shell.okra-glass-header.is-scrolled::before,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.is-scrolled::before,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.okra-glass-header.is-scrolled::before,
body.okra-search-page #header.okra-header-shell.is-scrolled::before,
body.okra-search-page #header.okra-header-shell.okra-glass-header.is-scrolled::before,
body[data-view][data-material] #header.okra-header-shell.is-scrolled::before,
body[data-view][data-material] #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
  background: var(--okra-header-page-bg) !important;
  border-bottom-color: var(--okra-header-page-border) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

body.okra-vintage-pdp:not(.okra-auth) #header.okra-header-shell.is-scrolled .okra-brand img,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.is-scrolled .okra-brand img,
body.okra-search-page #header.okra-header-shell.is-scrolled .okra-brand img,
body[data-view][data-material] #header.okra-header-shell.is-scrolled .okra-brand img {
  filter: brightness(0) saturate(100%) invert(12%) sepia(65%) saturate(2508%) hue-rotate(351deg) brightness(83%) contrast(93%) !important;
}

body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #header.okra-header-shell,
body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #header.okra-header-shell.okra-glass-header,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.okra-glass-header,
body.okra-search-page #header.okra-header-shell,
body.okra-search-page #header.okra-header-shell.okra-glass-header,
html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell,
html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header,
html body.okra-search-page #wrapper #header.okra-header-shell,
html body.okra-search-page #wrapper #header.okra-header-shell.okra-glass-header {
  color: var(--okra-burgundy) !important;
  background: var(--okra-header-page-bg) !important;
  background-color: var(--okra-header-page-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--okra-header-page-border) !important;
  box-shadow: none !important;
}

body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #header.okra-header-shell::before,
body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #header.okra-header-shell.okra-glass-header::before,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell::before,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell.okra-glass-header::before,
body.okra-search-page #header.okra-header-shell::before,
body.okra-search-page #header.okra-header-shell.okra-glass-header::before,
html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell::before,
html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header::before,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell::before,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell.okra-glass-header::before,
html body.okra-search-page #wrapper #header.okra-header-shell::before,
html body.okra-search-page #wrapper #header.okra-header-shell.okra-glass-header::before {
  opacity: 1 !important;
  background: var(--okra-header-page-bg) !important;
  border-bottom-color: var(--okra-header-page-border) !important;
}

body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #header.okra-header-shell::after,
body.okra-policy-page:not(.okra-wishlist-page) #header.okra-header-shell::after,
body.okra-search-page #header.okra-header-shell::after,
html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell::after,
html body.okra-policy-page:not(.okra-wishlist-page) #wrapper #header.okra-header-shell::after,
html body.okra-search-page #wrapper #header.okra-header-shell::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
}

html body.okra-search-page #wrapper #header.okra-header-shell,
html body.okra-search-page #wrapper #header.okra-header-shell.okra-glass-header {
  position: fixed !important;
  height: var(--okra-header-h) !important;
  min-height: var(--okra-header-h) !important;
  color: var(--okra-burgundy) !important;
  background: var(--okra-header-page-bg) !important;
  background-color: var(--okra-header-page-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--okra-header-page-border) !important;
  box-shadow: none !important;
}

html body.okra-search-page #wrapper #header.okra-header-shell > .okra-topbar,
html body.okra-search-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  transform: none !important;
}

@media (max-width: 768px) {
  html body.okra-search-page #wrapper #header.okra-header-shell,
  html body.okra-search-page #wrapper #header.okra-header-shell.okra-glass-header {
    height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
  }

  html body.okra-search-page #wrapper #header.okra-header-shell > .okra-topbar,
  html body.okra-search-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
  }
}

body[data-view][data-material] main,
body[data-view][data-material] .viewport {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

html body.okra-auth #wrapper #header.okra-header-shell,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header {
  height: var(--okra-header-h) !important;
  min-height: var(--okra-header-h) !important;
  color: var(--okra-burgundy) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell::before,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header::before {
  opacity: 0 !important;
  background: var(--okra-header-page-bg) !important;
  border-bottom: 1px solid var(--okra-header-page-border) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled::before,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
}

html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  padding: 0 var(--okra-header-side-padding) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
  background: transparent !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-brand,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header .okra-brand {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  align-self: center !important;
  transform: none !important;
  color: currentColor !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-brand img,
html body.okra-auth.okra-vintage-pdp #wrapper #header.okra-header-shell .okra-brand img,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header .okra-brand img {
  width: auto !important;
  height: clamp(34px, 3vw, 50px) !important;
  max-width: min(32vw, 164px) !important;
  filter: brightness(0) saturate(100%) invert(12%) sepia(65%) saturate(2508%) hue-rotate(351deg) brightness(83%) contrast(93%) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-menu-toggle,
html body.okra-auth #wrapper #header.okra-header-shell .okra-header-wishlist-link,
html body.okra-auth #wrapper #header.okra-header-shell .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell .okra-cart-link,
html body.okra-auth #wrapper #header.okra-header-shell .okra-header-actions > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell .okra-header-actions > .okra-cart-link {
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  color: currentColor !important;
  transform: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-menu-toggle,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-wishlist-link,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-cart-link,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions > .okra-cart-link {
  color: var(--okra-burgundy) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg path,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg line,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg circle,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg rect {
  color: var(--okra-burgundy) !important;
  stroke: var(--okra-burgundy) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
}

html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin-left: calc(44px + var(--okra-header-icon-gap)) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-search-trigger {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  margin-right: calc(44px + var(--okra-header-icon-gap)) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-cart-link {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
}

@media (max-width: 768px) {
  html body.okra-auth #wrapper #header.okra-header-shell,
  html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header {
    height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
  }

  html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar,
  html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
  }

  html body.okra-auth #wrapper #header.okra-header-shell .okra-brand img,
  html body.okra-auth.okra-vintage-pdp #wrapper #header.okra-header-shell .okra-brand img,
  html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header .okra-brand img {
    height: clamp(34px, 8.5vw, 40px) !important;
    max-width: min(30vw, 112px) !important;
  }

  html body.okra-auth #wrapper #header.okra-header-shell .okra-menu-toggle,
  html body.okra-auth #wrapper #header.okra-header-shell .okra-header-wishlist-link,
  html body.okra-auth #wrapper #header.okra-header-shell .okra-search-trigger,
  html body.okra-auth #wrapper #header.okra-header-shell .okra-cart-link,
  html body.okra-auth #wrapper #header.okra-header-shell .okra-header-actions > .okra-search-trigger,
  html body.okra-auth #wrapper #header.okra-header-shell .okra-header-actions > .okra-cart-link {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
  }

  html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link {
    margin-left: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-search-trigger {
    margin-right: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  html body.okra-auth #wrapper #header.okra-header-shell > .okra-topbar > .okra-header-actions {
    height: 40px !important;
    gap: var(--okra-header-icon-gap-mobile) !important;
  }
}

html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) {
  height: var(--okra-auth-top-header-h, var(--okra-header-h)) !important;
  min-height: var(--okra-auth-top-header-h, var(--okra-header-h)) !important;
  color: var(--okra-ivory) !important;
  background: var(--okra-header-auth-bg) !important;
  background-color: var(--okra-header-auth-bg) !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled)::before {
  opacity: 0 !important;
}

html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled {
  color: var(--okra-burgundy) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-menu-toggle,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-header-wishlist-link,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-cart-link,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-header-actions,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar > .okra-header-actions > .okra-cart-link {
  color: var(--okra-ivory) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar svg,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar svg path,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar svg line,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar svg circle,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-topbar svg rect {
  color: var(--okra-ivory) !important;
  stroke: var(--okra-ivory) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) .okra-brand img {
  filter: brightness(0) invert(1) !important;
}

@media (max-width: 768px) {
  html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header:not(.is-scrolled) {
    height: calc(var(--okra-auth-top-header-h-mobile, var(--okra-header-h-mobile)) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-auth-top-header-h-mobile, var(--okra-header-h-mobile)) + env(safe-area-inset-top, 0px)) !important;
  }
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
  transform: none !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link {
  position: relative !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  left: 0 !important;
  transform: none !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin: 0 !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin: 0 0 0 calc(44px + var(--okra-header-icon-gap)) !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  align-self: center !important;
  margin: 0 !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  margin: 0 calc(44px + var(--okra-header-icon-gap)) 0 0 !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  margin: 0 !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  height: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link {
  grid-column: auto !important;
  grid-row: auto !important;
  justify-self: auto !important;
  margin: 0 !important;
}

@media (max-width: 768px) {
  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
  }

  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
  }

  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link {
    margin-left: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger {
    margin-right: calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  html body #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
  html body #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions {
    height: 40px !important;
    min-height: 40px !important;
    gap: var(--okra-header-icon-gap-mobile) !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 var(--okra-header-side-padding-mobile) !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-search-trigger,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-cart-link,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link {
    position: relative !important;
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    transform: none !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-menu-toggle {
    grid-column: 1 !important;
    justify-self: start !important;
    margin: 0 !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-wishlist-link {
    grid-column: 1 !important;
    justify-self: start !important;
    margin: 0 0 0 calc(40px + var(--okra-header-icon-gap-mobile)) !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-brand {
    grid-column: 2 !important;
    justify-self: center !important;
    align-self: center !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    width: auto !important;
    height: 40px !important;
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--okra-header-icon-gap-mobile) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
  html body.okra-policy-page.okra-wishlist-page #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-search-trigger,
  html body.okra-vintage-pdp:not(.okra-auth):not(.okra-contact-page) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar > .okra-header-actions > .okra-cart-link {
    grid-column: auto !important;
    justify-self: auto !important;
    margin: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #header.okra-header-shell,
  #header.okra-header-shell *,
  html body[class] #wrapper #header.okra-header-shell,
  html body[class] #wrapper #header.okra-header-shell *,
  .okra-header-icon-button,
  .okra-header-icon-btn {
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
  }
}

/* Shop-style scroll header: transparent at page top, solid ivory only after scroll. */
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: var(--okra-header-h) !important;
  min-height: var(--okra-header-h) !important;
  color: var(--okra-burgundy) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
  opacity: 1 !important;
}

html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header::before {
  opacity: 0 !important;
  background: var(--okra-header-page-bg) !important;
  background-color: var(--okra-header-page-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--okra-header-page-border) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell::after,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header::after,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell::after,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell > .okra-topbar,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell > .okra-topbar,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell .okra-brand img {
  filter: brightness(0) saturate(100%) invert(12%) sepia(65%) saturate(2508%) hue-rotate(351deg) brightness(83%) contrast(93%) !important;
}

html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell,
html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header,
html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell,
html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.is-scrolled,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.is-scrolled,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header.is-scrolled {
  background: var(--okra-header-page-bg) !important;
  background-color: var(--okra-header-page-bg) !important;
  background-image: none !important;
  border-bottom-color: var(--okra-header-page-border) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell::before,
html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header::before,
html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell::before,
html.okra-header-is-scrolled body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.is-scrolled::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.is-scrolled::before,
html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
  background: var(--okra-header-page-bg) !important;
  background-color: var(--okra-header-page-bg) !important;
  background-image: none !important;
  border-bottom-color: var(--okra-header-page-border) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

@media (max-width: 768px) {
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell,
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header,
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell,
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header {
    height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
  }

  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell > .okra-topbar,
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #wrapper #header.okra-header-shell.okra-glass-header > .okra-topbar,
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell > .okra-topbar,
  html body:not(.okra-home):not(.okra-shop-chrome):not([data-theme="chrome"]):not([data-material="chrome"]) #header.okra-header-shell.okra-glass-header > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
  }
}

/* Home uses an artwork overlay header, not the shop ivory scroll header at page top. */
html body.okra-home #header.okra-header-shell,
html body.okra-home #header.okra-header-shell.okra-glass-header,
html body.okra-home .okra-stage #header.okra-header-shell,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header {
  --header-icon-size: 24px;
  --header-icon-button-size: 44px;
  --okra-home-header-gutter: var(--okra-shared-header-gutter, clamp(1rem, 3.2vw, 3rem));
  --okra-home-header-icon-top: var(--okra-shared-header-icon-top, clamp(1.2rem, 2.65vw, 2.2rem));
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: var(--okra-shared-header-min-height, clamp(4.45rem, 8.5vw, 7.25rem)) !important;
  color: var(--okra-ivory) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.okra-home #header.okra-header-shell::before,
html body.okra-home #header.okra-header-shell.okra-glass-header::before,
html body.okra-home .okra-stage #header.okra-header-shell::before,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header::before,
html body.okra-home #header.okra-header-shell::after,
html body.okra-home #header.okra-header-shell.okra-glass-header::after,
html body.okra-home .okra-stage #header.okra-header-shell::after,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header::after {
  opacity: 0 !important;
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar,
html body.okra-home #header.okra-header-shell.okra-glass-header > .okra-topbar,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: var(--okra-shared-header-min-height, clamp(4.45rem, 8.5vw, 7.25rem)) !important;
  margin: 0 !important;
  padding: var(--okra-shared-header-pad-top, clamp(1.15rem, 2.45vw, 2.15rem)) var(--okra-home-header-gutter) 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-brand,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-brand {
  position: static !important;
  inset: auto !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-brand img,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-brand img {
  width: auto !important;
  height: var(--okra-shared-logo-height, clamp(2.65rem, 3vw, 4.75rem)) !important;
  max-width: none !important;
  max-height: none !important;
  filter: brightness(0) invert(1) drop-shadow(0 10px 18px rgba(0, 0, 0, 0.16)) !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-cart-link {
  position: absolute !important;
  top: var(--okra-home-header-icon-top) !important;
  bottom: auto !important;
  width: var(--header-icon-button-size) !important;
  height: var(--header-icon-button-size) !important;
  min-width: var(--header-icon-button-size) !important;
  min-height: var(--header-icon-button-size) !important;
  max-width: var(--header-icon-button-size) !important;
  max-height: var(--header-icon-button-size) !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--okra-ivory) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-menu-toggle {
  left: var(--okra-home-header-gutter) !important;
  right: auto !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-cart-link {
  right: var(--okra-home-header-gutter) !important;
  left: auto !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-search-trigger {
  right: calc(var(--okra-home-header-gutter) + var(--header-icon-button-size) + var(--okra-header-icon-gap, 14px)) !important;
  left: auto !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell.okra-glass-header,
html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell,
html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header,
html body.okra-home #header.okra-header-shell.is-scrolled,
html body.okra-home #header.okra-header-shell.okra-glass-header.is-scrolled,
html body.okra-home .okra-stage #header.okra-header-shell.is-scrolled,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header.is-scrolled {
  --okra-home-header-icon-top: calc((var(--okra-header-h) - var(--header-icon-button-size)) / 2);
  position: fixed !important;
  height: var(--okra-header-h) !important;
  min-height: var(--okra-header-h) !important;
  background: #25110d !important;
  background-color: #25110d !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(248, 239, 228, 0.12) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar {
  height: 100% !important;
  min-height: 100% !important;
  padding-top: 0 !important;
  align-items: center !important;
}

/* Home header can receive a generated wishlist link and action wrapper after load. */
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link {
  position: absolute !important;
  top: var(--okra-home-header-icon-top) !important;
  right: auto !important;
  bottom: auto !important;
  left: calc(var(--okra-home-header-gutter) + var(--header-icon-button-size) + var(--okra-header-icon-gap, 14px)) !important;
  width: var(--header-icon-button-size) !important;
  height: var(--header-icon-button-size) !important;
  min-width: var(--header-icon-button-size) !important;
  min-height: var(--header-icon-button-size) !important;
  max-width: var(--header-icon-button-size) !important;
  max-height: var(--header-icon-button-size) !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--okra-ivory) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-actions {
  position: absolute !important;
  top: var(--okra-home-header-icon-top) !important;
  right: var(--okra-home-header-gutter) !important;
  bottom: auto !important;
  left: auto !important;
  width: auto !important;
  height: var(--header-icon-button-size) !important;
  min-height: var(--header-icon-button-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap, 14px) !important;
  color: var(--okra-ivory) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions > .okra-cart-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-actions > .okra-cart-link {
  position: relative !important;
  inset: auto !important;
  width: var(--header-icon-button-size) !important;
  height: var(--header-icon-button-size) !important;
  min-width: var(--header-icon-button-size) !important;
  min-height: var(--header-icon-button-size) !important;
  max-width: var(--header-icon-button-size) !important;
  max-height: var(--header-icon-button-size) !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--okra-ivory) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* When home is scrolled, match the shop header geometry exactly. */
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell.okra-glass-header > .okra-topbar,
html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar,
html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header > .okra-topbar,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar,
html body.okra-home #header.okra-header-shell.okra-glass-header.is-scrolled > .okra-topbar,
html body.okra-home .okra-stage #header.okra-header-shell.is-scrolled > .okra-topbar,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header.is-scrolled > .okra-topbar {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-brand,
html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-brand,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-brand,
html body.okra-home .okra-stage #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-brand {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  justify-self: center !important;
  align-self: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-brand img,
html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-brand img,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-brand img,
html body.okra-home .okra-stage #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-brand img {
  width: auto !important;
  height: clamp(34px, 3vw, 50px) !important;
  max-width: min(32vw, 164px) !important;
  max-height: none !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-menu-toggle,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-header-wishlist-link,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-search-trigger,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-cart-link,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-header-actions {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: 0 !important;
  transform: none !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin: 0 !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-header-wishlist-link {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  margin: 0 0 0 calc(44px + var(--okra-header-icon-gap)) !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-search-trigger {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  margin: 0 calc(44px + var(--okra-header-icon-gap)) 0 0 !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-cart-link {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  margin: 0 !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions,
html body.okra-home #header.okra-header-shell.is-scrolled > .okra-topbar > .okra-header-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  height: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Final home alignment: same header geometry as shop, transparent until scroll. */
html body.okra-home #header.okra-header-shell,
html body.okra-home #header.okra-header-shell.okra-glass-header,
html body.okra-home .okra-stage #header.okra-header-shell,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: var(--okra-header-h) !important;
  min-height: var(--okra-header-h) !important;
  color: var(--okra-ivory) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.okra-header-is-scrolled body.okra-home #header.okra-header-shell,
html.okra-header-is-scrolled body.okra-home #header.okra-header-shell.okra-glass-header,
html body.okra-home #header.okra-header-shell.is-scrolled,
html body.okra-home #header.okra-header-shell.okra-glass-header.is-scrolled {
  background: #25110d !important;
  background-color: #25110d !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(248, 239, 228, 0.12) !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar,
html body.okra-home #header.okra-header-shell.okra-glass-header > .okra-topbar,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar,
html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header > .okra-topbar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 var(--okra-header-side-padding) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-brand,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-brand {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  justify-self: center !important;
  align-self: center !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-brand img,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-brand img {
  display: block !important;
  width: auto !important;
  height: clamp(34px, 3vw, 50px) !important;
  max-width: min(32vw, 164px) !important;
  max-height: none !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-actions {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: 0 !important;
  transform: none !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-menu-toggle,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-wishlist-link {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  margin: 0 0 0 calc(44px + var(--okra-header-icon-gap)) !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-search-trigger,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-search-trigger {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  margin: 0 calc(44px + var(--okra-header-icon-gap)) 0 0 !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-cart-link,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-cart-link {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
}

html body.okra-home #header.okra-header-shell > .okra-topbar > .okra-header-actions,
html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar > .okra-header-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  height: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--okra-header-icon-gap) !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 768px) {
  html body.okra-home #header.okra-header-shell,
  html body.okra-home #header.okra-header-shell.okra-glass-header,
  html body.okra-home .okra-stage #header.okra-header-shell,
  html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header {
    height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    padding-top: env(safe-area-inset-top, 0px) !important;
  }

  html body.okra-home #header.okra-header-shell > .okra-topbar,
  html body.okra-home .okra-stage #header.okra-header-shell > .okra-topbar {
    padding: 0 var(--okra-header-side-padding-mobile) !important;
  }

  html.okra-header-is-scrolled body.okra-home #header.okra-header-shell,
  html.okra-header-is-scrolled body.okra-home #header.okra-header-shell.okra-glass-header,
  html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell,
  html.okra-header-is-scrolled body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header,
  html body.okra-home #header.okra-header-shell.is-scrolled,
  html body.okra-home #header.okra-header-shell.okra-glass-header.is-scrolled,
  html body.okra-home .okra-stage #header.okra-header-shell.is-scrolled,
  html body.okra-home .okra-stage #header.okra-header-shell.okra-glass-header.is-scrolled {
    height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-header-h-mobile) + env(safe-area-inset-top, 0px)) !important;
  }
}

/* Auth pages start on the solid brand header. */
html body.okra-auth #wrapper #header.okra-header-shell,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header {
  height: var(--okra-auth-top-header-h, var(--okra-header-h)) !important;
  min-height: var(--okra-auth-top-header-h, var(--okra-header-h)) !important;
  color: var(--okra-ivory) !important;
  background: var(--okra-header-auth-bg, #361C19) !important;
  background-color: var(--okra-header-auth-bg, #361C19) !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(248, 239, 228, 0.14) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body.okra-auth #wrapper #header.okra-header-shell::before,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header::before {
  opacity: 1 !important;
  background: var(--okra-header-auth-bg, #361C19) !important;
  background-color: var(--okra-header-auth-bg, #361C19) !important;
  background-image: none !important;
  border-bottom-color: rgba(248, 239, 228, 0.14) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-menu-toggle,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-wishlist-link,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-cart-link,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions > .okra-cart-link {
  color: var(--okra-ivory) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg path,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg line,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg circle,
html body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg rect {
  color: var(--okra-ivory) !important;
  stroke: var(--okra-ivory) !important;
}

html body.okra-auth #wrapper #header.okra-header-shell .okra-brand img,
html body.okra-auth.okra-vintage-pdp #wrapper #header.okra-header-shell .okra-brand img,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header .okra-brand img {
  filter: brightness(0) invert(1) !important;
}

html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled {
  color: var(--okra-burgundy) !important;
  background: var(--okra-header-page-bg, #f8efe4) !important;
  background-color: var(--okra-header-page-bg, #f8efe4) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--okra-header-page-border, rgba(85, 25, 18, 0.12)) !important;
}

html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell::before,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header::before,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled::before,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled::before {
  opacity: 1 !important;
  background: var(--okra-header-page-bg, #f8efe4) !important;
  background-color: var(--okra-header-page-bg, #f8efe4) !important;
  background-image: none !important;
  border-bottom-color: var(--okra-header-page-border, rgba(85, 25, 18, 0.12)) !important;
}

html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-menu-toggle,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-wishlist-link,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-search-trigger,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-cart-link,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions > .okra-search-trigger,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar > .okra-header-actions > .okra-cart-link,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-menu-toggle,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-header-wishlist-link,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-cart-link,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-header-actions,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-header-actions > .okra-search-trigger,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar > .okra-header-actions > .okra-cart-link {
  color: var(--okra-burgundy) !important;
}

html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg path,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg line,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg circle,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-topbar svg rect,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar svg,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar svg path,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar svg line,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar svg circle,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-topbar svg rect {
  color: var(--okra-burgundy) !important;
  stroke: var(--okra-burgundy) !important;
}

html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell .okra-brand img,
html.okra-header-is-scrolled body.okra-auth.okra-vintage-pdp #wrapper #header.okra-header-shell .okra-brand img,
html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header .okra-brand img,
html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled .okra-brand img,
html body.okra-auth.okra-vintage-pdp #wrapper #header.okra-header-shell.is-scrolled .okra-brand img,
html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled .okra-brand img {
  filter: brightness(0) saturate(100%) invert(12%) sepia(65%) saturate(2508%) hue-rotate(351deg) brightness(83%) contrast(93%) !important;
}

@media (max-width: 768px) {
  html body.okra-auth #wrapper #header.okra-header-shell,
  html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header,
  html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell,
  html.okra-header-is-scrolled body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header,
  html body.okra-auth #wrapper #header.okra-header-shell.is-scrolled,
  html body.okra-auth #wrapper #header.okra-header-shell.okra-glass-header.is-scrolled {
    height: calc(var(--okra-auth-top-header-h-mobile, var(--okra-header-h-mobile)) + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(var(--okra-auth-top-header-h-mobile, var(--okra-header-h-mobile)) + env(safe-area-inset-top, 0px)) !important;
  }
}
