.page-recipe-page {
  .page-recipe-page--banner {
    position: relative;
  }

  .page-recipe-page--banner .component-wrapper-picture--picture-image {
    width: 100%;
    height: 18.75rem;
    object-fit: cover;
    object-position: center;
  }

  .page-recipe-page--titles {
    padding: 0 0 3.19rem;
  }

  .page-recipe-page--titles {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    max-width: min(80vw, 94rem);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 10;
  }

  .page-recipe-page--titles .page-recipe-page--title {
    color: var(--background-white);
    font-family: var(--font-family);
    font-size: min(6.77vw, 1.8125rem);
    font-style: normal;
    font-weight: 400;
    line-height: 1.875rem;
    text-transform: uppercase;
  }

  .page-recipe-page--head-details {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
  }

  .page-recipe-page--recipe-duration,
  .page-recipe-page--recipe-range,
  .page-recipe-page--recipe-rating {
    display: flex;
    align-items: center;
    gap: 0.3125rem;
  }

  .page-recipe-page--recipe-duration .recipe-detail--logo svg,
  .page-recipe-page--recipe-range .recipe-detail--logo svg,
  .page-recipe-page--recipe-rating .recipe-detail--logo svg {
    width: 1.5rem;
    height: 1.5rem;
    aspect-ratio: 1/1;
  }

  .page-recipe-page--recipe-duration .recipe-detail--logo path,
  .page-recipe-page--recipe-range .recipe-detail--logo path,
  .page-recipe-page--recipe-rating .recipe-detail--logo path {
    fill: var(--background-white);
  }

  .page-recipe-page--recipe-duration .recipe-detail--value,
  .page-recipe-page--recipe-range .recipe-detail--value,
  .page-recipe-page--recipe-rating .recipe-detail--value {
    color: var(--background-white);
    font-family: var(--font-family-FiraSans--condensed-semiBold);
    font-size: min(4.67vw, 1.25rem);
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
  }

  .page-recipe-page--content {
    padding: 2.19rem 0;
  }

  .page-recipe-page--content--details {
    padding-bottom: 3.81rem;
  }

  .page-recipe-page--ingredients {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .page-recipe-page--ingredients-title {
    color: var(--primary);
    font-family: var(--font-family-firaSans);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.045rem;
    text-transform: uppercase;
  }

  .page-recipe-page--recipe-data-people {
    margin-top: 3.13rem;
    display: flex;
    height: 3.375rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    align-self: stretch;

    border-radius: 1.625rem 1.625rem 0 0;
    background: var(--background-white);
  }

  .page-recipe-page--recipe-data-people-lessPeople,
  .page-recipe-page--recipe-data-people-morePeople {
    display: flex;
    width: 1.75rem;
    height: 1.68269rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    border-radius: 2.25rem;
    background: var(--background-white);
    box-shadow: 0 4px 6.4px 0 rgba(0, 0, 0, 0.13);

    color: var(--black);
    text-align: center;
    font-family: var(--font-family-FiraSans--condensed-medium);
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.03rem;
    text-transform: uppercase;

    cursor: pointer;
  }

  .page-recipe-page--recipe-data-people-numberPeople {
    color: var(--black);
    text-align: center;
    font-family: var(--font-family-FiraSans--condensed-medium);
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.03rem;
    text-transform: uppercase;
    text-align: center;
    width: 1.0625rem;
  }

  .page-recipe-page--recipe-data-people-text {
    margin-left: 2.435rem;
    color: var(--black);
    font-family: var(--font-family-FiraSans--condensed-medium);
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.03rem;
    text-transform: uppercase;
  }

  .page-recipe-page--ingredients--list {
    list-style: none;
    padding-left: 0;
    width: 100%;
  }

  .page-recipe-page--ingredient {
    padding: 0.56rem 1.38rem;
    display: grid;
    grid-template-columns: min(calc(1/4*100%), 7.5rem) 1fr;
  }

  .page-recipe-page--ingredient:nth-child(odd) {
    background: var(--white);
  }

  .page-recipe-page--ingredient:nth-child(even) {
    background: var(--background-white);
  }

  .page-recipe-page--quantity-wrapper,
  .page-recipe-page--ingredient-label {
    color: var(--black);
    font-family: var(--font-family-firaSans);
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.25rem; /* 125% */
  }

  .page-recipe-page--ingredient-label a {
    color: var(--red);
    line-height: normal;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    width: 100%;
    display: flex;
    position: relative;
  }

  .page-recipe-page--ingredient-label a::after {
    /*content: '';*/
    display: block;
    width: 0.5rem;
    height: 0.75rem;
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.640625 0.765625L6.64063 5.76563L0.640625 10.7656' stroke='black' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0.38rem;
    right: 0;
  }

  .page-recipe-page--steps {
    margin-top: 4.88rem;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .page-recipe-page--recipe-steps-title h2 {
    color: var(--primary);
    font-family: var(--font-family-firaSans);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.045rem;
    text-transform: uppercase;
  }

  .page-recipe-page--steps--list {
    margin-top: 2rem;
    list-style: none;
    padding-left: 0;
    counter-reset: item;

    display: flex;
    flex-direction: column;
    gap: 1.25rem;
  }

  .page-recipe-page--recipe-step {
    counter-increment: item;
    position: relative;
    padding-left: 1.25rem;
  }

  .page-recipe-page--recipe-step p {
    color: var(--black);
    font-family: var(--font-family-firaSans);
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.25rem; /* 125% */
  }

  .page-recipe-page--recipe-step::before {
    content: counter(item);
    position: absolute;
    left: 0;
    top: 0;

    color: var(--primary);
    font-family: var(--font-family-FiraSans--condensed-medium);
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.03rem;
    text-transform: uppercase;
  }

  .page-recipe-page--steps--choosy {
    margin-top: 6.69rem;

    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 15.625rem;
    gap: 0.31rem;
  }

  .page-recipe-page--steps--choosy--image img {
    width: 12.5rem;
    height: auto;
    /*max-height: 5.125rem;*/
    /*aspect-ratio: 100/41;*/
  }

  .page-recipe-page--steps--choosy--text {
    display: flex;
    justify-content: center;
  }

  .page-recipe-page--steps--choosy--text span {
    color: var(--blue-2);
    text-align: center;
    font-family: var(--font-family-FiraSans--condensed-semiBold);
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.0375rem;
    text-align: center;
  }

  .page-recipe-page--highlight--top-wave {
    position: relative;
  }

  .page-recipe-page--highlight--top-wave::after {
    content: '';
    position: absolute;
    display: block;
    bottom: -0.25rem;
    left: 0;
    width: 100%;
    height: 0.75rem;
    background: var(--yellow);
  }

  .page-recipe-page--highlight--top-wave img {
    transform: rotate(180deg);
  }

  .page-recipe-page--highlight--bottom-wave {
    position: relative;
    background-color: var(--background-white);
  }

  .page-recipe-page--highlight--bottom-wave::after {
    content: '';
    position: absolute;
    display: block;
    top: -0.25rem;
    left: 0;
    width: 100%;
    height: 0.75rem;
    background: var(--yellow);
  }

  .page-recipe-page--related-product,
  .page-recipe-page--rating-sharing {
    background-color: var(--yellow);
  }

  .page-recipe-page--rating-sharing {
    padding-top: 4.25rem;
  }

  .page-recipe-page--related-product .content-width,
  .page-recipe-page--rating-sharing .content-width {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .page-recipe-page--related-product .content-width {
    width: calc(100% - 4rem * 2);
  }

  .page-recipe-page--related-product--title {
    color: var(--background-white);
    font-family: var(--font-family-firaSans);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.045rem;
    text-transform: uppercase;
    text-align: center;
  }

  .page-recipe-page--related-product--link {
    padding: 1.69rem 0 0.02rem;
    margin-top: 1.56rem;
    width: 100%;
  }

  .pageRecipePageAlt--related-product--picture {
    margin: 0 2.37rem 0 2.25rem;
  }

  .pageRecipePageAlt--related-product--picture img {
    aspect-ratio: 1 / 1;
    width: 100%;
    height: auto;
    transition: transform 0.5s ease;
  }

  .page-recipe-page--related-product--link:hover .pageRecipePageAlt--related-product--picture img {
    transform: scale(1.10);
  }

  .pageRecipePageAlt--related-product--label {
    margin: 0 0.75rem 0 0.44rem;

    color: var(--white);
    text-align: center;
    font-family: var(--font-family-firaSans);
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.25rem; /* 111.111% */
    text-transform: uppercase;
  }

  .page-recipe-page--rating {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.75rem;
  }

  .page-recipe-page--rating-title {
    color: var(--background-white);
    font-family: var(--font-family-firaSans);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.045rem;
    text-transform: uppercase;
    text-align: center;
  }

  .page-recipe-page--rating--stars {
    list-style: none;
    padding-left: 0;

    display: flex;
    gap: 0.94rem;
  }

  .page-recipe-page--rating--star svg {
    width: 3.50275rem;
    height: 3.125rem;
    aspect-ratio: 56.04/50;
  }

  .page-recipe-page--sharer {
    margin-top: 5.5rem;
    padding-bottom: 4.31rem;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.84rem;
  }

  .page-recipe-page--sharer-title {
    color: var(--background-white);
    text-align: center;
    font-family: var(--font-family-firaSans);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.045rem;
    text-transform: uppercase;
  }

  .page-recipe-page-alt--sharer__RecipePageAlt {
    display: flex;
    align-items: center;
    gap: 1.75rem;
  }

  .page-recipe-page-alt--sharer__RecipePageAlt-share-button {
    width: 2.5rem;
    height: 2.5rem;

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

  .component-recipes-list {
    padding-top: 2.56rem;

    .component-recipes-list--title {
      color: var(--primary);
      font-family: var(--font-family-firaSans);
      font-size: 1.5rem;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      letter-spacing: 0.045rem;
      text-transform: uppercase;
    }

    .component-recipes-list--image-link img {
      width: 100%;
      height: auto;
    }

    .component-recipes-list--ctas {
      display: none;
    }
  }

  .component-product-list__products-list {
    padding-top: 4.69rem;

    .component-product-list--title {
      color: var(--primary);
      font-family: var(--font-family-firaSans);
      font-size: 1.5rem;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      letter-spacing: 0.045rem;
      text-transform: uppercase;
    }

    .component-product-list--slider {
      height: min(70vw, 18.75rem);

      .component-product-list--image-link {
        padding-top: min(6.3vw, 1.69rem);

        picture img {
          width: min(52.8vw, 14.125rem);
          height: auto;
        }
      }

      .component-product-list--image-title {
        font-size: min(4.2vw, 1.125rem);
      }

    }
  }
}

@media screen and (min-width: 34.375rem /* 450px */) {
  .page-recipe-page {
    .page-recipe-page--banner {
      .page-recipe-page--titles {
        margin-top: -1rem;
      }
    }
  }
}

@media screen and (min-width: 39.063rem /* 450px */) {
  .page-recipe-page {
    .page-recipe-page--banner {
      .page-recipe-page--titles {
        margin-top: -1.5rem;
      }
    }
  }
}

@media screen and (min-width: 43.75rem /* 450px */) {
  .page-recipe-page {
    .page-recipe-page--banner {
      .page-recipe-page--titles {
        margin-top: -2rem;
      }
    }
  }
}

@media screen and (min-width: 48rem /* 768px */) {
  .page-recipe-page {
    .component-recipes-list {
      .component-recipes-list--image-link img {
        height: auto;
        max-height: none;
      }
    }
  }
}

@media screen and (max-width: 63.938rem) {
  .page-recipe-page {
    .page-recipe-page--banner::after {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      content: '';
      display: block;
      width: 100%;
      height: 15.56556rem;
      z-index: 1;

      background-color: var(--yellow);
      mask-image: url("../img/mobile-title-2-3aa82e9005aed89e73737b6a1d476b14.webp");
      mask-repeat: no-repeat;
      mask-size: 100% 100%;
    }

    .page-recipe-page--child-range .page-recipe-page--child-range-content .topic-title-text {
      display: none;
    }
  }
}

@media screen and (min-width: 64rem /* 1024px */) {
  .page-recipe-page {
    .page-recipe-page--banner .component-wrapper-picture--picture-image {
      width: 100%;
      height: 43.75rem;
      object-fit: cover;
      object-position: right;
    }

    .page-recipe-page--banner::after {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 16rem;
      content: '';
      mask-image: url("../img/range-title-desktop-aa997866028ff0077a1203f5546ec436.svg");
      mask-repeat: no-repeat;
      mask-size: cover;
      mask-position: right;
      pointer-events: none;
      background-color: var(--yellow);
      z-index: 1;
    }

    .page-recipe-page--titles {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      display: flex;
      justify-content: center;
      align-items: flex-start;
      flex-direction: column;
      padding: 0;
    }

    .page-recipe-page--titles .page-recipe-page--title {
      font-size: 3.5rem;
      line-height: 3.625rem;
      letter-spacing: -0.135rem;
      max-width: 49.5625rem;
    }

    .page-recipe-page--head-details {
      max-width: 65%;
      justify-content: left;
      gap: 1.88rem;
    }

    .page-recipe-page--content {
      padding: 6.31rem 0 4rem;
    }

    .page-recipe-page--content--details {
      display: flex;
      justify-content: space-between;
      gap: 2rem;
    }

    .page-recipe-page--ingredients {
      width: 36rem;
    }

    .page-recipe-page--steps {
      width: 35.8rem;
      margin-top: 0;
    }

    .page-recipe-page--ingredients-title {
      text-align: center;
      font-size: 2.375rem;
      font-weight: 500;
      letter-spacing: normal;
      font-family: var(--font-family-FiraSans-medium);
    }

    .page-recipe-page--recipe-data-people {
      margin-top: 2.06rem;
      gap: 1.5rem;
    }

    .page-recipe-page--recipe-data-people-lessPeople,
    .page-recipe-page--recipe-data-people-morePeople {
      width: 2.34375rem;
      height: 2.34375rem;

      font-family: var(--font-family-FiraSans--condensed-semiBold);
      font-size: 2rem;
      font-weight: 500;
      letter-spacing: normal;
    }

    .page-recipe-page--recipe-data-people-numberPeople {
      font-size: 1.5rem;
      letter-spacing: 0.045rem;
    }

    .page-recipe-page--recipe-data-people-text {
      font-size: 1.5rem;
      letter-spacing: 0.045rem;
      margin-left: 1rem;
    }

    .page-recipe-page--ingredient {
      padding: 0.5625rem 1.375rem;
      grid-template-columns: 7.5rem 1fr;
    }

    .page-recipe-page--quantity-wrapper,
    .page-recipe-page--ingredient-label {
      font-size: 1.3125rem;
      line-height: 1.625rem; /* 123.81% */
    }

    .page-recipe-page--recipe-steps-title h2 {
      text-align: center;
      font-size: 2.375rem;
      font-weight: 500;
      letter-spacing: normal;
      font-family: var(--font-family-FiraSans-medium);
    }

    .page-recipe-page--recipe-step p {
      font-size: 1.3125rem;
      line-height: 1.625rem; /* 123.81% */
    }

    .page-recipe-page--recipe-step::before {
      font-size: 1.5rem;
      letter-spacing: 0.045rem;
    }

    .page-recipe-page--steps--choosy {
      margin-top: 4.81rem;
      max-width: none;

      display: grid;
      grid-template-columns: minmax(0, 16.5rem) minmax(0, 17.8125rem);
      gap: 0.75rem;
    }

    .page-recipe-page--steps--choosy--image img {
      width: 16.5rem;
      height: auto;
      /*aspect-ratio: 264/109;*/
    }

    .page-recipe-page--steps--choosy--text span {
      font-size: 1.5rem;
      line-height: 1.9375rem; /* 129.167% */
      letter-spacing: normal;
    }

    .page-recipe-page--highlight {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      /* grid-template-columns: 12.87rem 1fr 2rem 1fr 12.87rem; */
    }

    .page-recipe-page--highlight--top-wave,
    .page-recipe-page--highlight--bottom-wave {
      grid-column: 1 / -1;
    }

		.page-recipe-page--related-product {
			grid-column: 1;
			width: 100%;
		}

		.page-recipe-page--related-product .content-width {
			width: calc(100% - 1.81rem);
			max-width: min(40vw, 47rem);
			margin: 0 0 0 auto;
			align-items: start;
		}

		.page-recipe-page--related-product--title {
			text-align: center;
			font-size: 2.375rem;
			font-weight: 500;
			letter-spacing: normal;
			font-family: var(--font-family-FiraSans-medium);
			width: 100%;
			max-width: 30rem;
		}

		.page-recipe-page--related-product--link {
			margin-top: 0;
			padding: 3.19rem 0 1.87rem;
			width: 100%;
			max-width: 30rem;
		}

    .pageRecipePageAlt--related-product--picture {
      margin: 0 auto;
      max-width: 20.125rem;
    }

    .pageRecipePageAlt--related-product--picture img {
      width: 100%;
      height: auto;
      aspect-ratio: 1/1;
      max-width: 20.125rem;
    }

    .pageRecipePageAlt--related-product--label {
      margin-top: 1.56rem;
      text-align: center;
      font-family: var(--font-family);
      font-size: 1.25rem;
      line-height: normal;
    }

		.page-recipe-page--rating-sharing {
			grid-column: 2;
			padding-top: 0;
			width: 100%;
		}

		.page-recipe-page--rating-sharing .content-width {
			width: calc(100% - 1.81rem);
			max-width: min(40vw, 47rem);
			margin: 0 auto 0 0;
			align-items: end;
		}

		.page-recipe-page--rating {
			gap: 3.19rem;
			width: 100%;
			max-width: 39.375rem;
		}

    .page-recipe-page--rating-title {
      text-align: center;
      font-size: 2.375rem;
      font-weight: 500;
      letter-spacing: normal;
      font-family: var(--font-family-FiraSans-medium);
    }

    .page-recipe-page--rating--stars {
      gap: 1.88rem;
    }

    .page-recipe-page--rating--star svg {
      width: 100%;
      max-width: 6.375rem;
      height: auto;
      max-width: none;
    }

		.page-recipe-page--sharer {
			margin-top: 8.13rem;
			gap: 1.69rem;
			width: 100%;
			max-width: 39.375rem;
		}

    .page-recipe-page--sharer-title {
      text-align: center;
      font-size: 2.375rem;
      font-weight: 500;
      letter-spacing: normal;
      font-family: var(--font-family-FiraSans-medium);
    }

    .component-recipes-list {
      .component-recipes-list--title {
        text-align: center;
        font-size: 2.375rem;
        font-weight: 500;
        letter-spacing: normal;
        font-family: var(--font-family-FiraSans-medium);
      }
    }

    .component-product-list__products-list {
      .component-product-list--title {
        text-align: center;
        font-size: 2.375rem;
        font-weight: 500;
        letter-spacing: normal;
        font-family: var(--font-family-FiraSans-medium);
      }
      
      .component-product-list--slider {
        height: auto;

        .component-product-list--image-link {
          padding-top: 0;

          picture img {
            width: auto;
            max-height: 24.0625rem;
          }
        }

        .component-product-list--image-title {
          font-size: min(1.39vw, 1.25rem);
          width: 100%;
          padding-inline: 2.94rem;
        }
      }
    }
  }
}

@media screen and (min-width: 80rem) {
  .page-recipe-page {
    .page-range-page--banner .component-wrapper-picture--picture-image {
      object-fit: contain;
    }

    .page-recipe-page--banner::after {
      right: 20rem;
    }
  }
}

@media screen and (min-width: 90rem) {
  .page-recipe-page {
    .page-recipe-page--titles .page-recipe-page--title {
      font-size: 4.5rem;
      line-height: 4.625rem;
    }
    .page-recipe-page--banner::after {
      right: 30rem;
    }

    .page-recipe-page--head-details {
      max-width: 100%;
    }

    .page-recipe-page--recipe-duration,
    .page-recipe-page--recipe-range,
    .page-recipe-page--recipe-rating {
      gap: 0.94rem;
    }

    .page-recipe-page--recipe-duration .recipe-detail--logo svg,
    .page-recipe-page--recipe-range .recipe-detail--logo svg,
    .page-recipe-page--recipe-rating .recipe-detail--logo svg {
      width: 2.5rem;
      height: 2.5rem;
    }

    .page-recipe-page--recipe-duration .recipe-detail--value,
    .page-recipe-page--recipe-range .recipe-detail--value,
    .page-recipe-page--recipe-rating .recipe-detail--value {
      font-size: 2rem;
    }
  }
}

@media screen and (min-width: 120rem) {
  .page-recipe-page {
    .page-recipe-page--banner::after {
      right: 37rem;
    }
  }
}