/** Shopify CDN: Minification failed

Line 234:18 Unexpected ")"

**/
/* WEB COMPONENTS */

quantity-input {
  display: block;
}

/* BASE */

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  margin: 0;
  padding: 0;

  min-height: 100vh;
  min-height: -webkit-fill-available;

  height: -webkit-fill-available;

  scroll-behavior: smooth;
  font-size: var(--font-body-size);
  accent-color: var(--color-green-hue);
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol {
  margin: 0;
  padding: 0;
  font-weight: normal;
}

a {
  text-decoration: none;
  color: currentColor;
}

address {
  font-style: normal;
}

ul,
ol,
li {
  list-style-type: none;
}

img {
  display: block;
  width: 100%;
  height: auto;

  background: var(--color-grey);
}

/* STYLEGUIDE */

body {
  color: var(--color-white--alt);
  background-color: var(--color-green);

  font-family: var(--font-body--family);
  font-size: var(--font-body--size);
  font-style: normal;
  letter-spacing: var(--font-body--letter);
  font-weight: var(--font-body--weight);
  line-height: var(--font-body--line);
}

main {
  scroll-behavior: smooth;
  margin-top: 0;
  background-color: var(--color-green)
}

main:has(.sticky--hero) .shopify-section section {
  background-color: var(--color-green);
  position: relative;
}

main:has(.page-404) {
  margin-top: var(--header-height-wpad);
}

.show-banner main {
  margin-top: var(--banner-height);
} 

.template-page main {
  margin-top: var(--header-height-wpad);
}


.template-page main :has(.section-page-hero) {
  margin-top: 0;
}

.show-banner .template-page main {
  margin-top: var(--header-height-banner-wpad);
}
.show-banner .template-page main :has(.section-page-hero) {
  margin-top: var(--banner-height);
}

p {
  margin-bottom: 1em;
}

a {
  color: currentColor;
  display: inline-block;
}

[popover] {
  width: fit-content;
  height: fit-content;
  color: var(--color-main);
  background-color: var(--color-white);
  inset: 0px;
  margin: 0 auto;
  border: none;
  padding: 1rem;
  overflow: auto;
}

strong,
b {
  font-family: var(--font-body-medium);
  font-weight: 500;

  font-style: normal;
  letter-spacing: var(--font-body--letter);
  line-height: var(--font-body--line);
}

h1,
.h1 {
  font-family: var(--font-heading--family);
  font-size: var(--font-heading--size);
  letter-spacing: var(--font-heading--letter);
  line-height: var(--font-heading--line);
  font-style: normal;
  font-weight: var(--font-heading--weight);
  color: var(--color-main);
}

h2,
.h2 {
  font-family: var(--font-heading--family);
  font-weight: var(--font-heading-weight);
  font-size: var(--font-body--size);
  letter-spacing: var(--font-heading--letter);
  line-height: var(--font-heading--line);
  font-style: normal;
  color: currentColor;
  text-transform: uppercase;
}


h3,
.h3 {
  font-family: var(--font-heading--family);
  font-weight: var(--font-heading-weight);
     font-size: var(--font-body--size-s);
       letter-spacing: var(--font-heading--letter);
  line-height: var(--font-heading--line);
  font-style: normal;
  color: currentColor;
  text-transform: uppercase;
}

h4,
.h4 {

}


/* ul li a {

  &:hover,
  &:focus-visible {
    color: var(--color-green);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    text-decoration-thickness: 0.05em;
  }

  margin-bottom: 0.125rem;
  padding: 0.25rem 0;

} */

blockquote {
  line-height: 1.2;
}

pre {
  display: none;
}

p a,
.rte p a,
.rte a {
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 0.04em;
  display: inline;
  transition: text-decoration 180ms ease-in-out, color 180ms ease-in-out;
  color: currentColor;

}

p a:hover,
.rte p a:hover,
.rte a:hover {
  text-decoration: none;
}

.rte p:last-child(),
.rte p:last-of-type,
p:last-child {
  margin-bottom: 0;
}

.rte em,
.rte i {
  font-style: italic;
  font-family: var(--font-heading-italic);
}

.rte-l {
  font-size: var(--font-body--size-l);
}

.rte__text {
  text-wrap: pretty;
  display: inline-block;
}

.product-main__description.rte em,
.product-main__description.rte i {
  font-style: italic;
  font-family: var(--font-body-family);
}

label {
  font-size: var(--font-body-size);
}

select {
  position: relative;
  width: 100%;
  padding: 0.66rem 0.66rem;

  color: var(--color-main);
  letter-spacing: inherit;
  text-transform: none;
  text-indent: 0px;
  text-shadow: none;
  text-align: left;
  appearance: auto;
  background-color: var(--color-background);
  cursor: default;
  margin: 0em;
  border: none;
  appearance: none;
}

.select {
  position: relative;
  display: flex;
  justify-content: space-between;

  background-color: #fff;
  border: 0.05rem solid var(--color-grey);
  border-radius: var(--radius-s);
}

button,
input[type="submit"] {
  padding: 0;
  color: var(--color-main);
  letter-spacing: inherit;
  text-transform: none;
  text-indent: 0px;
  text-shadow: none;
  text-align: left;
  appearance: auto;
  background-color: transparent;
  cursor: pointer;
  margin: 0;
  border: none;
  appearance: none;
}

input[type="checkbox"] {
  border-radius: 0;
  width: 1.25rem;
  height: 1.25rem;
  background: transparent;
  appearance: none;
  border: none;
  padding: 0.25rem;
  cursor: pointer;
  border-radius: 0;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
textarea {
  border-radius: var(--radius-s);
  border: var(--rule-grey-light);
  background: transparent;
  appearance: none;
  padding: 0.66rem 0.66rem;
  cursor: text;
}
input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="password"]::placeholder,
input[type="tel"]::placeholder,
textarea::placeholder
{
  color: var(--color-grey);
  opacity: 0.75;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
textarea:focus,
input[type="text"]:active,
input[type="email"]:active,
input[type="password"]:active,
input[type="tel"]:active,
textarea:active {
  background-color: var(--color-white);
  outline-color: var(--color-grey);
  outline-offset: 0;
  border-color: transparent;
}


input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  cursor: pointer;
  background: transparent;
  border: none;
  border-radius: 0;
  width: auto;
  margin: 0;
  padding: 0;
  line-height: normal;
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
  -text-align: left;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

input[type="radio"] + label {
  display: flex;
  align-items: center;
  height: 1.5rem;

  cursor: pointer;

  position: relative;

  padding-left: 2.25rem;

  color: var(--color-grey);
  line-height: var(--font-label-line);
}
  input[type="radio"] + label::before,
  input[type="radio"] + label::after {
    content: "";

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    border-radius: var(--radius-50);
    border: var(--rule-grey);

    width: 1.5rem;
    height: 1.5rem;

    padding: 0.02rem;

    position: absolute;
    left: 0;
  }

  input[type="radio"] + label:after {
    opacity: 0;

    top: 2px;
    left: 2px;

    width: calc(1.5rem - 4px);
    height: calc(1.5rem - 4px);
    background-color: var(--color-main);
    border: var(--rule-white);

    transition: opacity 240ms ease-in-out 0s;
  }


input[type="radio"]:checked + label,
input[type="radio"]:focus + label,
input[type="radio"]:hover + label {
  color: var(--color-main);
}
input[type="radio"]:checked + label::before,
input[type="radio"]:focus + label::before,
input[type="radio"]:hover + label::before {
  background-color: var(--color-white);
  border: var(--rule);
}

input[type="radio"]:focus + label::after,
input[type="radio"]:hover + label::after,
input[type="radio"]:checked + label::after {
  opacity: 1;
}


fieldset {
  display: block;
  margin: 0;
  padding: 0;
  appearance: none;
  border: none;
}

textarea {
  resize: none;
  appearance: none;
  border-radius: 0;
  margin: 0;
  padding: 0;
  appearance: none;
  border: none;
}

table {
  width: 100%;
}

table th {
  /* font-family: var(--font-heading-family); */
  font-size: calc(var(--font-body-size));

  letter-spacing: 0.1em;
  line-height: 1;
  font-style: normal;
  font-weight: 400;

  padding: 0;
  text-align: left;
}

table tr {
  text-align: left;
}

li.list-menu__item {
  width: 100%;
  padding: 0;
}

  li.list-menu__item a {
    width: 100%;
    padding: 0.25rem 0;

    transition-property: color, text-underline-offset;
    transition: 400ms ease-in-out;

    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: 0.3em;
    text-decoration-thickness: 0.05em;  
}

li.list-menu__item a:hover,
li.list-menu__item a:focus-visible {
    color: var(--color-main);
    text-decoration-color: var(--color-main);
    text-underline-offset: 0.35em;
  }
/* Utility Classes */

.pointer-none {
  pointer-events: none;
}

.visually-hidden {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.ovh {
  overflow: hidden;
}

.ov-x {
  overflow-x: scroll;
}
.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.absolute-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.absolute-center-y {
  top: 50%;
  transform: translateY(-50%);
}

.absolute-center-x {
  left: 50%;
  transform: translateX(-50%);
}

.left-0 {
  left: 0;
}

.left-center {
  left: 50%;
  transform: translateX(-50%);
}

.right-0 {
  right: 0;
}

.top-0 {
  top: 0;
}

.bottom-0 {
  bottom: 0;
}

.fixed {
  position: fixed;
}

.fixed-center {
  top: 0;
}

.sticky {
  position: sticky;
}

.pad-1 {
  padding: 1rem;
}

.pad-2 {
  padding: 2rem;
}

.pad-3 {
  padding: 3rem;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-i,
em {
  font-style: italic;
}

a.underlined-link {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.font-reg {
  font-family: var(--font-body-family);
  font-weight: 400;
}

.font-med {
  font-family: var(--font-body-medium);
  font-weight: 500;
}

.font-head {
  font-family: var(--font-heading-family);
  font-weight: 500;
}

.font-head em,
.font-head-italic {
  font-family: var(--font-heading-italic);
  font-weight: 500;
}

.font-head-reg {
  font-family: var(--font-heading-regular);
  font-weight: 400;
}

.font-head-med em,
.font-head-med-italic {
  font-family: var(--font-heading-regular-italic);
  font-weight: 400;
}

.font-sub {
  font-size: var(--font-body--size-s);
}

.font-body-l {
  font-size: var(--font-body--size-l);
  /* line-height: 120%; */
}

.font-copy {
  font-family: var(--font-copy--family);
  font-size: var(--font-copy--size);
  font-weight: 400;
  font-variation-settings: var(--font-copy--weight);
  line-height: var(--font-copy--line);
}

.font-copy--strong {
  font-family: var(--font-copy--family);
  font-weight: 600;
  font-variation-settings: 'wght' 900;
}

.width-50 {
  width: 50%;
}

.grid {
  display: grid;
}

.grid-2 {
  grid-template-columns: repeat(2, minmax(0.5rem, 1fr));
  grid-gap: 2rem;
}

.grid-3 {
  grid-template-columns: repeat(3, minmax(0.5rem, 1fr));
  grid-gap: 1rem;
}

.grid-4 {
  grid-template-columns: repeat(4, minmax(0.5rem, 1fr));
  grid-gap: 1rem;
}

.grid-6 {
  grid-template-columns: repeat(6, minmax(0.5rem, 1fr));
  grid-gap: 1rem;
}

.grid-8 {
  grid-template-columns: repeat(8, minmax(0.5rem, 1fr));
  grid-gap: 2rem;
}

.col-span-1 {
  grid-column: span 1;
}

.col-span-2 {
  grid-column: span 2;
}

.row-span-1 {
  grid-row: span 1;
}

.row-span-2 {
  grid-row: span 2;
}

.flex {
  display: flex;
}

.flex-column {
  display: flex;
  flex-direction: column;
}
.flex-row {
  display: flex;
  flex-direction: row;
}
.row-reverse {
  flex-direction: row-reverse;
}

.justify-start {
  justify-content: flex-start;
}
.justify-between {
  justify-content: space-between;
}
.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.items-center {
  align-items: center;
}

.items-start {
  align-items: flex-start;
}

.items-end {
  align-items: flex-end;
}

.flex-wrap {
  flex-wrap: wrap;
}

.gap-1 {
  gap: 1rem;
}

.gap-075 {
  gap: 0.75rem;
}

.gap-05 {
  gap: 0.5rem;
}

.color-grey {
  color: var(--color-grey);
}

.color-white {
  color: var(--color-white);
}

.color-red {
  color: red;
}

.color-heading,
.color-main {
  color: var(--color-main);
}

.color-body,
.color-grey-dark {
  color: var(--color-dark-grey);
}

.bg-main {
  background-color: var(--color-main);
}

.bg-green {
  background-color: var(--color-green);
}

.bg-grey {
  background-color: var(--color-grey);
}

.bg-white {
  background-color: var(--color-white);
}

.border-main {
  border: var(--rule);
}

.border-grey {
  border: var(--rule-grey);
}

.border-white {
  border: var(--rule-white);
}

.bt-grey {
  border-top: var(--rule-grey);
}

.bg-blur {
  background: var(--color-blur, rgba(255, 255, 255, 0.01));
  backdrop-filter: var(--blur);
}

.bg-blur-s {
  background: var(--color-blur, rgba(255, 255, 255, 0.01));
  backdrop-filter: var(--blur-s);
}

.rad-xs {
  border-radius: var(--radius-xs);
}

.rad-s {
  border-radius: var(--radius-s);
}

.rad-m {
  border-radius: var(--radius-m);
}

.rad-l {
  border-radius: var(--radius-l);
}

.rad-100 {
  border-radius: 100%;
}

.w-10 {
  width: 10%;
}

.w-20 {
  width: 20%;
}

.w-25 {
  width: 25%;
}

.w-30 {
  width: 30%;
}

.w-40 {
  width: 40%;
}

.w-50 {
  width: 50%;
}

.w-60 {
  width: 60%;
}

.w-70 {
  width: 70%;
}

.w-75 {
  width: 75%;
}

.w-80 {
  width: 80%;
}

.w-90 {
  width: 90%;
}

.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

.ratio-57 {
  aspect-ratio: 5/7;
}

@supports not (aspect-ratio: 5/7) {
  .ratio-57 {
    padding-top: 140%;
  }

  .ratio-57 > * {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }

  .ratio-57 > img {
    width: 100%;
    height: auto;
  }

  .ratio-57 > video {
    width: 100%;
    height: auto;
  }
}

.ratio-1 {
  aspect-ratio: 1/1;
}

@supports not (aspect-ratio: 1/1) {
  .ratio-1 {
    padding-top: 100%;
  }

  .ratio-1 > * {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }

  .ratio-1 > img {
    width: 100%;
    height: auto;
  }

  .ratio-1 > video {
    width: 100%;
    height: auto;
  }
}

.ratio-46 {
  aspect-ratio: 4/6;
}

@supports not (aspect-ratio: 4/6) {
  .ratio-46 {
    padding-top: 150%;
  }

  .ratio-46 > * {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }

  .ratio-46 > img {
    width: 100%;
    height: auto;
  }

  .ratio-46 > video {
    width: 100%;
    height: auto;
  }
}

.ratio-64 {
  aspect-ratio: 6/4;
}

@supports not (aspect-ratio: 6/4) {
  .ratio-64 {
    padding-top: 66.6666666667%;
  }

  .ratio-64 > * {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }

  .ratio-64 > img {
    width: 100%;
    height: auto;
  }

  .ratio-64 > video {
    width: 100%;
    height: auto;
  }
}

.ratio-169 {
  aspect-ratio: 16/9;
}

@supports not (aspect-ratio: 16/9) {
  .ratio-169 {
    padding-top: 56.25%;
  }

  .ratio-169 > * {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }

  .ratio-169 > img {
    width: 100%;
    height: auto;
  }

  .ratio-169 > video {
    width: 100%;
    height: auto;
  }
}

.obj-cover {
  object-fit: cover;
}

.obj-fill {
  object-fit: fill;
}

.opacity-0 {
  opacity: 0;
}

.opacity-025 {
  opacity: 0.25;
}

.opacity-05 {
  opacity: 0.5;
}

.opacity-075 {
  opacity: 0.75;
}

.opacity-1 {
  opacity: 1;
}

/* no-js */
.no-js,
.no-js-list {
  display: none;
}

.wrapper {
  margin: 0 auto;
  padding: 0 2rem;
}

.m-auto {
  margin: 0 auto;
}

.z-base {
  z-index: var(--z-base);
}
.z-filter {
  z-index: var(--z-filter);
}
.z-header {
  z-index: var(--z-header);
}
.z-modal {
  z-index: var(--z-modal);
}

.nowrap {
  white-space: nowrap;
}

details {
  --present: 0;

  border-bottom: var(--rule-grey-light);
  padding: 1rem 0;
}

details summary, 
details summary.h2 {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;

  color: currentColor;
  font-family: var(--font-body-medium);
  font-size: var(--font-body-size);
  font-weight: 500;
  line-height: var(--font-label-line);
}

summary,
summary.h2 {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;

  color: currentColor;
  font-family: var(--font-body-medium);
  font-size: var(--font-body-size);
  font-weight: 500;
  line-height: var(--font-label-line);
}

summary .summary__toggle,
summary.h2 .summary__toggle {
  pointer-events: none;
  width: 1rem;
  height: 1rem;

  display: flex;
  align-items: center;
}
  

details summary svg {
  transform: rotate(0);
  transition-property: transform, opacity;
  transition: 240ms ease-in-out 0s;
  width: 100%;
  height: 100%;
}

details summary svg path {
  fill: var(--color-main);  
}

details[open] > summary {
  cursor: pointer;
  padding-bottom: 1rem;
}

details[open] > summary svg:first-child {
  transform: rotate(45deg);
  opacity: 0.33;
}
  

details.details--contained {
  width: 100%;
  border: var(--rule-grey);
  border-radius: var(--radius-s);

  background-color: var(--color-white);
}

details.details--contained summary:first-of-type {
  padding: 0.5rem 0.66rem;
  justify-content: space-between;
  align-items: center;
  background: var(--color-offset);

  transition: background-color 240ms ease-in-out;
}

details.details--contained[open] summary {
  background: var(--color-white);
}
    
  

details.product-main__accordian.details--contained[open] summary,
details.product-main__accordian.details--contained summary {
  background-color: transparent;
}


.rte__headline,
.linklist__title {
  margin-bottom: .75rem;
  font-size: var(--font-body--size-s);
}
  
/* linklists */
.linklist {
  display: flex;
  flex-direction: column;
}

.linklist__item {
  line-height: 120%;
  display: flex;
 
  margin: 0 0 .125rem 0;
}

.linklist__item a {
  width: 100%;
  padding: 0 0 0.25rem 0;
}



/* --Buttons */

.btn,
input[type="submit"].btn {
  cursor: pointer;
  white-space: nowrap;

  display: flex;
  justify-content: center;
  align-items: center;

  padding: 0.33rem 1rem 0.33rem;
  border-radius: var(--radius-l);
  cursor: pointer;

  font-family: var(--font-body-medium);
  font-size: var(--font-body-size);
  line-height: var(--font-label-line);
  font-style: normal;
  font-weight: var(--font-heading-weight);
  letter-spacing: var(--font-body-letter);

  border: var(--rule-trans);
  /* box-shadow: var(--shadow-sml); */

  color: var(--color-white);
  background: var(--color-main);

  transition: background-color 240ms ease-in-out 0s, color 240ms ease-in-out 0s;
}
.btn:hover,
input[type="submit"].btn:focus-visible {
  color: var(--color-main);
  background: var(--color-white);
  border-color: currentColor;
}

input[type="submit"].btn.btn--disabled,
.btn.btn--disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

input[type="submit"].btn.btn--primary,
.btn.btn--primary {
  color: var(--color-white);
  background: var(--color-green);
  text-align: center;
}

input[type="submit"].btn.btn--primary:hover,
.btn.btn--primary:focus-visible {
  color: var(--color-green);
  background: var(--color-white);
}

.btn.btn--secondary,
input[type="submit"].btn.btn--secondary {
  color: currentColor;
  background: var(--color-blur);
  backdrop-filter: var(--blur);
  border-color: currentColor;
  text-align: center;

  align-self: start;
}

input[type="submit"].btn.btn.btn--secondary:hover,
input[type="submit"].btn.btn--secondary:focus-visible,
.btn.btn--secondary:hover,
.btn.btn--secondary:focus-visible {
  color: var(--color-white);
  background: currentColor;
}
  

.btn.btn--tertiary,
input[type="submit"].btn.btn--tertiary {
  color: currentColor;
  background: transparent;
  border: none;
  box-shadow: none;

  font-family: var(--font-body-family);
  font-weight: 400;

  text-decoration: underline;
  text-underline-offset: 0.4rem;
  text-decoration-thickness: var(--border-width);

  transition-property: text-decoration;
  transition: 240ms ease-in-out 0s;

  padding: 0.66rem 0;
}

.btn.btn--tertiary:hover,
.btn.btn--tertiary:focus-visible,
input[type="submit"].btn.btn--tertiary:hover,
input[type="submit"].btn.btn--tertiary:focus-visible {
      color: currentColor;
      background: transparent;
      text-underline-offset: 0.5rem;
}

  


.add-to-cart-button {
  width: 100%;
  padding: 0.66rem 1rem;
  height: 3rem;
}

.add-to-cart-button.quick-add-to-cart-button,
.quick-add-to-cart-button,
.add-to-cart-button.quick-add-to-cart-button {
  margin: 0;
  align-self: flex-start;

  width: auto;
  height: auto;
  padding: 0.33rem 0.66rem;
  border-radius: var(--radius-l);

  display: flex;
  justify-content: center;
  align-items: center;

  font-family: var(--font-body-medium);
  font-weight: 500;
  font-size: var(--font-body-size-s);
  line-height: var(--font-label-line);

  font-style: normal;

  background-color: var(--color-green);
  color: var(--color-white);
  border: var(--rule-trans);
}

.add-to-cart-button.quick-add-to-cart-button:hover,
.quick-add-to-cart-button:hover,
.add-to-cart-button.quick-add-to-cart-button:hover {
  background-color: var(--color-white);
  color: var(--color-main);
}

.add-to-cart-button.quick-add-to-cart-button span.quick-cta,
.quick-add-to-cart-button span.quick-cta,
.add-to-cart-button.quick-add-to-cart-button span.quick-cta {
    display: block;
  }

.add-to-cart-button.quick-add-to-cart-button span.confirmation-cta,
.quick-add-to-cart-button span.confirmation-cta,
.add-to-cart-button.quick-add-to-cart-button span.confirmation-cta {
    display: none;
    color: var(--color-green);
  }

.add-to-cart-button.quick-add-to-cart-button.confirmation,
.quick-add-to-cart-button.confirmation,
.add-to-cart-button.quick-add-to-cart-button.confirmation {
  background-color: var(--color-white);
  border: var(--rule-main);
}

.add-to-cart-button.quick-add-to-cart-button.confirmation span.quick-cta,
.quick-add-to-cart-button.confirmation span.quick-cta,
.add-to-cart-button.quick-add-to-cart-button.confirmation span.quick-cta  {
  display: none;
}

.add-to-cart-button.quick-add-to-cart-button.confirmation span.confirmation-cta,
.quick-add-to-cart-button.confirmation span.confirmation-cta,
.add-to-cart-button.quick-add-to-cart-button.confirmation span.confirmation-cta {
  display: block;   
}

.add-to-cart-button.quick-add-to-cart-button.disabled--button,
.quick-add-to-cart-button.disabled--button,
.add-to-cart-button.quick-add-to-cart-button.disabled--button {
  background-color: var(--color-grey);
  color: var(--color-white);
  cursor: not-allowed;
}

 
  
.add-to-cart-button--popover :hover {
  background-color: var(--color-white);
  color: var(--color-main);
}

.add-to-cart-button--popover span.quick-cta {
  display: block;
}

.add-to-cart-button--popover span.confirmation-cta {
  display: none;
  color: var(--color-green);
}

.add-to-cart-button--popover.confirmation {
    background-color: var(--color-white);
}
.add-to-cart-button--popover.confirmation span.quick-cta {
  display: none;
}
.add-to-cart-button--popover.confirmation span.confirmation-cta {
  display: block;
}
.add-to-cart-button--popover.disabled--button {
  background-color: var(--color-grey);
  color: var(--color-white);
  cursor: not-allowed;
}

.add-to-cart-button .confirmation-message,
.add-to-cart-button .disabled-text {
  display: none;
}

.add-to-cart-button.confirmation .confirmation-message {
  display: flex;
}
.add-to-cart-button.confirmation .call-to-action,
.add-to-cart-button.confirmation.disabled--button .disabled-text {
  display: none;
}

.add-to-cart-button span {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  line-height: var(--font-label-line);
}

.add-to-cart-button .call-to-action {
  display: flex;
  align-items: center;
}

.add-to-cart-button.disabled--button .disabled-text {
  display: flex;
}

.add-to-cart-button.disabled--button .disabled-text.in-cart-text {
  display: none;
}

.product-main__info
  .add-to-cart-form
  .add-to-cart-button.disabled--button
  .call-to-action,
.product-main__info
  .add-to-cart-form
  .add-to-cart-button.confirmation
  .call-to-action {
  display: none;
}

button.read-more {
  text-underline-offset: 0.15rem;
  text-decoration-thickness: var(--border-width);
  text-decoration: underline;

  transition-property: text-decoration;
  transition: 240ms ease-in-out 0s;

  display: inline;
  color: var(--color-grey-dark);
}
button.read-more[aria-expanded="true"] {
  opacity: 0.33;
}

button.read-more:hover {
  text-decoration: none;
}


/* HTML Classes */

html.mini-cart-open body,
html.menu-active body,
html.search-active body,
html.quick-add-popover-open body {
  overflow: hidden;
  max-height: 100vh;
}

html.quick-add-popover-open body {
  background-color: var(--color-blur);
  backdrop-filter: var(--blur);
  -webkit-backdrop-filter: var(--blur);

}

/* Annuouncement Bar */
html.show-banner body {
  margin-top: var(--banner-height);
}

html.show-banner header.main-header {
  top: var(--banner-height);
}

html.show-banner .mt-head {
  margin-top: calc(var(--header-height) + var(--ann-height));
}

/* Overflow Gallerys */

ul.ov-gallery {
  display: flex;
  width: 100%;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;

  scrollbar-width: thin;
  scrollbar-color: var(--color-grey-light) transparent;
}

li.ov-gallery__item {
  scroll-snap-align: start;
  flex: 0 0 calc(100% - 3rem);
  max-width: 80%;
}
li.ov-gallery__item:last-child {
  margin-right: 1rem;
}


/* Mini Components */

/* Icons */
.icon {
  max-width: 2rem;
}

.header__item:hover .icon,
.header__item:focus-visible .icon {
  pointer-events: none;
}

.header__item:hover .icon path,
.header__item:focus-visible .icon path {
  fill: var(--color-red);
}

.header__item:focus .icon path {
  transition: fill 120ms ease-in-out;
}

.header__item .icon {
  transition: transform 120ms ease-in-out;
}

.header__item:hover .icon,
.header__item:focus .icon {
  transform: scale(1.05);
}

.js-cart-icon .icon-cart--empty {
  display: block;
}

.js-cart-icon.has-items .icon-cart--filled {
  display: block;
}

.js-cart-icon.has-items .icon-cart--empty {
  display: none;
}

/* Labels */
.product-labels {
  z-index: 1;

  display: flex;
  flex-direction: row;
  gap: 0.33rem;

  top: 0.33rem;
  left: 0.33rem;

}

.product-labels.show-desktop {
  display: none;
}

.product-card .product-labels {
  top: 0.33rem;
  left: 0.33rem;
  margin: 0;
  flex-wrap: wrap;
}

.product-main .product-labels {
  top: auto;
  bottom: 0.66rem;
}

.product-labels__item {
  padding: 0.33em 0.5em 0.33em;
  font-size: var(--font-body-size-s);
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  font-size: 0.66rem;

  
}
.product-labels__item.bg-blur {
  background: var(--color-blur);
  backdrop-filter: var(--blur);
}
/* rte */
.rte ul li,
.metafield-rich_text_field ul li {
  list-style: disc;
  margin-left: 1rem;
}

.rte strong,
.rte b {
  font-family: var(--font-body-medium);
  font-weight: 500;
  font-style: normal;
  letter-spacing: var(--font-body-letter);
  line-height: var(--font-body-line);
}

.rte em,
.rte i {
  font-style: italic;
}

.rte img {
  background-color: transparent;
  max-width: 50%; 
}
.rte img.w-100 {
  max-width: 100%;
  width: 100%;
}

.rte img.w-66 {
  max-width: 66%;
  width: 100%;
}

.rte img.w-50 {
  max-width: 50%;
  width: 100%;
}

.rte img.w-33 {
  max-width: 33%;
  width: 100%;
}



/* Search Form */
.form-search__terms {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.form-search__submit {
  min-width: 16.6%;
}

html.search-active .form-search-hidden .form-search__terms {
  width: 100%;
  opacity: 1;
}

html.search-active .form-search-hidden .form-search__button-open {
  display: none;
}

html.search-active .form-search-hidden .form-search__button-close {
  display: block;
}

/* Placeholder */

svg.placeholder {
  background: var(--color-offset);
  border-radius: var(--radius-s);
}

/* Price */

.price > * {
  display: inline-block;
  vertical-align: top;
}

.price.price--unavailable {
  visibility: hidden;
}

.price--end {
  text-align: right;
}

.price .price-item {
  margin: 0 0.33rem 0 0;
}

.price__sale .price-item--regular {
  /* opacity: 0.33; */
}

.price__regular .price-item--regular {
  margin-right: 0;
}

.price:not(.price--show-badge) .price-item--last:last-of-type {
  margin: 0;
}

.price--large {
  font-size: 1.6rem;
  line-height: 1;
  letter-spacing: 0.13rem;
}

.price--sold-out .price__availability,
.price__regular {
  display: block;
}

.price__sale,
.price__availability,
.price .price__badge-sale,
.price .price__badge-sold-out,
.price--on-sale .price__regular,
.price--on-sale .price__availability {
  display: none;
}

.price--sold-out .price__badge-sold-out,
.price--on-sale .price__badge-sale {
  display: inline-block;
}

.price--on-sale .price__sale {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.price--center {
  display: initial;
  justify-content: center;
}

.price--on-sale .price-item--regular {
  text-decoration: line-through;
  color: var(--color-grey);
}

.add-to-cart-button .price--on-sale .price-item--regular {
  color: var(--color-white);
  opacity: 0.7;
}

.unit-price {
  display: block;
}

/* Show and Hide */

.show-mobile,
.large-hide {
  display: block;
}

.show-desktop,
.small-hide {
  display: none;
}

.wrapper {
  padding: 0 1rem;
}

section.page-404 {
    min-height: 66svh;
    margin-top: 33svh;
}

h1.page-404__title {
  text-transform: uppercase;
    color: var(--color-white);
}

.page-404__title {
  padding: 0 var(--container);
  margin: 0 auto var(--container) auto;
}

.page-404 .page-content {
  padding: 0 var(--container);
  margin: 0 auto;
}

.below-1 {
  margin-bottom: 1rem;
}

.below-2 {
  margin-bottom: 2rem;
}

.below-3 {
  margin-bottom: 3rem;
}

@media screen and (min-width: 1024px) { 

  .show-mobile,
  .large-hide {
    display: none;
  }

  .show-desktop,
  .small-hide {
    display: inherit;
  }

  .btn,
  input[type="submit"].btn {
    padding: 0.5rem 0.75rem;
  }

  .grid-2 {
    grid-gap: 1rem;
  }

  .show-mobile.form-search__button {
    display: flex;
    width: 2rem;
  }

  .linklist--title {
    margin-bottom: 1rem;
  }

  .linklist li:first-child {
    padding-top: 0;
  }

  .product-labels {
    top: 0.66rem;
    left: 0.66rem;
  }

  .product-main .product-labels {
    top: 1rem;
    bottom: auto;
  }

  .product-main .product-labels__item {
    font-size: var(--font-body-size-s);
    padding: 0.33em 0.5em;
  }

  .add-to-cart-button.quick-add-to-cart-button,
  .quick-add-to-cart-button.disabled--button {
    font-size: var(--font-body-size);
    padding: 0.33rem 1rem;
    line-height: var(--font-label-line);
  }

  .show-banner main {
    margin-top: calc(var(--header-height) + var(--banner-height));
  }

  .grid--right {
    grid-column: 2 / span 1;
  }

  .grid--left {
    grid-column: 1 / span 1;
  }

  .grid-row--1 {
    grid-row: span 1;
  }

  .grid-row--1--start-1 {
    grid-row: 1 / span 1;
  }

  .grid-row--1--start-2 {
    grid-row: 2 / span 1;
  }

  .grid-row--1--start-3 {
    grid-row: 3 / span 1;
  }
  .grid-row--1--start-4{
    grid-row: 4 / span 1;
  }
  .grid-row--1--start-5 {
    grid-row: 5 / span 1;
  }
  .grid-row--1--start-6 {
    grid-row: 6 / span 1;
  }

  .grid-row--2 {
    grid-row: span 2;
  }

  .grid-row--2--start-1 {
    grid-row: 1 / span 2;
  }

  .grid-row--2--start-2 {
    grid-row: 2 / span 2;
  }

  .grid-row--2--start-3 {
    grid-row: 3 / span 2;
  }

  .grid-row--2--start-4 {
    grid-row: 4 / span 2;
  }

  .grid-row--2--start-5 {
    grid-row: 5 / span 2;
  }

  .grid-row--2--start-6 {
    grid-row: 6 / span 2;
  }


  .grid-row--3 {
    grid-row: span 3;
  }

  .grid-row--3--start-1 {
    grid-row: 1 / span 3;
  }

  .grid-row--3--start-2 {
    grid-row: 2 / span 3;
  }

  .grid-row--3--start-3 {
    grid-row: 3 / span 3;
  }

  .grid-row--3--start-4 {
    grid-row: 4 / span 3;
  }

  .grid-row--3--start-5 {
    grid-row: 5 / span 3;
  }

  .grid-row--3--start-6 {
    grid-row: 6 / span 3;
  }

  .grid-row--4 {
    grid-row: span 4;
  }

  .grid-row--4--start-1 {
    grid-row: 1 / span 4;
  }

  .grid-row--4--start-2 {
    grid-row: 2 / span 4;
  }

  .grid-row--4--start-3 {
    grid-row: 3 / span 4;
  }

  .grid-row--4--start-4 {
    grid-row: 4 / span 4;
  }

  .grid-row--4--start-5 {
    grid-row: 5 / span 4;
  }

  .grid-row--4--start-6 {
    grid-row: 6 / span 4;
  }

  .grid-row--5 {
    grid-row: span 5;
  }

  .grid-row--5--start-1 {
    grid-row: 1 / span 5;
  }

  .grid-row--5--start-2 {
    grid-row: 2 / span 5;
  }

  .grid-row--5--start-3 {
    grid-row: 3 / span 5;
  }

  .grid-row--5--start-4 {
    grid-row: 4 / span 5;
  }

  .grid-row--5--start-5 {
    grid-row: 5 / span 5;
  }

  .grid-row--5--start-6 {
    grid-row: 6 / span 5;
  }

  .grid-row--6 {
    grid-row: span 6;
  }

  .grid-row--6--start-1 {
    grid-row: 1 / span 6;
  }

  .grid-row--6--start-2 {
    grid-row: 2 / span 6;
  }

  .grid-row--6--start-3 {
    grid-row: 3 / span 6;
  }

  .grid-row--6--start-4 {
    grid-row: 4 / span 6;
  }

  .grid-row--6--start-5 {
    grid-row: 5 / span 6;
  }

  .grid-row--6--start-6 {
    grid-row: 6 / span 6;
  }


  .grid--full {
    grid-column: 1 / span 2;
  }
  .grid--full video {
    width: 100%;
  }

  /* main {
    margin-top: var(--header-height);

  } */

  .rte img {
    max-width: 33%; 
  }
  .rte img.w-100--l {
    width: 100%;
    max-width: 100%;
  }

  .rte img.w-66--l {
    width: 100%;
    max-width: 66%;
  }

  .rte img.w-50--l {
    width: 100%;
    max-width: 50%;
  }

  .rte img.w-33--l {
    width: 100%;
    max-width: 33%;
  }
  
  
  

  body:has(header.transparent) main,
  .show-banner body:has(header.transparent) main {
    margin-top: 0;
  }

  .show-banner main {
    margin-top: var(--header-height-banner);
  }

  .show-banner main :has(.page-404) {
    margin-top: var(--header-height-wpad);
  }
  .template-page main {
    margin-top: var(--header-height-wpad);
  }

  .template-page main:has(.section-page-hero) {
    margin-top: var(--header-height);
  }

  .show-banner .template-page main {
    margin-top: var(--header-height-banner-wpad);
  }

  .show-banner .template-page main:has(.section-page-hero) {
    margin-top: var(--header-height-banner);
  }
}