.review-promo {
  position: relative;
  width: 100%;
  aspect-ratio: 1672 / 940;
  overflow: hidden;
  background: #f6f3ed;
  color: #122229;
}

.review-promo__link {
  position: absolute;
  inset: 0;
  display: block;
  color: inherit;
  text-decoration: none;
}

.review-promo__link:hover,
.review-promo__link:focus-visible {
  color: inherit;
}

.review-promo__link:focus-visible {
  outline: 4px solid #486b57;
  outline-offset: -4px;
}

.review-promo__photo {
  position: absolute;
  inset-block: 0;
  width: 34%;
  background-image: url('./img/review-jpilates-desktop.png');
  background-repeat: no-repeat;
  background-size: 100vw 100%;
}

.review-promo__photo--left {
  left: 0;
  background-position: left center;
}

.review-promo__photo--right {
  right: 0;
  background-position: right center;
}

.review-promo__shape {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  fill: #f9f7f3;
}

.review-promo__shape--mobile {
  display: none;
}

.review-promo__arc {
  position: absolute;
  width: 58%;
  aspect-ratio: 1;
  border: 1px solid rgba(135, 151, 118, .55);
  border-radius: 50%;
  pointer-events: none;
}

.review-promo__arc--one {
  top: -83%;
  left: 20%;
}

.review-promo__arc--two {
  right: -13%;
  bottom: -84%;
  border-color: rgba(196, 142, 106, .65);
}

.review-promo__content {
  position: absolute;
  inset: 0;
  text-align: center;
}

.review-promo__brands {
  position: absolute;
  top: 8%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.4vw;
  width: 48%;
  height: 11%;
  transform: translateX(-50%);
}

.review-promo__review-logo {
  display: block;
  flex: 0 0 41%;
  height: 100%;
  background-color: #f9f7f3;
  background-image: url('./img/review-logo-source.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 118% auto;
  background-blend-mode: multiply;
}

.review-promo__times {
  flex: 0 0 auto;
  color: #132229;
  font: 200 clamp(35px, 4.2vw, 70px) / 1 Georgia, serif;
}

.review-promo__pilates-logo {
  display: flex;
  flex: 0 0 36%;
  flex-direction: column;
  align-items: center;
  gap: .5vw;
  color: #0b1d21;
  font: 300 clamp(27px, 3.3vw, 56px) / 1 Georgia, serif;
  letter-spacing: .11em;
  white-space: nowrap;
}

.review-promo__pilates-logo small {
  font: 600 clamp(6px, .58vw, 10px) / 1.3 Arial, sans-serif;
  letter-spacing: .47em;
}

.review-promo__title {
  position: absolute;
  top: 22%;
  left: 50%;
  width: 55%;
  margin: 0;
  transform: translateX(-50%);
  color: #081e20;
  font: 400 clamp(30px, 3.8vw, 68px) / .99 Georgia, 'Times New Roman', serif;
  letter-spacing: -.045em;
}

.review-promo__title span {
  display: inline-block;
  color: #829275;
  font-family: Georgia, serif;
  font-size: 1.25em;
  font-style: italic;
  font-weight: 400;
  line-height: .7;
  transform: rotate(-12deg) translateY(.08em);
}

.review-promo__benefits {
  position: absolute;
  top: 46%;
  left: 50%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.2vw;
  width: 42%;
  transform: translateX(-50%);
  text-align: left;
}

.review-promo__benefit {
  display: flex;
  align-items: flex-start;
  gap: 1.3vw;
  min-width: 0;
}

.review-promo__benefit + .review-promo__benefit {
  border-left: 1px solid rgba(130, 127, 119, .48);
  padding-left: 2vw;
}

.review-promo__icon {
  display: grid;
  flex: 0 0 8vw;
  width: 8vw;
  aspect-ratio: 1;
  place-items: center;
  border-radius: 50%;
}

.review-promo__icon svg {
  width: 67%;
  height: 67%;
}

.review-promo__icon--eye {
  background: #a8b996;
  color: #0b2526;
}

.review-promo__icon--body {
  background: #d4a89b;
  color: #fff;
}

.review-promo__benefit-copy {
  display: flex;
  flex-direction: column;
  gap: .8vw;
  color: #263950;
  font: 400 clamp(11px, 1.15vw, 20px) / 1.22 Arial, sans-serif;
}

.review-promo__benefit-copy strong {
  font-size: 1.12em;
  font-weight: 500;
  letter-spacing: .04em;
}

.review-promo__offer {
  position: absolute;
  top: 70%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6vw;
  width: 41%;
  height: 17%;
  border-radius: 100vw;
  transform: translateX(-50%);
  background: linear-gradient(110deg, #9cab83, #6c866e);
  color: #fff;
}

.review-promo__gift {
  display: grid;
  flex: 0 0 6vw;
  width: 6vw;
  aspect-ratio: 1;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: #0b2426;
}

.review-promo__gift svg {
  width: 55%;
  height: 55%;
}

.review-promo__offer-main {
  font: 400 clamp(58px, 7.8vw, 135px) / .85 Georgia, serif;
  letter-spacing: -.075em;
  white-space: nowrap;
}

.review-promo__offer-main span {
  font-size: .64em;
}

.review-promo__offer-copy {
  text-align: left;
  font: 400 clamp(11px, 1.18vw, 21px) / 1.18 Arial, sans-serif;
  letter-spacing: .03em;
}

.review-promo__note {
  position: absolute;
  top: 89%;
  left: 50%;
  width: 45%;
  margin: 0;
  transform: translateX(-50%);
  font: 400 clamp(13px, 1.4vw, 24px) / 1.18 Arial, sans-serif;
}

@media (max-width: 767px) {
  .review-promo {
    aspect-ratio: 940 / 1672;
  }

  .review-promo__photo {
    width: 37%;
    background-image: url('./img/review-jpilates-mobile.png');
  }

  .review-promo__shape--desktop {
    display: none;
  }

  .review-promo__shape--mobile {
    display: block;
  }

  .review-promo__arc--one {
    top: -16%;
    left: -28%;
    width: 160%;
  }

  .review-promo__arc--two {
    right: -60%;
    bottom: -20%;
    width: 170%;
  }

  .review-promo__brands {
    top: 7.5%;
    gap: 2vw;
    width: 73%;
    height: 8%;
  }

  .review-promo__review-logo {
    flex-basis: 46%;
  }

  .review-promo__times {
    font-size: 7vw;
  }

  .review-promo__pilates-logo {
    flex-basis: 37%;
    gap: 1vw;
    font-size: 5.3vw;
  }

  .review-promo__pilates-logo small {
    font-size: 1.15vw;
    letter-spacing: .29em;
  }

  .review-promo__title {
    top: 19%;
    width: 82%;
    font-size: 7.2vw;
    line-height: 1.05;
  }

  .review-promo__benefits {
    top: 46%;
    width: 61%;
    gap: 2vw;
  }

  .review-promo__benefit {
    flex-direction: column;
    align-items: center;
    gap: 2vw;
    text-align: center;
  }

  .review-promo__benefit + .review-promo__benefit {
    padding-left: 2vw;
  }

  .review-promo__icon {
    flex-basis: auto;
    width: 14vw;
  }

  .review-promo__benefit-copy {
    gap: 2vw;
    font-size: clamp(9px, 2.35vw, 17px);
    line-height: 1.2;
  }

  .review-promo__offer {
    top: 70%;
    gap: 2vw;
    width: 59%;
    height: 14%;
  }

  .review-promo__gift {
    flex-basis: 11vw;
    width: 11vw;
  }

  .review-promo__offer-main {
    font-size: 14vw;
  }

  .review-promo__offer-copy {
    font-size: clamp(8px, 2.2vw, 16px);
  }

  .review-promo__note {
    top: 85.5%;
    width: 70%;
    font-size: clamp(11px, 2.7vw, 20px);
  }
}