/** Shopify CDN: Minification failed

Line 222:0 Expected "}" to go with "{"

**/
.image-with-text {
  position: relative;
  overflow: hidden;
}
.image-with-text .media-wrapper{
  background-color: rgb(var(--color-secondary-background));
}

.image-with-text__media {
  min-height: 100%;
}
.image-with-text__inner {
  --padding-x: 2rem;
  --padding-y: 4.8rem;
  position: relative;
}
@media (min-width: 768px) {
  .image-with-text__inner {
    --padding-x: 2rem;
    --padding-y: 3.2rem;
  }
}
@media (min-width: 1024px) {
  .image-with-text__inner {
    --padding-x: 2.4rem;
    --padding-y: 4.8rem;
  }
}
@media (min-width: 1280px) {
  .image-with-text__inner {
    --padding-x: 8rem;
    --padding-y: 6rem;
  }
}
.image-with-text:not(.color-inherit) .image-with-text__inner {
  padding: var(--padding-y) var(--padding-x);
}
@media (min-width: 768px) {
  .image-with-text--text-first .image-with-text__inner {
    padding-inline-end: var(--padding-x);
    order: -1;
  }
}
@media (min-width: 768px) {
  .image-with-text--image-first .image-with-text__inner {
    padding-inline-start: var(--padding-x);
  }
}

.page-width-half {
  width: 100%;
  max-width: calc(var(--page-width) / 2);
  margin: 0 auto;
  padding: 0 1.5rem;
}

@media screen and (min-width: 750px) {
  .page-width-half {
    padding: 0 5rem;
  }
}

.image-with-text__wrapper {
  position: relative;
}
.section .image-with-text.page-opener::before {
  content: '';
  position: absolute;
  top: -2%;
  bottom: -2%;
  width: 150%;
  background-image: var(--text-background-image);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: var(--text-background-position);
  z-index: 0;
  opacity: 0.5;
  pointer-events: none;
}
#MainContent > div:first-child:has(.image-with-text) .image-with-text::before{
  right: 60%;
}
.page-template.loyalty #MainContent > div:first-child:has(.image-with-text) .image-with-text::before{
  right: 65%;
  left: 5%;
  top: 50%;
}
.section .image-with-text:not(.page-opener)::before{
  content: '';
  position: absolute;
  top: 70%;
  right: 50%;
  bottom: 0;
  left: 0;
  background-image: var(--text-background-image);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  z-index: 0;
  margin: 0 auto;
  opacity: 0.8;
  pointer-events: none;
}

.image-with-text__content {
  position: relative;
  z-index: 1;
}

.image-with-text--text-first::before {
  left: -15%;
}

.image-with-text--image-first::before {
  right: -15%;
}

.section.image-with-text {
  padding-left: 0;
  padding-right: 0;
}

/* When container is set to fixed width, apply background only to content */
.section.image-with-text:has(.page-width) {
  background: transparent;
}

.section.image-with-text:has(.page-width) .image-with-text__wrapper {
  background: rgb(var(--color-background));
}

#MainContent > div:first-child:has(.image-with-text) .image-with-text:not(.page-opener) .image-with-text__wrapper{
  grid-template-columns: 40% auto;
}

#MainContent > div:first-child:has(.image-with-text) .image-with-text:not(.page-opener) .image-with-text__wrapper .image-with-text__inner{
  align-items: flex-start;
}

.image-with-text.page-opener .image-with-text__inner .rich-text__text h1{
  font-size: 56px;
  line-height: calc(1 + .2/max(1,var(--font-heading-scale)));
}
@media (max-width: 767.98px) {
  .section:not(.page-opener) .image-with-text::before,
  #MainContent > div:first-child:has(.image-with-text) .image-with-text::before{
    top: 80%;
    right: 0;
  }
  .page-template.loyalty #MainContent > div:first-child:has(.image-with-text) .image-with-text::before{
    top: 40%;
    right: 5%;
    bottom: 5%;
    left: 5%;
    background-size: contain;
  }
  .image-with-text.color-inherit .image-with-text__inner {
    padding-top: 2.4rem;
  }

  .image-with-text.page-opener .image-with-text__wrapper{
    position: relative;
    height: 70vh;
  }
  .image-with-text.page-opener .image-with-text__wrapper::before{
    position: absolute;
    top: 30%;
    left: 0;
    right: 0;
    bottom: 0;
    content: '';
    display: block;
    background: linear-gradient(0deg,rgba(40, 49, 36, 1) 30%, rgba(40, 49, 36, 0) 100%);
    z-index: 1;
  }
  .image-with-text.page-opener .image-with-text__inner{
    position: absolute;
    bottom: 0;
    z-index: 2;
  }
  .image-with-text.page-opener .image-with-text__inner *{
    color: #fff;
  }
  .image-with-text.page-opener .image-with-text__inner .rich-text__text:nth-child(2){
    display: none;
  }
  .image-with-text.page-opener .image-with-text__inner .rich-text__text h1{
    font-size: 40px;
  }
  .image-with-text.page-opener .image-with-text__inner .btn{
    color: rgb(var(--color-button));
  }
  .image-with-text.page-opener .btn.btn--with-circle::before{
    background-color: rgb(var(--color-background));
  }
  .image-with-text.page-opener .btn.btn--with-circle::after{
    background: rgb(var(--color-background));
  }
  .image-with-text.page-opener .btn.btn--with-circle path{
    fill: #000;
  }
  #MainContent>div:first-child:has(.image-with-text) .image-with-text .image-with-text__wrapper {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
  .image-with-text:not(.page-opener) .image-with-text__wrapper parallax-element:has(.image-with-text__media),
  .image-with-text:not(.page-opener) .image-with-text__wrapper parallax-element .image-with-text__media{
    aspect-ratio: 2/1;
    height: unset;
  }
  #MainContent > div:first-child:has(.image-with-text) h2,
  #MainContent > div:first-child:has(.image-with-text) h2 *{
    font-size: 48px;
  }
  #MainContent>div:first-child:has(.image-with-text) .image-with-text:not(.page-opener) .image-with-text__inner{
    height: 399px;
  }