/** Shopify CDN: Minification failed

Line 268:0 Unexpected "}"

**/
.custom-section.key-ingredients {
  min-height: 76rem;
}

.custom-section .key-ingredients__list--wrapper {
  position: relative;
}

.custom-section.key-ingredients .key-ingredients__list--wrapper {
  display: flex;
  flex-flow: column nowrap;
}

.custom-section .all-ingredients__item {
  position: relative;
}

.custom-section .key-ingredients__item .grid__item,
.custom-section .all-ingredients__item .grid__item {
  max-width: 100%;
}

.custom-section .key-ingredient__name,
.custom-section .ingredient__name {
  margin-block: 0;
}

.custom-section .key-ingredient__name {
  transition: font-family, font-style 1s ease-in-out;
}

.custom-section .ingredient__name {
  transition: opacity 0.3s ease-in-out;
}

.custom-section .key-ingredient__content,
.custom-section .ingredient__content {
  height: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity, visibility 1s ease-in-out;
}

.custom-section .key-ingredient__media-item,
.custom-section .ingredient__media-item,
.ingredient-popup .ingredient__media-item {
  margin-bottom: 28px;
}

.custom-section .key-ingredient__media-item .key-ingredient__image {
  aspect-ratio: 1 / 0.8;
}

.custom-section .ingredient__media-item .ingredient__image,
.ingredient-popup .ingredient__media-item .ingredient__image {
  aspect-ratio: 1 / 0.68;
}

.custom-section .key-ingredient__media-item .key-ingredient__image img,
.custom-section .ingredient__media-item .ingredient__image img,
.ingredient-popup .ingredient__media-item .ingredient__image img {
  max-width: 280px;
  max-height: calc(280px * 0.8);
  object-position: top center;
  object-fit: cover;  
  width: 100%;
}

.custom-section .key-ingredient__content .key-ingredient__description p,
.custom-section .ingredient__content .ingredient__description p,
.ingredient-popup .ingredient__content .ingredient__description p {
  margin-block: 0;
}

.custom-section .key-ingredients__item:hover > .h1.key-ingredient__name,
.custom-section .key-ingredients__item.active-ingredient .h1.key-ingredient__name {
  font-family: var(--font-heading-italic-family);
  font-style: italic;
  font-weight: normal;
}

.custom-section .key-ingredients__item:hover > .key-ingredient__content,
.custom-section .key-ingredients__item.active-ingredient .key-ingredient__content {
  height: 100%;
  opacity: 1;
  visibility: visible;
}

.custom-section .all-ingredients__item.active-ingredient .ingredient__content {
  opacity: 1;
  visibility: visible;
}

.custom-section .all-ingredients__item .ingredient__name {
  opacity: 0.6
}

.custom-section .all-ingredients__item:hover > .ingredient__name,
.custom-section .all-ingredients__item.active-ingredient .ingredient__name {
  opacity: 1;
}

.custom-section .ingredient__description {
  max-width: 56ch;
}


.custom-section .ingredient-popup .popup-modal__content-info {
  padding-inline: unset;
}

@media screen and (max-width: 989px) {  
  .custom-section .key-ingredients__item {
    flex-direction: column;
    margin-bottom: 0;
  }

  .custom-section .key-ingredient__media-item .key-ingredient__image,
  .custom-section .ingredient__media-item .ingredient__image {
    max-width: 280px;
    margin-inline: auto;
  }

  .custom-section .key-ingredients__item .h1.key-ingredient__name,
  .custom-section .key-ingredients__item .key-ingredient__content,
  .custom-section .all-ingredients__item .h1.ingredient__name,
  .custom-section .all-ingredients__item .ingredient__content {
    width: 100%;
  }

  .custom-section .key-ingredients__item.active-ingredient .key-ingredient__content {
    margin-bottom: 28px;
  }

  .custom-section.all-ingredients ul.all-ingredients__list--wrapper {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .custom-section.all-ingredients .all-ingredients__item {
    margin-bottom: 0;
    width: calc(50% - var(--grid-mobile-horizontal-spacing));
  }

  .custom-section.all-ingredients .ingredient__item--first .ingredient__content {
    height: 0;
    opacity: 0;
    visibility: hidden;
  }
}

@media screen and (min-width: 990px) {
  .custom-section.key-ingredients .key-ingredients__list--wrapper {
    row-gap: 4rem;
  }
  
  .custom-section .key-ingredients__item.grid {
    margin-bottom: 0;
  }
  
  .custom-section .key-ingredient__content,
  .custom-section .ingredient__content {
    max-width: 100%;
    height: auto;
    position: absolute;
  }

  .custom-section .key-ingredient__content {
    width: 30vw;
    top: 0;
    right: 4%;
  }

  .custom-section .ingredient__content {
    width: 33vw;
    top: -12vw;
    right: 8%;
  }

  .custom-section .all-ingredients__item.ingredient__item--first .ingredient__content {
    top: 0;
  }

  .custom-section .all-ingredients__item.ingredient__item--last .ingredient__content {
    top: -26vw;
  }

  .custom-section .key-ingredient__media-item,
  .custom-section .ingredient__media-item {
    margin-bottom: 40px;
    margin-top: 0;
  }

  .custom-section .key-ingredient__media-item .key-ingredient__image img {
    max-width: 30vw;
    max-height: calc(30vw * 0.8);
  }

  .custom-section .ingredient__media-item .ingredient__image img {
    max-width: 33vw;
    max-height: calc(33vw * 0.68);
  }

  .custom-section .key-ingredient__name span {
    display: block;
    max-width: 46%;
  }
}

@media screen and (min-width: 1201px) {
  .custom-section .key-ingredient__content {
    right: 8%;
  }
}

/*** Popup Styles ***/
.ingredient-popup[aria-hidden='true'] .js-ingredient__content {
  visibility: hidden;
}

.ingredient-popup[aria-hidden='false'] .js-ingredient__content {
  visibility: visible;
}

.ingredient-popup .js-ingredient__content {
  padding: 20px;
  max-height: 75vh;
  width: 90vw;
  height: auto;
  overflow: hidden;
  position: relative;
  opacity: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ingredient-popup  .popup-modal__content {
  overflow:hidden;
  margin-top: 0;
  top: 50%;
  height: 75%;
  transform: translate(-50%, -50%);
  padding: 24px;
}

.popup-close {
  background: transparent;
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 10px;
}

.custom-section.all-ingredients {
  z-index: 1;
}

.ingredient-popup .popup-modal__content-info {
  overflow-y: scroll;
}
}