.rh--benefits .rh__media {
  right: calc(4 * var(--u));
  width: calc(1218.1 * var(--u));
  height: calc(610.4 * var(--u));
}

.rh--benefits .rh__content {
  padding-left: calc(71.1 * var(--u));
}

.rh--benefits .rh__title {
  margin-top: calc(12.675 * var(--u));
  line-height: calc(55.45 * var(--u));
}

.rh--benefits .rh__lead {
  margin-top: calc(7.275 * var(--u));
  line-height: calc(32.25 * var(--u));
}

.benefits--page {
  height: calc(367.2 * var(--u));
  padding: calc(38.2 * var(--u)) 0 0 calc(var(--gutter) - 1.7 * var(--u));
}

.benefits--page .benefits__title {
  margin-top: 0;
}

.benefits--page .benefits__text {
  margin-top: calc(45.6 * var(--u));
}

.benefits--page .benefits__cards {
  top: calc(41.2 * var(--u));
  right: calc(61 * var(--u));
}

.bl {
  position: relative;
  isolation: isolate;
  overflow: clip;
}

.bl__pattern {
  position: absolute;
  z-index: -1;
  top: calc(137.4 * var(--u));
  right: calc(4.1 * var(--u));
  width: calc(938.6 * var(--u));
  height: calc(1010.2 * var(--u));
  pointer-events: none;
}

[data-page="benefits"] .calc {
  padding-left: calc(var(--gutter) - 1.7 * var(--u));
}

[data-page="benefits"] .calc__pattern {
  display: none;
}

[data-page="benefits"] .calc__result {
  right: calc(58.4 * var(--u));
}

[data-page="benefits"] .calc__years {
  margin-left: calc(47.4 * var(--u));
}

.bx {
  --origin: 1382.5;
  position: relative;
  container-type: inline-size;
  height: calc(587.6 * var(--u));
}

.bx__list {
  margin: 0;
}

.bx__el {
  position: absolute;
  z-index: 1;
  left: calc(var(--x) * var(--u) + var(--k, 0) * max(0px, 100cqw - 1440 * var(--u)));
  top: calc((var(--y) - var(--origin) - var(--dy, 0)) * var(--u));
  margin: 0;
  font-weight: 600;
  white-space: nowrap;
}

.bx__el--center {
  text-align: center;
  transform: translateX(-50%);
}

.bx__el--c2  { --k: 0.3333; }
.bx__el--mid { --k: 0.5; }
.bx__el--c3  { --k: 0.6667; }
.bx__el--c4  { --k: 1; }

.bx__title {
  --dy: 3;
  font-size: calc(29.5 * var(--u));
  line-height: 1;
  letter-spacing: 0;
}

.bx__lead {
  --dy: 1;
  font-size: calc(17.9 * var(--u));
  line-height: 1;
  color: #808080;
}

.bx__icon {
  width: calc(79.4 * var(--u));
  height: calc(79.4 * var(--u));
  border-radius: 50%;
  background: var(--c-blue);
}

.bx__name {
  --dy: 1;
  font-size: calc(18.9 * var(--u));
  line-height: 1;
  letter-spacing: 0;
}

.bx__text {
  --dy: 4.05;
  font-size: calc(17.9 * var(--u));
  line-height: calc(22 * var(--u));
  color: #808080;
}

.bx__cta {
  --origin: 1712.2;
  position: absolute;
  top: calc(329.7 * var(--u));
  left: 0;
  right: 0;
  height: calc(207.4 * var(--u));
  overflow: hidden;
}

.bx__banner {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bx__cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--c-banner-overlay);
}

.bx__cta-title {
  --dy: 8.25;
  font-size: calc(41.5 * var(--u));
  line-height: calc(50 * var(--u));
  letter-spacing: 0;
  color: var(--c-white);
}

.bx__cta-text {
  --dy: 2.55;
  font-size: calc(17.9 * var(--u));
  line-height: calc(21 * var(--u));
  color: var(--c-white);
}

.bx__cta-btn {
  justify-content: flex-start;
  width: calc(228.6 * var(--u));
  min-height: 0;
  height: calc(54 * var(--u));
  padding: 0 0 0 calc(40.4 * var(--u));
  font-size: calc(17.7 * var(--u));
}

@media (max-width: 900px) {
  .rh--benefits .rh__media {
    right: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 1218.1 / 610.4;
    -webkit-mask: linear-gradient(to bottom, transparent 0%, #000 25%);
    mask: linear-gradient(to bottom, transparent 0%, #000 25%);
  }

  .rh--benefits .rh__content {
    padding-left: var(--gutter);
  }

  .rh--benefits .rh__title,
  .rh--benefits .rh__lead {
    margin-top: var(--sp-4);
    line-height: 1.25;
  }

  .rh--benefits .rh__lead {
    line-height: 1.6;
  }

  .benefits--page {
    height: auto;
    padding: var(--sp-8) var(--gutter) var(--section-y);
  }

  .benefits--page .benefits__text {
    margin-top: var(--sp-4);
  }

  .bl__pattern {
    display: none;
  }

  [data-page="benefits"] .calc {
    padding-left: var(--gutter);
  }

  [data-page="benefits"] .calc__result {
    right: auto;
  }

  [data-page="benefits"] .calc__years {
    margin-left: 0;
  }

  .bx {
    display: flex;
    flex-direction: column;
    height: auto;
    padding: 0 var(--gutter) var(--section-y);
  }

  .bx__el {
    position: static;
    left: auto;
    top: auto;
    white-space: normal;
    transform: none;
  }

  .bx__title {
    font-size: 24px;
    line-height: 1.25;
  }

  .bx__lead {
    margin-top: var(--sp-3);
    font-size: 15px;
    line-height: 1.5;
  }

  .bx__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-6) var(--sp-4);
    margin-top: var(--sp-6);
  }

  .bx__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .bx__icon {
    width: 64px;
    height: 64px;
  }

  .bx__name {
    margin-top: var(--sp-3);
    font-size: 16px;
    line-height: 1.3;
  }

  .bx__text {
    margin-top: var(--sp-2);
    font-size: 14px;
    line-height: 1.5;
  }

  .bx__cta {
    position: relative;
    top: auto;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-4);
    margin: var(--sp-8) calc(-1 * var(--gutter)) 0;
    padding: var(--sp-7) var(--gutter);
  }

  .bx__cta-title,
  .bx__cta-text {
    position: relative;
  }

  .bx__cta-title {
    font-size: 28px;
    line-height: 1.2;
  }

  .bx__cta-text {
    font-size: 15px;
    line-height: 1.5;
    text-align: left;
  }

  .bx__cta-btn {
    position: relative;
    width: auto;
    height: 48px;
    padding: 0 var(--sp-6);
    font-size: 15px;
  }
}
