.raft-h2o-benefits-figma {
  background:
    radial-gradient(ellipse 155% 118% at 103.113% 122%, rgba(246, 213, 134, .34) 0%, rgba(240, 82, 82, .22) 26%, rgba(240, 82, 82, .08) 53%, rgba(240, 82, 82, 0) 76%),
    linear-gradient(180deg, #fff 0%, #fff 34%, #fffafa 55%, #fbe6e8 78%, #f5cbd0 100%),
    #fff;
  color: #000026;
  font-family: "Neue Einstellung", "NeueEinstellung", "Avenir Next", Avenir, Arial, sans-serif;
  height: min(60.46875vw, 1161px);
  overflow: hidden;
  position: relative;
}

.raft-h2o-benefits-figma *,
.raft-h2o-benefits-figma *::before,
.raft-h2o-benefits-figma *::after {
  box-sizing: border-box;
}

.raft-h2o-benefits-figma__stage {
  height: min(51.40625vw, 987px);
  margin: 0 auto;
  position: relative;
  top: min(6.263097vw, 120.251px);
  width: min(80vw, 1536px);
}

.raft-h2o-benefits-figma__header {
  height: min(14.895833vw, 286px);
  left: 0;
  margin: 0;
  position: absolute;
  top: 0;
  width: min(27.552083vw, 529px);
  z-index: 2;
}

.raft-h2o-benefits-figma__kicker {
  color: #4f0657;
  font-size: min(.729167vw, 14px);
  font-weight: 700;
  height: min(1.145833vw, 22px);
  letter-spacing: min(.051042vw, .98px);
  line-height: 1.6;
  margin: 0;
  text-transform: uppercase;
}

.raft-h2o-benefits-figma__header h2 {
  color: #000026;
  font-size: min(2.916667vw, 56px);
  font-weight: 700;
  letter-spacing: max(-.104167vw, -2px);
  line-height: 1.25;
  margin: min(.416667vw, 8px) 0 min(1.041667vw, 20px);
  width: min(23.958333vw, 460px);
}

.raft-h2o-benefits-figma__intro {
  color: #000026;
  font-size: min(.9375vw, 18px);
  font-weight: 400;
  line-height: 1.6;
  margin: 0;
  width: min(27.552083vw, 529px);
}

.raft-h2o-benefits-figma__orbit {
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.raft-h2o-benefits-figma__benefit {
  align-items: flex-start;
  display: flex;
  gap: min(1.041667vw, 20px);
  margin: 0;
  padding: min(.9375vw, 18px) min(.416667vw, 8px);
  pointer-events: auto;
  position: absolute;
}

.raft-h2o-benefits-figma__benefit--nutrients {
  height: min(13.385417vw, 257px);
  left: min(40.677083vw, 781px);
  top: min(.416667vw, 8px);
  width: min(26.197917vw, 503px);
}

.raft-h2o-benefits-figma__benefit--removal {
  height: min(16.875vw, 324px);
  left: min(4.0625vw, 78px);
  top: min(16.458333vw, 316px);
  width: min(24.375vw, 468px);
}

.raft-h2o-benefits-figma__benefit--circular {
  height: min(15.364583vw, 295px);
  left: min(53.072917vw, 1019px);
  top: min(16.041667vw, 308px);
  width: min(24.427083vw, 469px);
}

.raft-h2o-benefits-figma__benefit--compliance {
  height: min(16.875vw, 324px);
  left: min(8.4375vw, 162px);
  top: min(34.84375vw, 669px);
  width: min(24.375vw, 468px);
}

.raft-h2o-benefits-figma__benefit--cost {
  height: min(16.875vw, 324px);
  left: min(41.5625vw, 798px);
  top: min(34.166667vw, 656px);
  width: min(24.427083vw, 469px);
}

.raft-h2o-benefits-figma__media {
  border: 1px solid rgba(79, 6, 87, .25);
  border-radius: 999px;
  flex: 0 0 min(7.8125vw, 150px);
  height: min(7.8125vw, 150px);
  overflow: hidden;
  padding: min(.416667vw, 8px);
  width: min(7.8125vw, 150px);
}

.raft-h2o-benefits-figma__media img,
.raft-h2o-benefits-figma__center-image img {
  border-radius: 50%;
  display: block;
  height: 100%;
  max-width: none;
  object-fit: cover;
  width: 100%;
}

.raft-h2o-benefits-figma__benefit-copy {
  flex: 0 0 auto;
  min-width: 0;
}

.raft-h2o-benefits-figma__benefit--nutrients .raft-h2o-benefits-figma__benefit-copy {
  width: min(16.510417vw, 317px);
}

.raft-h2o-benefits-figma__benefit--removal .raft-h2o-benefits-figma__benefit-copy,
.raft-h2o-benefits-figma__benefit--compliance .raft-h2o-benefits-figma__benefit-copy {
  width: min(14.6875vw, 282px);
}

.raft-h2o-benefits-figma__benefit--circular .raft-h2o-benefits-figma__benefit-copy {
  width: min(14.739583vw, 283px);
}

.raft-h2o-benefits-figma__benefit--cost .raft-h2o-benefits-figma__benefit-copy {
  width: min(14.375vw, 276px);
}

.raft-h2o-benefits-figma__glyph {
  display: block;
  height: min(2.239583vw, 43px);
  max-width: none;
  width: min(2.239583vw, 43px);
}

.raft-h2o-benefits-figma__benefit h3 {
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(90deg, #4f0657 0%, #4f0657 46%, #f05252 76%, #f6d586 100%);
  background-clip: text;
  color: #4f0657;
  font-size: min(1.25vw, 24px);
  font-weight: 700;
  line-height: 1.6;
  margin: min(.625vw, 12px) 0;
}

.raft-h2o-benefits-figma__benefit p {
  color: #000026;
  font-size: min(.833333vw, 16px);
  font-weight: 400;
  line-height: 1.6;
  margin: 0;
}

.raft-h2o-benefits-figma__center {
  border: 1px solid rgba(79, 6, 87, .25);
  border-radius: 50%;
  height: min(17.239583vw, 331px);
  left: min(31.614583vw, 607px);
  padding: min(.416667vw, 8px);
  position: absolute;
  top: min(14.375vw, 276px);
  width: min(17.239583vw, 331px);
  z-index: 1;
}

.raft-h2o-benefits-figma__center-image {
  border-radius: 50%;
  height: 100%;
  overflow: hidden;
  width: 100%;
}

.raft-h2o-benefits-figma__badge {
  align-items: center;
  background:
    radial-gradient(ellipse 88% 94% at 44.677% 75.477%, #f6d586 10%, #f05252 40%, #4f0657 55.8176%, rgba(240, 82, 82, 0) 100%) padding-box,
    linear-gradient(223deg, #f6d586 0%, #f05252 100%) border-box,
    #000026;
  border: min(.260417vw, 5px) solid transparent;
  border-radius: 50%;
  bottom: -1px;
  color: #fff;
  display: flex;
  flex-direction: column;
  font-size: min(1.041667vw, 20px);
  font-weight: 700;
  height: min(6.458333vw, 124px);
  justify-content: center;
  line-height: 1.3;
  position: absolute;
  right: -1px;
  text-align: center;
  width: min(6.458333vw, 124px);
  z-index: 2;
}

.raft-h2o-benefits-figma__badge span {
  display: block;
}

@media (max-width: 1100px) {
  .raft-h2o-benefits-figma {
    height: auto;
    min-height: 0;
    padding: 64px 0 72px;
  }

  .raft-h2o-benefits-figma__stage {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: auto;
    top: 0;
    width: min(88%, 760px);
  }

  .raft-h2o-benefits-figma__header,
  .raft-h2o-benefits-figma__center,
  .raft-h2o-benefits-figma__orbit,
  .raft-h2o-benefits-figma__benefit {
    height: auto;
    inset: auto;
    position: relative;
    width: auto;
  }

  .raft-h2o-benefits-figma__header,
  .raft-h2o-benefits-figma__center {
    grid-column: 1 / -1;
  }

  .raft-h2o-benefits-figma__header h2,
  .raft-h2o-benefits-figma__intro {
    width: auto;
  }

  .raft-h2o-benefits-figma__kicker {
    font-size: 12px;
    height: auto;
    letter-spacing: .84px;
  }

  .raft-h2o-benefits-figma__header h2 {
    font-size: clamp(38px, 7vw, 50px);
    letter-spacing: -1.5px;
    margin: 8px 0 16px;
  }

  .raft-h2o-benefits-figma__intro {
    font-size: 17px;
  }

  .raft-h2o-benefits-figma__center {
    height: 290px;
    justify-self: center;
    padding: 8px;
    width: 290px;
  }

  .raft-h2o-benefits-figma__badge {
    border-width: 5px;
    bottom: -1px;
    font-size: 17px;
    height: 108px;
    right: -1px;
    width: 108px;
  }

  .raft-h2o-benefits-figma__orbit {
    display: contents;
  }

  .raft-h2o-benefits-figma__benefit {
    align-items: center;
    flex-direction: column;
    gap: 18px;
    padding: 20px 0;
    text-align: center;
  }

  .raft-h2o-benefits-figma__media {
    flex-basis: 136px;
    height: 136px;
    padding: 8px;
    width: 136px;
  }

  .raft-h2o-benefits-figma__benefit-copy,
  .raft-h2o-benefits-figma__benefit--nutrients .raft-h2o-benefits-figma__benefit-copy,
  .raft-h2o-benefits-figma__benefit--removal .raft-h2o-benefits-figma__benefit-copy,
  .raft-h2o-benefits-figma__benefit--circular .raft-h2o-benefits-figma__benefit-copy,
  .raft-h2o-benefits-figma__benefit--compliance .raft-h2o-benefits-figma__benefit-copy,
  .raft-h2o-benefits-figma__benefit--cost .raft-h2o-benefits-figma__benefit-copy {
    width: auto;
  }

  .raft-h2o-benefits-figma__glyph {
    height: 38px;
    margin: 0 auto;
    width: 38px;
  }

  .raft-h2o-benefits-figma__benefit h3 {
    font-size: 21px;
    margin: 10px 0;
  }

  .raft-h2o-benefits-figma__benefit p {
    font-size: 15px;
  }
}

@media (max-width: 620px) {
  .raft-h2o-benefits-figma__stage {
    grid-template-columns: 1fr;
  }

  .raft-h2o-benefits-figma__header,
  .raft-h2o-benefits-figma__center {
    grid-column: auto;
  }
}