/** Shopify CDN: Minification failed

Line 114:1 Unexpected "/"

**/
/* designed + developed by bungalow creative */

/* fonts */

/* variables */
:root {
  /* colors */
  --ivory: #fbf8f0;
  --parchment: #e6e4d7;
  --sage: #b1b09c;
  --stone: #5a554c;
  --timber: #2f2217;
  --papyrus: #f2ecdb;
  --opacity-subdued-text: 1;
}

/************/
/* code to update upon theme update */

/* 1. home page */

[class*="bc_fixed_image_banner_NwR6YW"] .bc-fib-heading,
[class*="bc_fixed_image_banner_NwR6YW"] .bc-fib-heading * {
  /*background-image: url('/cdn/shop/files/grunge-style-gold-foil-texture-background_1.jpg?v=1787595867');
  background-size: 100% auto;
  background-position: 50% 42%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
          color: transparent;*/
}

[class*="bc_image_text_split_mp7WQ6"] .bc-fib-reviews-text strong,
[class*="bc_image_text_split_mp7WQ6"] .bc-fib-reviews-text em,
[class*="bc_fixed_image_banner_NwR6YW"] .bc-fib-reviews-text strong,
[class*="bc_fixed_image_banner_NwR6YW"] .bc-fib-reviews-text em,
[class*="wonderwick_custom_hero_main"] .bc-fib-reviews-text strong,
[class*="wonderwick_custom_hero_main"] .bc-fib-reviews-text em {
  background-image: none !important;
  padding-bottom: 0 !important;
}
[class*="bc_image_text_split_mp7WQ6"]
  .bc-fib-reviews-text
  strong:last-of-type::before,
[class*="wonderwick_custom_hero_main"]
  .bc-fib-reviews-text
  strong:last-of-type::before {
  content: "";
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  margin: 0 0.4em 0 0.25em;
  vertical-align: -0.2em;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><polygon fill='%232f2217' points='20.00,0.00 23.24,3.72 27.65,1.52 29.22,6.20 34.14,5.86 33.80,10.78 38.48,12.35 36.28,16.76 40.00,20.00 36.28,23.24 38.48,27.65 33.80,29.22 34.14,34.14 29.22,33.80 27.65,38.48 23.24,36.28 20.00,40.00 16.76,36.28 12.35,38.48 10.78,33.80 5.86,34.14 6.20,29.22 1.52,27.65 3.72,23.24 0.00,20.00 3.72,16.76 1.52,12.35 6.20,10.78 5.86,5.86 10.78,6.20 12.35,1.52 16.76,3.72'/><path d='M13 20.5 L18 25.5 L28 14.5' fill='none' stroke='%23FDF8EF' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

[class*="bc_fixed_image_banner_NwR6YW"]
  .bc-fib-reviews-text
  strong:last-of-type::before {
  content: "";
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  margin: 0 0.4em 0 0.25em;
  vertical-align: -0.2em;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><polygon fill='%23FDF8EF' points='20.00,0.00 23.24,3.72 27.65,1.52 29.22,6.20 34.14,5.86 33.80,10.78 38.48,12.35 36.28,16.76 40.00,20.00 36.28,23.24 38.48,27.65 33.80,29.22 34.14,34.14 29.22,33.80 27.65,38.48 23.24,36.28 20.00,40.00 16.76,36.28 12.35,38.48 10.78,33.80 5.86,34.14 6.20,29.22 1.52,27.65 3.72,23.24 0.00,20.00 3.72,16.76 1.52,12.35 6.20,10.78 5.86,5.86 10.78,6.20 12.35,1.52 16.76,3.72'/><path d='M13 20.5 L18 25.5 L28 14.5' fill='none' stroke='%232f2217' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/************/

html,
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* remove weird button box shadow */
.button:not([disabled]):hover:after,
.shopify-challenge__button:hover:after,
.customer button:hover:after,
.shopify-payment-button__button--unbranded:hover:after {
  box-shadow: none;
}

.button:after {
  box-shadow: none !important;
}

.button:hover:after {
  box-shadow: none !important;
}

/* horizon text styling*/

/* .h0      { font-family: var(--bc-h0-family); font-weight: var(--bc-h0-weight); letter-spacing: var(--bc-h0-letter-spacing); text-transform: var(--bc-h0-transform); }*/
span.jdgm-reviewer-name {
  font-family: var(--bc-h1-family) !important;
  font-weight: var(--bc-h1-weight) !important;
  letter-spacing: var(--bc-h1-letter-spacing) !important;
  text-transform: var(--bc-h1-transform) !important;
}
*/
/* h2, .h2  { font-family: var(--bc-h2-family); font-weight: var(--bc-h2-weight); letter-spacing: var(--bc-h2-letter-spacing); text-transform: var(--bc-h2-transform); }*/
span.jdgm-rev__author, .account__heading, .jdgm-cards-carousel h2.jdgm-title {
  font-family: var(--bc-h3-family) !important;
  font-weight: var(--bc-h3-weight) !important;
  letter-spacing: var(--bc-h3-letter-spacing) !important;
  text-transform: var(--bc-h3-transform) !important;
}
a.cart-items__title,
text-component.cart-totals__total-value.cart-secondary-typography {
  font-family: var(--bc-h4-family);
  font-weight: var(--bc-h4-weight);
  letter-spacing: var(--bc-h4-letter-spacing);
  text-transform: var(--bc-h4-transform);
}
.menu-list__link-title,
p.announcement-bar__text,
legend,
a.jdgm-write-rev-link,
span.jdgm-rev-widg__summary-average,
.jdgm-histogram__frequency,
select.jdgm-sort-dropdown,
time.jdgm-rev__timestamp,
.facets__form *,
.cart-items__variant dt,
.cart-items__variant dd,
td.cart-items__price.cart-secondary-typography,
.jdgm-header-info * {
  font-family: var(--bc-h5-family);
  font-weight: var(--bc-h5-weight);
  letter-spacing: var(--bc-h5-letter-spacing);
  text-transform: var(--bc-h5-transform);
}
/* h6, .h6  { font-family: var(--bc-h6-family); font-weight: var(--bc-h6-weight); letter-spacing: var(--bc-h6-letter-spacing); text-transform: var(--bc-h6-transform); }*/
span.checkbox__label-text {
  font-family: var(--bc-body-1-family);
  font-weight: var(--bc-body-1-weight);
  letter-spacing: var(--bc-body-1-letter-spacing);
  text-transform: var(--bc-body-1-transform);
}
/************/
/* 1b. type scale — mirrors theme heading settings; plop selectors below */

:root {
  --fs-h0: 96px;
  --fs-h1: 64px;
  --fs-h2: 48px;
  --fs-h3: 36px;
  --fs-h4: 28px;
  --fs-h5: 18px;
  --fs-h6: 18px;
  --fs-body1: 18px;
  --fs-body2: 14px;
}

@media screen and (max-width: 989px) {
  :root {
    --fs-h0: 72px;
    --fs-h1: 48px;
    --fs-h2: 40px;
    --fs-h3: 32px;
    --fs-h4: 24px;
    --fs-h5: 18px;
    --fs-h6: 16px;
    --fs-body1: 17px;
    --fs-body2: 14px;
  }
}

@media screen and (max-width: 749px) {
  :root {
    --fs-h0: 48px;
    --fs-h1: 36px;
    --fs-h2: 32px;
    --fs-h3: 28px;
    --fs-h4: 22px;
    --fs-h5: 16px;
    --fs-h6: 14px;
    --fs-body1: 17px;
    --fs-body2: 13px;
  }
}

a.cart-items__title {
  font-size: var(--fs-h4) !important;
}

summary.details__header {
  font-size: var(--fs-h5) !important;
}

body,
.paragraph:not(.button),
.paragraph > *,
.text-block.paragraph :is(h1, h2, h3, h4, h5, h6),
span.cart-note__label.cart-primary-typography,
span.cart-discount__label.cart-primary-typography,
.cart-items__details * {
  font-size: var(--fs-body1) !important;
}

.menu-list__link-title,
p.announcement-bar__text,
.variant-option legend,
span.jdgm-rev-widg__summary-average,
select.jdgm-sort-dropdown {
  font-size: var(--fs-body2) !important;
}

/************/
/* 2. buttons - plaque shape */

/* gold-foil hover ink: registered so the ivory ink layer painted over the
   always-present gold texture can TRANSITION to transparent (a plain custom
   property can't animate). Used by the ATC buttons' hover. */
@property --wf-foil-ink {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}

.skip-to-content-link:not(:focus) {
  position: absolute !important;
}

.button-unstyled,
.button--unstyled {
  display: block;
  padding: 0;
  background-color: inherit;
  color: var(--color-foreground);
  border: 0;
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
  font-family: var(--font-paragraph--family);
  font-style: var(--font-paragraph--style);
  font-size: var(--font-paragraph--size);
}

.button-unstyled:hover,
.button--unstyled:hover {
  background-color: inherit;
}

.button-unstyled--with-icon {
  color: var(--color-foreground);
  display: flex;
  gap: var(--gap-2xs);
  align-items: center;
}

.button-unstyled--transparent {
  background-color: transparent;
  box-shadow: none;
}

.button:not(
  .button-unstyled,
  .button--unstyled,
  .quick-add__button,
  .dropdown-localization__button,
  .cart-items__remove,
  .variant-item__remove,
  .close-button,
  .menu-drawer__back-button,
  .predictive-search__close-modal-button,
  .predictive-search__search-button
),
.button-secondary:not(.button-unstyled, .facets__clear-all),
.button-custom,
button.shopify-payment-button__button--unbranded,
.bc-button-1,
.bc-button-2,
.bc-button-3 {
  --wf-capr: 0.35938;
  --wf-bwr: 0.03125;
  --wf-insr: 0.07031;
  --wf-ibwr: 0.02813;
  --wf-cap: calc(var(--wf-bh) * var(--wf-capr));
  --wf-bw: calc(var(--wf-bh) * var(--wf-bwr));
  --wf-ins: calc(var(--wf-bh) * var(--wf-insr));
  --wf-ibw: calc(var(--wf-bh) * var(--wf-ibwr));
  --wf-pad-y: 12px;
  position: relative;
  isolation: isolate;
  background-color: transparent;
  box-shadow: none;
  border-width: 0;
  border-radius: 0;
}

.button:not(
    .button-unstyled,
    .button--unstyled,
    .quick-add__button,
    .dropdown-localization__button,
    .cart-items__remove,
    .variant-item__remove,
    .close-button,
    .menu-drawer__back-button,
    .predictive-search__close-modal-button,
    .predictive-search__search-button
  ):hover,
.button-secondary:not(.button-unstyled, .facets__clear-all):hover,
.button-custom:hover,
button.shopify-payment-button__button--unbranded:hover,
.bc-button-1:hover,
.bc-button-2:hover,
.bc-button-3:hover {
  background-color: transparent;
}

.button:not(
  .button-unstyled,
  .button--unstyled,
  .quick-add__button,
  .dropdown-localization__button,
  .cart-items__remove,
  .variant-item__remove,
  .close-button,
  .menu-drawer__back-button,
  .predictive-search__close-modal-button,
  .predictive-search__search-button
),
.button-secondary:not(.button-unstyled, .facets__clear-all),
.button-custom,
button.shopify-payment-button__button--unbranded {
  --wf-bh: calc(
    (var(--button-padding-block, 16px) + var(--wf-pad-y)) * 2 + 1.4em
  );
  padding-block: calc(var(--button-padding-block, 16px) + var(--wf-pad-y));
  padding-inline: calc(var(--button-padding-inline, 24px) + var(--wf-cap));
  min-width: calc(var(--wf-cap) * 2 + 72px);
}

.button.add-to-cart-button:not(.quick-add__button),
.button-secondary.add-to-cart-button {
  --wf-pad-y: 0px;
  --height-buy-buttons: 64px;
  --wf-bh: var(--height-buy-buttons, 52px);
  height: var(--height-buy-buttons);
  padding-block: 0;
}

.button.cart__checkout-button,
.button.cart-discount__button {
  --wf-pad-y: 0px;
  --wf-bh: 56px;
  height: 56px;
  padding-block: 0;
}

/* empty-cart Continue Shopping: its .button-text is a block with line-height 1,
   so the line box is 1lh (13px), not 1.4em. Mismatched --wf-bh letterboxes the
   cap SVG and leaves a 1px seam at the right cap. */
.button.cart-items__empty-button {
  --wf-bh: calc((var(--button-padding-block, 16px) + var(--wf-pad-y)) * 2 + 1lh);
}

.button.add-to-cart-button:not(.quick-add__button),
.button-secondary.add-to-cart-button:not(.quick-add__button) {
  font-family: var(--bc-font-heading);
  font-weight: 600;
  font-size: 20px;
  line-height: var(--bc-button-1-line-height);
  letter-spacing: 0.05em;
}

.bc-button-1 {
  --wf-bh: calc((var(--bc-btn1-padding-y) + var(--wf-pad-y)) * 2 + 1lh);
  padding-block: calc(var(--bc-btn1-padding-y) + var(--wf-pad-y));
  padding-inline: calc(var(--bc-btn1-padding-x) + var(--wf-cap));
  min-width: calc(var(--wf-cap) * 2 + 72px);
}

.bc-button-2 {
  --wf-bh: calc((var(--bc-btn2-padding-y) + var(--wf-pad-y)) * 2 + 1lh);
  padding-block: calc(var(--bc-btn2-padding-y) + var(--wf-pad-y));
  padding-inline: calc(var(--bc-btn2-padding-x) + var(--wf-cap));
  min-width: calc(var(--wf-cap) * 2 + 72px);
}

.bc-button-3 {
  --wf-bh: calc((var(--bc-btn3-padding-y) + var(--wf-pad-y)) * 2 + 1lh);
  padding-block: calc(var(--bc-btn3-padding-y) + var(--wf-pad-y));
  padding-inline: calc(var(--bc-btn3-padding-x) + var(--wf-cap));
  min-width: calc(var(--wf-cap) * 2 + 72px);
}

.button:not(
    .button-unstyled,
    .button--unstyled,
    .quick-add__button,
    .dropdown-localization__button,
    .cart-items__remove,
    .variant-item__remove,
    .close-button,
    .menu-drawer__back-button,
    .predictive-search__close-modal-button,
    .predictive-search__search-button
  )::before,
.button-secondary:not(.button-unstyled, .facets__clear-all)::before,
.button-custom::before,
button.shopify-payment-button__button--unbranded::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-color: var(--bc-btn1-bg, var(--button-background-color));
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center;
  mask-position:
    left center,
    right center,
    center;
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 100%;
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 100%;
}

.button-secondary:not(.button-unstyled, .facets__clear-all)::before,
.button-custom::before {
  background-color: var(--button-background-color);
}

.button:not(
    .button-unstyled,
    .button--unstyled,
    .quick-add__button,
    .dropdown-localization__button,
    .cart-items__remove,
    .variant-item__remove,
    .close-button,
    .menu-drawer__back-button,
    .predictive-search__close-modal-button,
    .predictive-search__search-button
  ):hover::before,
button.shopify-payment-button__button--unbranded:hover::before {
  background-color: var(--bc-btn1-bg-hover, var(--button-background-color));
}

.button:not(
    .button-unstyled,
    .button--unstyled,
    .button-secondary,
    .quick-add__button,
    .dropdown-localization__button,
    .cart-items__remove,
    .variant-item__remove,
    .close-button,
    .menu-drawer__back-button,
    .predictive-search__close-modal-button,
    .predictive-search__search-button
  )::after,
.button-custom::after,
button.shopify-payment-button__button--unbranded::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: var(--bc-btn1-text, var(--button-color));
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  mask-position:
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
}

.button-custom::after {
  background-color: var(--button-color);
}

.button-secondary:not(.button-unstyled, .facets__clear-all)::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: var(--button-border-color);
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center 0,
    center 100%,
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  mask-position:
    left center,
    right center,
    center 0,
    center 100%,
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw),
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw),
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
}

.bc-button-1::before,
.bc-button-3::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-color: var(--bc-btn1-bg);
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center;
  mask-position:
    left center,
    right center,
    center;
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 100%;
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 100%;
}

.bc-button-3::before {
  background-color: var(--bc-btn3-bg);
}

.bc-button-1:hover::before {
  background-color: var(--bc-btn1-bg-hover);
}
.bc-button-3:hover::before {
  background-color: var(--bc-btn3-bg-hover);
}

.bc-button-1::after,
.bc-button-3::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: var(--bc-btn1-text);
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  mask-position:
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
}

.bc-button-3::after {
  background-color: var(--bc-btn3-text);
}

.bc-button-1:hover::after {
  background-color: var(--bc-btn1-text-hover);
}
.bc-button-3:hover::after {
  background-color: var(--bc-btn3-text-hover);
}

.bc-button-2::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-color: var(--bc-btn2-bg);
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%201.00%20L%2018.00%201.00%20L%2018.00%207.00%20L%2010.00%207.00%20L%2010.00%2014.60%20C%20-2.00%2024.17%20-2.00%2039.83%2010.00%2049.40%20L%2010.00%2057.00%20L%2018.00%2057.00%20L%2018.00%2063.00%20L%2023.00%2063.00%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222.0%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center 0,
    center 100%;
  mask-position:
    left center,
    right center,
    center 0,
    center 100%;
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw);
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-bw);
}

.bc-button-2::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: var(--bc-btn2-bg);
  transition: background-color 0.3s ease;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  mask-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),
    linear-gradient(#000, #000), linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  mask-position:
    left center,
    right center,
    center var(--wf-ins),
    center calc(100% - var(--wf-ins));
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw),
    calc(100% - 2 * var(--wf-cap) + 2px) var(--wf-ibw);
}

.bc-button-2:hover::before,
.bc-button-2:hover::after {
  background-color: var(--bc-btn2-bg-hover);
}

.button:not(
    .button-unstyled,
    .button--unstyled,
    .quick-add__button,
    .dropdown-localization__button,
    .cart-items__remove,
    .variant-item__remove,
    .close-button,
    .menu-drawer__back-button,
    .predictive-search__close-modal-button,
    .predictive-search__search-button
  ):focus-visible,
.button-secondary:not(.button-unstyled, .facets__clear-all):focus-visible,
.button-custom:focus-visible,
button.shopify-payment-button__button--unbranded:focus-visible,
.bc-button-1:focus-visible,
.bc-button-2:focus-visible,
.bc-button-3:focus-visible {
  outline: none;
}

.button:not(
    .button-unstyled,
    .button--unstyled,
    .quick-add__button,
    .dropdown-localization__button,
    .cart-items__remove,
    .variant-item__remove,
    .close-button,
    .menu-drawer__back-button,
    .predictive-search__close-modal-button,
    .predictive-search__search-button
  ):focus-visible::before,
.button-secondary:not(
    .button-unstyled,
    .facets__clear-all
  ):focus-visible::before,
.button-custom:focus-visible::before,
button.shopify-payment-button__button--unbranded:focus-visible::before,
.bc-button-1:focus-visible::before,
.bc-button-2:focus-visible::before,
.bc-button-3:focus-visible::before {
  filter: drop-shadow(0 0 0 var(--color-foreground))
    drop-shadow(0 0 3px var(--color-foreground));
}

/************/
/* 3. header - plaque shape */

#header-component {
  --wf-header-inset: 40px;
  --wf-header-maxw: 1280px;
  --wf-header-gap: 14px;
  --wf-header-icons-inset: 14px;
  --wf-bh: 60px;
  --wf-cap: calc(var(--wf-bh) * 0.35938);
  --wf-ins: calc(var(--wf-bh) * 0.07031);
  --wf-ibw: calc(var(--wf-bh) * 0.02813);
  --wf-header-edge: var(--parchment);
  --wf-cap-l: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
  --wf-cap-r: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%20preserveAspectRatio%3D%22none%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%200.00%20L%2017.00%200.00%20L%2017.00%206.00%20L%209.00%206.00%20L%209.00%2014.00%20C%20-3.00%2023.90%20-3.00%2040.10%209.00%2050.00%20L%209.00%2058.00%20L%2017.00%2058.00%20L%2017.00%2064.00%20L%2023.00%2064.00%20Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  --wf-edge-l: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fsvg%3E");
  --wf-edge-r: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2264%22%20viewBox%3D%220%200%2023%2064%22%20preserveAspectRatio%3D%22none%22%3E%3Cg%20transform%3D%22translate%2823%2C0%29%20scale%28-1%2C1%29%22%3E%3Cpath%20d%3D%22M%2023.00%205.40%20L%2022.40%205.40%20L%2022.40%2011.40%20L%2014.40%2011.40%20L%2014.40%2017.24%20C%202.40%2025.36%202.40%2038.64%2014.40%2046.76%20L%2014.40%2052.60%20L%2022.40%2052.60%20L%2022.40%2058.60%20L%2023.00%2058.60%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linejoin%3D%22miter%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  margin-block-start: var(--wf-header-gap);
  width: min(100% - var(--wf-header-inset) * 2, var(--wf-header-maxw));
  margin-inline: auto;
  pointer-events: auto;
}

@media screen and (max-width: 749px) {
  #header-component {
    --wf-header-inset: 12px;
    --wf-header-gap: 10px;
  }
}

@media screen and (max-width: 749px) {
  #header-component .header__columns {
    margin-inline: var(--wf-header-icons-inset);
  }
}

/* Desktop side padding, un-nested. Horizon sets this in base.css as a
   nested @media inside .section--full-width.section--full-width-margin > *
   (CSS nesting = Chrome 112+). Browsers without nesting drop it, the columns
   go edge-to-edge and the cart icon lands on the plaque's right cap
   (seen on a 1366x768 Chromebook 2026-09-11). Same value, flat rule.
   The [data-menu-style] variant outranks header.liquid's drawer rule
   (#header-component[data-menu-style='drawer'] .header__columns
   {padding: 0 2px}) so the hamburger state at 750px+ (menu links no longer
   fit, see blocks/_header-menu.liquid minimum-items) keeps the same inset
   instead of parking the cart on the plaque cap. */
@media screen and (min-width: 750px) {
  #header-component .header__columns,
  #header-component[data-menu-style] .header__columns {
    padding-left: var(--page-margin, 40px);
    padding-right: var(--page-margin, 40px);
  }
}

.header-section:has(> #header-component[sticky="always"]),
.header-section:has(
  > #header-component[sticky="scroll-up"][data-sticky-state="active"]
) {
  pointer-events: none;
}

#header-component .header__row--top:not(.divider--page-width),
#header-component .header__row--top.divider--page-width .header__columns,
#header-component .header__row--bottom,
#header-component .header__navigation-bar-row {
  border-bottom: none !important;
}

#header-component .header__underlay-closed {
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    var(--wf-cap-l), var(--wf-cap-r), linear-gradient(#000, #000);
  mask-image: var(--wf-cap-l), var(--wf-cap-r), linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center;
  mask-position:
    left center,
    right center,
    center;
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 100%;
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 100%;
}

#header-component .header__underlay-closed::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--wf-header-edge);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-image:
    var(--wf-edge-l), var(--wf-edge-r), linear-gradient(#000, #000),
    linear-gradient(#000, #000);
  mask-image:
    var(--wf-edge-l), var(--wf-edge-r), linear-gradient(#000, #000),
    linear-gradient(#000, #000);
  -webkit-mask-position:
    left center,
    right center,
    center 7.2347%,
    center 92.7653%;
  mask-position:
    left center,
    right center,
    center 7.2347%,
    center 92.7653%;
  -webkit-mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 2.8125%,
    calc(100% - 2 * var(--wf-cap) + 2px) 2.8125%;
  mask-size:
    var(--wf-cap) 100%,
    var(--wf-cap) 100%,
    calc(100% - 2 * var(--wf-cap) + 2px) 2.8125%,
    calc(100% - 2 * var(--wf-cap) + 2px) 2.8125%;
}

.header-section:has(> #header-component[sticky="always"]),
.header-section:has(
  > #header-component[sticky="scroll-up"][data-sticky-state="active"]
) {
  height: 0;
}

/* 3b. header - icon sizes */
#header-component search-button .svg-wrapper,
#header-component search-button .svg-wrapper > svg,
#header-component .header-actions__cart-icon .svg-wrapper,
#header-component .header-actions__cart-icon .svg-wrapper > svg {
  width: 28px;
  height: 28px;
}

#header-component .account-button__icon {
  width: 28px;
  height: 28px;
}

#header-component search-button .button-unstyled,
#header-component .header-actions__cart-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

#header-component .header__column--right header-actions {
  margin-inline-start: 0;
}

#header-component header-actions {
  gap: 14px;
}

/* 4. mega menu - paper scroll drop-down */

#header-component {
  --wf-menu-topband: 66px;
  --wf-menu-top: var(--wf-menu-topband);
  --wf-menu-inset: var(--wf-cap);
  --wf-menu-fill: var(--papyrus);
  --wf-menu-roll: 40px;
  --wf-menu-text: var(--timber);
}

#header-component .header__underlay-open {
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--wf-menu-fill) 91%, var(--timber))
      var(--wf-menu-top),
    var(--wf-menu-fill) calc(var(--wf-menu-top) + 32px)
  ) !important;
  clip-path: inset(var(--wf-menu-top) var(--wf-menu-inset) 0) !important;
  -webkit-mask-image: none;
  mask-image: none;
}

#header-component .header__underlay-open::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--wf-paper-tex) center / cover no-repeat !important;
  opacity: 0.3;
  pointer-events: none;
}

#header-component .header__underlay-open::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 0 0 0 !important;
  height: var(--wf-menu-roll) !important;
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--timber) 6%, transparent),
    transparent 38%,
    color-mix(in srgb, var(--timber) 12%, transparent)
  ) !important;
  box-shadow: none !important;
  clip-path: none !important;
  -webkit-mask-image: none;
  mask-image: none;
}

#header-component .menu-list__submenu .mega-menu__link,
#header-component .menu-list__submenu .mega-menu__link .wrap-text,
#header-component .menu-list__submenu .mega-menu__feature-title {
  color: var(--wf-menu-text, #2f2217) !important;
}

@media screen and (min-width: 750px) {
  #header-component .menu-list__submenu-inner {
    padding-top: 40px;
    padding-bottom: calc(var(--wf-menu-roll, 40px) + 28px);
  }
}

#header-component .menu-list__submenu {
  content-visibility: visible !important;
  contain-intrinsic-size: auto !important;
}

span.wrap-text {
  font-size: 1.2rem;
}

#header-component .mega-menu__link--parent span.wrap-text {
  font-size: var(--menu-top-level-font-size, 0.875rem) !important;
  font-weight: var(--menu-top-level-font-weight, 600) !important;
  line-height: inherit !important;
}

@media screen and (min-width: 990px) {
  #header-component .mega-menu__grid:has(.mega-menu__content-list--images) {
    grid-template-columns: repeat(3, var(--wf-menu-linkcol, 1.65fr)) repeat(
        3,
        1fr
      );
  }
}
#header-component .mega-menu__content-list--images {
  display: grid;
  justify-content: end;
  gap: var(--menu-vertical-gap, 24px) var(--menu-horizontal-gap, 24px);
  /* --wf-feature-tiles = actual tile count; the content span reserves one extra grid track
     (--menu-content-columns-*) so the tiles render larger, so don't grid by that var here */
  grid-template-columns: repeat(var(--wf-feature-tiles, 2), minmax(0, 1fr));
}
#header-component .mega-menu__feature {
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-decoration: none;
  color: inherit;
}
#header-component .mega-menu__feature-media {
  display: block;
  position: relative;
  border-radius: var(--resource-card-corner-radius, 0px);
  aspect-ratio: 478.09 / 700.01 !important;
}
#header-component .mega-menu__feature-media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: var(--wf-frame-color, var(--sage));
  -webkit-mask-image: url(arch-frame.svg);
  mask-image: url(arch-frame.svg);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
#header-component .mega-menu__feature-window {
  display: block;
  position: absolute;
  z-index: 1;
  top: 8.7856%;
  bottom: 8.537%;
  left: 12.4976%;
  right: 12.4976%;
  overflow: hidden;
  background: var(--parchment);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20358.59%20578.75%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2C578.75h358.59v-286.27c0-86.75-31.87-169.21-89.74-232.19C239.37%2C28.2%2C203.2%2C7.1%2C179.65%2C0c-27.78%2C9.07-64.18%2C35.63-93.34%2C68.18C30.65%2C130.32%2C0%2C211.41%2C0%2C296.52v282.23h0Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20358.59%20578.75%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2C578.75h358.59v-286.27c0-86.75-31.87-169.21-89.74-232.19C239.37%2C28.2%2C203.2%2C7.1%2C179.65%2C0c-27.78%2C9.07-64.18%2C35.63-93.34%2C68.18C30.65%2C130.32%2C0%2C211.41%2C0%2C296.52v282.23h0Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
#header-component .mega-menu__feature-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s var(--ease-out-cubic, ease);
}
#header-component .mega-menu__feature:hover .mega-menu__feature-img {
  transform: scale(1.04);
}
#header-component .mega-menu__feature-title {
  font-family: var(--bc-h5-family) !important;
  font-weight: var(--menu-top-level-font-weight, 600) !important;
  font-size: var(--menu-top-level-font-size, 0.875rem) !important;
  letter-spacing: var(--bc-h5-letter-spacing) !important;
  text-transform: var(--bc-h5-transform, uppercase) !important;
  line-height: 1.4;
  text-align: center;
}

.menu-list__submenu-inner {
  padding-inline: 88px;
}

/* 4c. mobile drawer — stone bg, compact links + Shop All arch (mirrors the
   mega-menu feature tile). Sized so the drawer never exceeds the viewport. */
#header-component .menu-drawer,
#header-component .menu-drawer__submenu {
  background-color: var(--stone) !important;
  color: var(--parchment);
  --menu-top-level-font-color: var(--parchment);
  --menu-parent-font-color: var(--parchment);
  --menu-child-font-color: var(--parchment);
}

/* All white/ivory drawer chrome → parchment. The menu-font-styles snippet sets
   the link color vars INLINE on the nav (beats a var override), so the link
   colors are set directly here; #header-component prefix outranks the snippet. */
#header-component .menu-drawer .menu-drawer__close-button,
#header-component .menu-drawer .menu-drawer__back-button,
#header-component .menu-drawer__title,
#header-component .menu-drawer__menu-item--mainlist,
#header-component .menu-drawer__menu-item--mainlist:hover,
#header-component .menu-drawer__menu-item--parent,
#header-component .menu-drawer__menu-item--parent:hover,
#header-component .menu-drawer__menu-item--child,
#header-component .menu-drawer__menu-item--child:hover {
  color: var(--parchment);
}

/* Smaller top-level links + tighter rows so everything fits without
   scrolling. #header-component prefix outranks the snippet stylesheet. */
#header-component
  .menu-drawer__menu-item--mainlist
  .menu-drawer__menu-item-text {
  font-size: 26px;
}

#header-component .menu-drawer__menu.has-submenu > .menu-drawer__list-item {
  padding-block-end: var(--padding-xs);
  margin-block-end: var(--padding-xs);
}

#header-component .menu-drawer__menu > .menu-drawer__list-item {
  min-height: calc(var(--padding-md) + var(--icon-size-xs));
}

/* Second-level submenu items (Series / Fan Favorites / Collection) get the same
   parchment divider between rows as the top level; none after the last. */
#header-component
  .menu-drawer__submenu
  .menu-drawer__menu--childlist
  > .menu-drawer__list-item {
  padding-block-end: var(--padding-xs);
  margin-block-end: var(--padding-xs);
  border-block-end: 1px solid var(--parchment);
}

#header-component
  .menu-drawer__submenu
  .menu-drawer__menu--childlist
  > .menu-drawer__list-item:last-child {
  padding-block-end: 0;
  margin-block-end: 0;
  border-block-end: 0;
}

.menu-drawer__shop-all-arch {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 10px;
  margin-bottom: 8px;
  padding-inline: var(--drawer-padding, 20px);
}

/* Each tile shares the row and caps at 126px, so one tile centers and two sit
   side by side. Portrait ratio means width drives height — two arches are the
   same height as one, they just use the empty horizontal space. */
.menu-drawer__shop-all-arch .mega-menu__feature {
  flex: 1 1 0;
  min-width: 0;
  max-width: 126px;
  gap: 6px;
}

/* Arch labels use BC body-1 (EB Garamond, no uppercase) on one line.
   Higher specificity + !important to beat the base feature-title rule. */
#header-component .menu-drawer__shop-all-arch .mega-menu__feature-title {
  font-family: var(--bc-body-1-family) !important;
  font-weight: var(--bc-body-1-weight) !important;
  font-size: var(--fs-body1) !important;
  letter-spacing: var(--bc-body-1-letter-spacing) !important;
  text-transform: none !important;
  white-space: nowrap;
  color: var(--parchment) !important;
}

/* Instagram + TikTok links below the arches. */
.menu-drawer__social {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 8px;
  margin-bottom: var(--padding-sm, 12px);
}

.menu-drawer__social-link {
  display: inline-flex;
  color: var(--parchment);
  transition: opacity 0.2s ease;
}

.menu-drawer__social-link:hover {
  opacity: 0.7;
}

.menu-drawer__social .menu-drawer__social-icon {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

/* Second-level nav title (e.g. "Shop") follows BC H5. 2-class selector +
   #header-component outrank the base .menu-drawer__title rule. */
#header-component .menu-drawer__title .menu-drawer__menu-item-text {
  font-family: var(--bc-h5-family);
  font-weight: var(--bc-h5-weight);
  font-size: var(--bc-h5-size);
  line-height: var(--bc-h5-line-height);
  letter-spacing: var(--bc-h5-letter-spacing);
  text-transform: var(--bc-h5-transform);
}

/* Arches + socials belong to the first-level view only. Hide them while a
   submenu (Shop, localization) is open — they're static-flow siblings whose
   relative-positioned tile boxes otherwise bleed over the submenu overlay. */
.menu-drawer--has-submenu-opened .menu-drawer__shop-all-arch,
.menu-drawer--has-submenu-opened .menu-drawer__social {
  display: none;
}

/************/
/* 5. product page — price + reviews + badge row */

.layout-panel-flex--row:has(> product-price):has(> .rating-wrapper) {
  gap: 20px;
  align-items: center;
  flex-direction: row;
}
.layout-panel-flex--row:has(> product-price):has(> .rating-wrapper)
  > product-price,
.layout-panel-flex--row:has(> product-price):has(> .rating-wrapper)
  > .rating-wrapper {
  width: fit-content !important;
  flex: 0 0 auto !important;
}
.layout-panel-flex--row:has(> product-price):has(> .rating-wrapper) {
  flex-wrap: wrap;
}
.layout-panel-flex--row:has(> product-price):has(> .rating-wrapper)
  > .custom-liquid-block:has(.wf-license-badge) {
  flex: 0 0 auto;
}

.product-details .shopify-app-block:has(> .ns-edd-product-page) {
  align-self: stretch;
}

/* mobile: add-to-cart takes its own full-width row under the quantity
   selector (the theme's flex rule otherwise seats them side by side) */
@media screen and (max-width: 749px) {
  .product-details .product-form-buttons > *:has(.add-to-cart-button) {
    flex: 1 0 100%;
  }
}

.wf-license-badge svg {
  display: block;
  width: auto;
  height: 30px;
  max-width: 100%;
}

/* "From our official [series] collection" circle — top right of the PDP media
   gallery. <media-gallery> is the positioned ancestor (.sticky-content).
   Curved text = SVG textPath on a fixed 200x200 viewBox, so the text scales
   with the circle width and needs no separate mobile font-size. */
.wf-series-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 4;
  width: 190px;
  aspect-ratio: 1;
  /* seal shape + fill (ivory base under character tint at 20% — the main
     notes pill swatch) are drawn as SVG paths in the snippet; drop-shadow
     follows the scalloped edge where box-shadow could not */
  color: var(--timber);
  filter: drop-shadow(
    0 2px 10px color-mix(in srgb, var(--timber) 14%, transparent)
  );
  pointer-events: none;
}

.wf-series-badge svg {
  display: block;
  width: 100%;
  height: 100%;
  /* the gold ring is a centered stroke on the seal path — its outer half
     peeks past the viewBox at the bump peaks */
  overflow: visible;
}

.wf-series-badge svg text {
  font-family: var(--bc-h3-family);
  font-weight: var(--bc-h3-weight);
  letter-spacing: 0.14em;
  font-size: 13.5px;
  fill: var(--timber);
}

/* collab ribbon: own svg layered over the art (solid, not see-through);
   band + tails are opaque gold texture drawn in the snippet, folds timber */
.wf-series-badge__ribbon {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  z-index: 2;
}

.wf-collab-ribbon {
  display: block;
  overflow: visible;
}

.wf-collab-ribbon__fold {
  fill: var(--timber);
}

.wf-collab-ribbon__text {
  font-family: var(--bc-h3-family);
  font-weight: var(--bc-h3-weight);
  font-size: 11.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  fill: var(--timber);
}

.wf-series-badge__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

.wf-series-badge__art,
.wf-series-badge__name {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* series badge art rendered in gold texture: the badge image is the mask,
   the texture is the background */
.wf-series-badge__art {
  width: var(--wf-sb-art-w, 100px);
  height: var(--wf-sb-art-h, 84px);
  transform: translate(-50%, calc(-50% + 2px));
  margin-top: var(--wf-sb-art-dy, 0px);
  background: url("/cdn/shop/files/gold-texture_xs.jpg?v=1788257278")
    center / cover;
  -webkit-mask: var(--wf-sb-art) center / contain no-repeat;
  mask: var(--wf-sb-art) center / contain no-repeat;
}

.wf-series-badge__name {
  max-width: 62%;
  text-align: center;
  color: var(--ivory);
  font-family: var(--bc-h3-family);
  font-weight: var(--bc-h3-weight);
  text-transform: var(--bc-h3-transform);
  letter-spacing: var(--bc-h3-letter-spacing);
  font-size: 14px;
  line-height: 1.2;
}

@media screen and (max-width: 749px) {
  .wf-series-badge {
    top: 10px;
    right: 10px;
    width: 140px;
  }

  .wf-series-badge__art {
    width: calc(var(--wf-sb-art-w, 100px) * 0.74);
    height: calc(var(--wf-sb-art-h, 84px) * 0.74);
    transform: translate(-50%, calc(-50% + 6px));
  }

  .wf-series-badge__name {
    font-size: 11px;
  }
}

.product-information__grid--limit-details .product-details > .group-block {
  max-width: 40rem !important;
}

.product-details .layout-panel-flex > * {
  max-width: 100%;
  min-width: 0;
}

.product-details
  .group-block-content.layout-panel-flex.layout-panel-flex--column.mobile-column {
  gap: 20px;
}

.wf-main-notes {
  margin-top: -16px;
}

.product-details .quantity-label__cart-count {
  color: inherit;
}

.product-details .custom-liquid-block:has(.wf-badge-highlights) {
  align-self: stretch;
}

.wf-badge-highlights {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  padding-block: 8px 24px;
  border-block-end: var(--style-border-width, 1px) solid var(--color-border);
}

.wf-badge-highlights__item {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--color-foreground);
  font-family: var(--font-body--family);
  font-size: 16px;
  line-height: 1.3;
}

.wf-badge-highlights__item svg {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
}

.wf-badge-highlights__item span {
  max-width: 16ch;
}

@media screen and (max-width: 749px) {
  .wf-badge-highlights {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 12px;
  }

  .wf-badge-highlights__item {
    gap: 8px;
    font-size: 13px;
    min-width: 0;
  }

  .wf-badge-highlights__item svg {
    width: 32px;
    height: 32px;
  }
}

.product-details
  .shopify-app-block[id*="paywhirl_subscriptions"]:not(:has(div)) {
  display: none;
}

@media screen and (max-width: 749px) {
  .product-information__media.wf-media-mobile-moved {
    width: 100%;
    min-width: 0;
    margin-top: -8px;
  }

  .layout-panel-flex--row:has(> product-price):has(> .rating-wrapper) {
    row-gap: 16px;
  }

  .product-details .custom-liquid-block:has(.wf-main-notes) {
    margin-top: -12px;
  }

  .product-details .text-block h1 {
    font-size: 1.8rem;
  }

  .product-details [class*="divider_mEcCn4"] {
    display: none;
  }
}
.shopify-payment-button__more-options {
  display: none !important;
}

.wf-shipping-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
  font-size: var(--fs-body2);
  color: var(--color-foreground);
}

.wf-shipping-note svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.ql-editor {
  display: none !important;
}
.powered-by {
  display: none !important;
}

.pw-steps .pw-step-icon {
  background-color: var(--stone) !important;
}

/* 5b. PayWhirl plan-selector widget (Candle Collective subscription PDP).
   PayWhirl hardcodes its "modern" accent as rgb(51,79,180) (blue) — recolor
   every occurrence to --timber. Hide the "Purchase options" header, and bind
   the widget to bc font styling: titles + labels in the accent (mono) face,
   values/prices stay on the body face. Font-family only per instruction —
   sizes left as PayWhirl set them. */

/* hide the "Purchase options" header */
.paywhirl-plan-selector .paywhirl-plan-selector-header {
  display: none !important;
}

/* blue → timber: text colors */
.paywhirl-plan-selector .paywhirl-plan-selector-group-name,
.paywhirl-plan-selector .paywhirl-plan-selector-group-price,
.paywhirl-plan-selector .paywhirl-price,
.paywhirl-plan-selector .paywhirl-price-from {
  color: var(--timber) !important;
}

/* blue → timber: icon fills (truck, clock, selected check) */
.paywhirl-plan-selector .paywhirl-icon-truck,
.paywhirl-plan-selector .paywhirl-icon-circle-check,
.paywhirl-plan-selector .paywhirl-icon-circle {
  fill: var(--timber) !important;
  color: var(--timber) !important;
}

/* clock overlay sits on the timber truck cab — ivory so it reads */
.paywhirl-plan-selector .paywhirl-icon-clock-rotate,
.paywhirl-plan-selector .paywhirl-icon-clock-rotate path {
  fill: var(--ivory) !important;
  color: var(--ivory) !important;
}

/* blue → timber: selected-plan box border */
.paywhirl-plan-selector .paywhirl-label,
.paywhirl-plan-selector .paywhirl-group-selected {
  border-color: var(--timber) !important;
}

/* bc font styling — body face for the widget by default */
.paywhirl-plan-selector {
  font-family: var(--bc-font-body);
}

/* bc font styling — accent (mono) for the plan title + "Deliver every" label */
.paywhirl-plan-selector .paywhirl-plan-selector-group-name,
.paywhirl-plan-selector .paywhirl-plan-selector-plan > .paywhirl-label {
  font-family: var(--bc-font-accent) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* bc font styling — accent (mono) for the plan value (keeps its case) */
.paywhirl-plan-selector .paywhirl-plan-selector-plan-name {
  font-family: var(--bc-font-accent) !important;
}

.jdgm-rev-widg.jdgm-rev-widg {
  --wf-scroll-roll: 46px;
  --wf-scroll-pad-x: 40px;
  position: relative;
  box-sizing: border-box;
  isolation: isolate;
  background:
    linear-gradient(
      color-mix(in srgb, var(--papyrus) 70%, transparent),
      color-mix(in srgb, var(--papyrus) 70%, transparent)
    ),
    var(--wf-paper-tex) center / cover no-repeat,
    var(--papyrus);
  padding: calc(var(--wf-scroll-roll) + 28px) var(--wf-scroll-pad-x);
  margin-block: 48px;
  box-shadow: 0 6px 22px color-mix(in srgb, var(--timber) 8%, transparent);
}
.jdgm-rev-widg.jdgm-rev-widg::before,
.jdgm-rev-widg.jdgm-rev-widg::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: var(--wf-scroll-roll);
  z-index: 2;
  pointer-events: none;
}
.jdgm-rev-widg.jdgm-rev-widg::before {
  top: 0;
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--timber) 12%, transparent) 0%,
    color-mix(in srgb, var(--timber) 2%, transparent) 30%,
    transparent 50%,
    color-mix(in srgb, var(--timber) 6%, transparent) 78%,
    color-mix(in srgb, var(--timber) 16%, transparent) 100%
  );
}
.jdgm-rev-widg.jdgm-rev-widg::after {
  bottom: 0;
  background: linear-gradient(
    to top,
    color-mix(in srgb, var(--timber) 12%, transparent) 0%,
    color-mix(in srgb, var(--timber) 2%, transparent) 30%,
    transparent 50%,
    color-mix(in srgb, var(--timber) 6%, transparent) 78%,
    color-mix(in srgb, var(--timber) 16%, transparent) 100%
  );
}

a.jdgm-write-rev-link {
  max-width: 300px;
}

.jdgm-review-widget--small .jdgm-rev-widg, .jdgm-review-widget--medium .jdgm-rev-widg {
  padding: 66px 24px !important;
}

.jdgm-cards-carousel .jdgm-cards-wrapper {
    max-width: unset;
}

button.activator {
    display: none !important;
}

/*mobile ops*/
@media screen and (max-width: 749px) {
  .jdgm-rev-widg.jdgm-rev-widg {
    --wf-scroll-roll: 36px;
    --wf-scroll-pad-x: 20px;
  }

  .bc-split-section-mobile-image-wrapper {
    padding: 0px !important;
    max-height: 320px;
  }

  /* home hero only: uncapped, so the rotating candle (z-index 3) stays inside
   the image area instead of bleeding over the text box */
  section[class*="wonderwick_custom_hero"]
    .bc-split-section-mobile-image-wrapper {
    max-height: none;
  }

  .bc-split-section-right-inner-div {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .bc-diag-card-carousel {
    height: 60vh !important;
  }

  /* the section wrapper is hard-coded to min-height:100vh; release it on mobile
   so the 60vh gallery above doesn't leave ~40vh of dead space below the cards */
  section:has(.bc-diag-card-carousel) {
    min-height: 60vh !important;
  }

  .bc-hover-images-card.bc-hover-images-card.bc-hover-images-card {
    height: 550px !important;
  }

  .bc-testimonial-slider-column {
    padding: 70px 20px 40px !important;
  }

  #header-component header-actions {
    gap: 0px;
  }
  .wf-footer__col--right {
    text-align: left;
    align-items: flex-start;
  }

  .wf-footer__menu a.bc-h5 {
    font-family: var(--bc-body-1-family);
    text-transform: var(--bc-body-1-transform);
    letter-spacing: var(--bc-body-1-letter-spacing);
    font-size: var(--bc-body-1-size) !important;
  }

  .product-details
    .group-block-content.layout-panel-flex.layout-panel-flex--column.mobile-column {
    gap: 8px;
  }

  .product-details .custom-liquid-block:has(.wf-main-notes) {
    margin-top: 0;
  }
  .product-information__media.wf-media-mobile-moved {
    margin-top: 0px;
  }

  .layout-panel-flex--row:has(> product-price):has(> .rating-wrapper) {
    row-gap: 8px;
  }

  .wf-cn__content {
    max-width: 250px;
}

#shopify-section-template--23042091483364__wf_character_notes .wf-cn__row {
    justify-content: center;
    gap: 1.2vw;
}

#shopify-section-template--23042091483364__wf_character_notes .wf-cn__pill {
    gap: 1.2vw;
    padding: 1vw;
}

.metafield-rich_text_field {
    max-width: 280px;
    margin: auto;
}

/* Product page: exempt PDP metafield rich text (description, licensing,
   shipping) from the 280px cap above so it uses the full column width on
   mobile. Scoped to .product-details (0,2,0) so the cap still applies
   elsewhere; later + higher specificity, so it wins. */
.product-details .metafield-rich_text_field {
    max-width: none;
    margin: 0;
}

}




/* 6. character collection page — title. The bc-better-rich-text heading
   ({{ collection.title }}, font style h0) gets the h3 face/weight/tracking/
   transform at h1 size with the h0 line-height. Scoped to that template
   instance so the about page's h0 is untouched. */
[id$="__bc_better_rich_text_cQm7XN"] .bc-h0 {
  font-family: var(--bc-h3-family);
  font-weight: var(--bc-h3-weight);
  font-size: var(--bc-h1-size);
  line-height: var(--bc-h0-line-height);
  letter-spacing: var(--bc-h3-letter-spacing);
  text-transform: var(--bc-h3-transform);
}

/* 6b. character collection page — character quote (bc-better-rich-text
   heading block, content source "Character quote"): balanced line breaks. */
[id$="__bc_better_rich_text_EVPDFY"] .bc-content-block-heading,
[id$="__bc_better_rich_text_EVPDFY"] .bc-content-block-heading p {
  text-wrap: balance;
}

/* 6c. character quote + source: exempt from the mobile 280px .metafield-rich_text_field
   cap (higher specificity wins at mobile; harmless on desktop). */
[id$="__bc_better_rich_text_EVPDFY"] .metafield-rich_text_field {
  max-width: none;
  margin: 0;
}

/* 6d. "Explore more of the Collection" (character collection + product page):
   series badge icon 250px on desktop (section slider caps at 240; mobile keeps
   the 160px setting). Extra .shopify-section class outranks the section's own
   .section-id .bc-icon rule. */
@media screen and (min-width: 768px) {
  .shopify-section[id$="__bc_image_text_split_char"] .bc-icon,
  .shopify-section[id$="__bc_image_text_split_7aRDfy"] .bc-icon {
    width: 250px;
    height: 250px;
  }
}

/* 6e. product cards — transparent candle PNGs. Horizon wraps any product with
   2+ images in a slideshow whose container paints the card's colour-scheme
   background (snippets/slideshow-styles.liquid: slideshow-container
   { background-color: var(--color-background) }), so multi-image cards showed
   a white/cream box behind the cut-out candle while single-image cards did not.
   Clear it inside the card gallery only (PDP gallery untouched). */
.card-gallery slideshow-container,
.product-card slideshow-container {
  background-color: transparent;
}

/* 7. About page — move half the DM-wall's bottom padding onto Shop Sierra's
   Picks' top, so the gap between them belongs to the Picks band (reads as
   part of that section, esp. in candlelight/timber mode). Net gap unchanged:
   DM bottom md → md/2, Picks top md → md*1.5. Var-based so it scales at the
   mobile breakpoint; compound .bc-section-pad-md selector outranks the base
   (0,1,0) preset rule. Picks has no top divider, so no divider-extra term. */
.section-template--23136961626340__bc_dm_wall_Kd4mQz.bc-section-pad-md {
  padding-bottom: calc(var(--bc-section-pad-md) / 2);
}
.section-template--23136961626340__bc_featured_collections_QpRYWe.bc-section-pad-md {
  padding-top: calc(var(--bc-section-pad-md) * 1.5);
}

/* 8. Judge.me reviews-carousel horizontal-scroll fix (PDP, shown when a product
   has few reviews). Judge.me full-bleeds the carousel block with
   `.shopify-app-block:has(> .jdgm-cards-carousel){margin-left:calc(50% - 50vw);
   width:100vw}`. 50vw counts the vertical scrollbar but the centered content
   column does not, so the breakout overshoots the viewport's left edge by half
   the scrollbar width (~5.5px) and Horizon's scroller (.page-wrapper) gets ~6px
   of horizontal scroll. Contain the carousel block to the content column so it
   can't bleed past the viewport. Not vibe-gated — applies in every mode.
   Judge.me's own rule is `.shopify-app-block:has(> .jdgm-cards-carousel)` with
   !important, injected inline AFTER this file loads, so an equal-specificity
   override loses on source order. Adding `.jdgm-horizon-widget` makes this
   (0,3,0) vs their (0,2,0) so it wins regardless of load order. */
.shopify-app-block.jdgm-horizon-widget:has(> .jdgm-cards-carousel) {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important; /* NOT auto: the carousel track is positioned, so auto shrink-wraps the block to 0 and hides it. 100% = content-column width. */
  max-width: 100% !important;
}

/* 10. 404 page "Continue shopping" plaque button seam ("weird line"). The
   label is direct text with a 1lh line box (line-height:1, 14px), but the
   default plaque --wf-bh assumes a 1.4em box (19.6px), so it over-measures the
   button by ~5.6px and the notched cap SVG mask letterboxes, leaving a seam at
   the cap edge. Match --wf-bh to the real line box (1lh) — same fix as the
   empty-cart Continue Shopping button. Scoped to this button's block key
   (button_PAQMwR in templates/404.json); appended last so it wins the
   equal-specificity tie with the §2 plaque rule on source order. */
[class*="button_PAQMwR"].button {
  --wf-bh: calc((var(--button-padding-block, 16px) + var(--wf-pad-y)) * 2 + 1lh);
}

/* 9. Cookie consent banner + "Manage preferences" modal (Shopify native
   Customer Privacy UI — selectors `shopify-pc__*`, injected on the storefront,
   not a theme file). Brand it to spec: --stone ground, --ivory text/links,
   BC Foundation fonts. Only font-family/weight/tracking/transform come from
   BC — Shopify's own font-sizes are left untouched ("disregarding size").
   Shopify injects this component's stylesheet AFTER theme-custom.css with its
   own class-level rules, so the #id container + !important guarantee the
   override wins on both specificity and source order. */
#shopify-pc__banner,
#shopify-pc__banner .shopify-pc__banner__dialog,
#shopify-pc__prefs,
#shopify-pc__prefs .shopify-pc__prefs__dialog {
  background: var(--stone) !important;
  color: var(--ivory) !important;
}
/* every text node + link → ivory; existing borders/dividers → ivory too */
#shopify-pc__banner,
#shopify-pc__banner *,
#shopify-pc__prefs,
#shopify-pc__prefs * {
  color: var(--ivory) !important;
  border-color: var(--ivory);
}
#shopify-pc__banner a,
#shopify-pc__prefs a {
  color: var(--ivory) !important;
  text-decoration: underline;
}
/* BC body font on all reading text (no font-size) */
#shopify-pc__banner,
#shopify-pc__banner p,
#shopify-pc__banner li,
#shopify-pc__banner a,
#shopify-pc__prefs,
#shopify-pc__prefs p,
#shopify-pc__prefs li,
#shopify-pc__prefs a {
  font-family: var(--bc-body-1-family) !important;
  font-weight: var(--bc-body-1-weight) !important;
  letter-spacing: var(--bc-body-1-letter-spacing) !important;
  text-transform: var(--bc-body-1-transform) !important;
}
/* BC display font on the preferences-modal heading */
#shopify-pc__prefs h1,
#shopify-pc__prefs h2,
#shopify-pc__prefs h3,
#shopify-pc__prefs .shopify-pc__prefs__header,
#shopify-pc__prefs .shopify-pc__prefs__header * {
  font-family: var(--bc-h4-family) !important;
  font-weight: var(--bc-h4-weight) !important;
  letter-spacing: var(--bc-h4-letter-spacing) !important;
  text-transform: var(--bc-h4-transform) !important;
}
/* Buttons: BC button font. Transparent fill + ivory hairline keeps them
   legible on the stone ground (Shopify's default filled Accept button would
   otherwise disappear). Text already forced to ivory above. */
#shopify-pc__banner button,
#shopify-pc__banner .shopify-pc__banner__btn,
#shopify-pc__prefs button,
#shopify-pc__prefs .shopify-pc__prefs__btn {
  font-family: var(--bc-button-1-family) !important;
  font-weight: var(--bc-button-1-weight) !important;
  letter-spacing: var(--bc-button-1-letter-spacing) !important;
  text-transform: var(--bc-button-1-transform) !important;
  background: transparent !important;
  border: 1px solid var(--ivory) !important;
}