.benefits {
  padding-top: 70px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefits {
    padding-top: 50px;
  }
}
@media (max-width: 767px) {
  .benefits {
    padding-top: 1px;
    margin-top: 10px;
  }
}
.benefits__step {
  display: flex;
  align-items: center;
  gap: 30px;
  min-height: 836px;
  margin-top: 78px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefits__step {
    min-height: 526px;
    margin-top: 0;
  }
}
@media (max-width: 767px) {
  .benefits__step {
    gap: 18px;
    min-height: auto;
    flex-direction: column;
    margin-top: 98px;
  }
}
.benefits__article {
  width: 53%;
}
@media (max-width: 767px) {
  .benefits__article {
    width: 100%;
  }
}
.benefits__image {
  position: relative;
  z-index: 1;
  width: 47%;
}
@media (max-width: 767px) {
  .benefits__image {
    width: 100%;
    min-height: 504px;
  }
  .benefits__step--02 .benefits__image, .benefits__step--04 .benefits__image {
    order: -1;
  }
}
.benefits__phone {
  width: 800px;
  height: 836px;
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform: translate(-50%, 50%);
}
.benefits__step--01 .benefits__phone::after, .benefits__step--02 .benefits__phone::after, .benefits__step--03 .benefits__phone::after {
  content: "";
  width: 282px;
  height: 174px;
  position: absolute;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='282' height='174' viewBox='0 0 282 174' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m260.178 146.805.139.072 19.925 11.382c1.306.746 1.34 2.592.118 3.4l-.141.086-20.074 11.118a2 2 0 0 1-2.072-3.418l.134-.081 13.393-7.419-2.506-.016a2 2 0 1 1 .026-4l2.507.016-13.294-7.595a2 2 0 0 1-.817-2.59l.072-.138a2 2 0 0 1 2.59-.817zm-15.134 10.639h.15c3.283.133 6.604.242 9.964.327a2 2 0 1 1-.102 4c-3.38-.087-6.72-.196-10.024-.33a2 2 0 0 1-.135-3.987l.147-.01zm-23.881-1.446.15.007c3.27.266 6.582.505 9.937.718a2 2 0 0 1-.253 3.992 563.257 563.257 0 0 1-10.01-.723 2 2 0 0 1 .029-3.99l.147-.004zm-23.602-2.49c3.248.424 6.544.818 9.888 1.182a2 2 0 1 1-.433 3.977 469.739 469.739 0 0 1-9.972-1.192 2 2 0 0 1 .517-3.967zm-23.588-3.766a381.47 381.47 0 0 0 9.797 1.739 2 2 0 0 1-.648 3.947 385.468 385.468 0 0 1-9.9-1.757 2 2 0 1 1 .751-3.93zm-23.267-5.302c3.149.844 6.36 1.648 9.636 2.414a2 2 0 0 1-.91 3.895 311.176 311.176 0 0 1-9.762-2.446 2 2 0 0 1 1.036-3.863zM128 137.27a243.684 243.684 0 0 0 9.378 3.24 2 2 0 0 1-1.23 3.806 247.68 247.68 0 0 1-9.532-3.293 2 2 0 0 1 1.384-3.753zm-21.807-9.45a191.753 191.753 0 0 0 8.945 4.242 2 2 0 1 1-1.623 3.657 195.751 195.751 0 0 1-9.13-4.332 2 2 0 1 1 1.808-3.568zm-20.368-12.157c2.712 1.888 5.47 3.691 8.272 5.408a2 2 0 1 1-2.09 3.411 173.228 173.228 0 0 1-8.468-5.536 2 2 0 0 1 2.286-3.283zm-18.473-14.817a180.88 180.88 0 0 0 7.468 6.484 2 2 0 1 1-2.539 3.092 184.879 184.879 0 0 1-7.633-6.628 2 2 0 1 1 2.704-2.948zM50.863 83.72a202.515 202.515 0 0 0 6.612 7.374 2 2 0 1 1-2.91 2.743 206.515 206.515 0 0 1-6.744-7.519 2 2 0 0 1 3.042-2.598zM36.416 64.805a233.752 233.752 0 0 0 5.773 8.064 2 2 0 0 1-3.202 2.397 237.752 237.752 0 0 1-5.872-8.201 2 2 0 0 1 3.3-2.26zM23.9 44.555a274.104 274.104 0 0 0 4.994 8.58 2 2 0 1 1-3.42 2.076 278.103 278.103 0 0 1-5.067-8.706 2 2 0 1 1 3.493-1.95zM13.116 23.29a323.16 323.16 0 0 0 4.293 8.96 2 2 0 0 1-3.58 1.784 327.159 327.159 0 0 1-4.346-9.07 2 2 0 1 1 3.633-1.674zM3.868 1.285c1.2 3.13 2.425 6.212 3.678 9.242a2 2 0 0 1-3.697 1.528 384.438 384.438 0 0 1-3.717-9.34 2 2 0 1 1 3.736-1.43z' fill='%2360AEFF' fill-rule='nonzero'/%3E%3C/svg%3E%0A");
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefits__step--01 .benefits__phone::after, .benefits__step--02 .benefits__phone::after, .benefits__step--03 .benefits__phone::after {
    width: 185px;
    height: 117px;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='185' height='117' viewBox='0 0 185 117' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m167.706 95.482.13.066 15.912 9.153a1.5 1.5 0 0 1 .098 2.54l-.123.075-16.086 8.846a1.5 1.5 0 0 1-1.569-2.554l.123-.075 11.067-6.087-4.86-.046a1.5 1.5 0 1 1 .03-3l4.86.046-10.949-6.298a1.5 1.5 0 0 1-.618-1.92l.066-.128a1.5 1.5 0 0 1 1.92-.618zM154.4 103.84l.145.001c2.615.147 5.269.269 7.962.366a1.5 1.5 0 0 1-.11 2.998 407.056 407.056 0 0 1-8.02-.369 1.5 1.5 0 0 1-.118-2.984l.141-.012zm-17.885-1.455.145.008c2.598.28 5.241.532 7.928.756a1.5 1.5 0 0 1-.25 2.99c-2.71-.226-5.377-.48-8-.763a1.5 1.5 0 0 1 .035-2.986l.142-.005zm-17.6-2.455c2.569.443 5.188.854 7.859 1.233a1.5 1.5 0 1 1-.422 2.97c-2.7-.382-5.349-.798-7.947-1.247a1.5 1.5 0 1 1 .51-2.956zm-17.471-3.714c2.517.646 5.094 1.255 7.731 1.825a1.5 1.5 0 1 1-.634 2.933 210.946 210.946 0 0 1-7.843-1.852 1.5 1.5 0 0 1 .746-2.906zm-17.06-5.296c2.427.9 4.926 1.757 7.496 2.568a1.5 1.5 0 0 1-.903 2.86 162.807 162.807 0 0 1-7.637-2.616 1.5 1.5 0 0 1 1.044-2.812zm-16.24-7.258a121.658 121.658 0 0 0 7.089 3.496 1.5 1.5 0 1 1-1.241 2.731 124.656 124.656 0 0 1-7.263-3.582 1.5 1.5 0 1 1 1.415-2.645zM53.26 74.088a111.377 111.377 0 0 0 6.442 4.562 1.5 1.5 0 1 1-1.645 2.509 114.377 114.377 0 0 1-6.616-4.685 1.5 1.5 0 0 1 1.819-2.386zm-13.293-11.84a122.956 122.956 0 0 0 5.678 5.497 1.5 1.5 0 1 1-2.015 2.222 125.956 125.956 0 0 1-5.818-5.632 1.5 1.5 0 0 1 2.155-2.088zM28.454 48.655a143.015 143.015 0 0 0 4.896 6.222 1.5 1.5 0 1 1-2.305 1.92 146.014 146.014 0 0 1-4.998-6.353 1.5 1.5 0 1 1 2.407-1.79zm-9.808-14.883a171.122 171.122 0 0 0 4.16 6.751 1.5 1.5 0 1 1-2.515 1.634 174.121 174.121 0 0 1-4.234-6.87 1.5 1.5 0 0 1 2.589-1.515zM10.358 17.95a206.858 206.858 0 0 0 3.506 7.125 1.5 1.5 0 0 1-2.666 1.376 209.857 209.857 0 0 1-3.556-7.228 1.5 1.5 0 0 1 2.716-1.273zM3.402 1.468A249.755 249.755 0 0 0 6.34 8.856a1.5 1.5 0 1 1-2.77 1.153A252.755 252.755 0 0 1 .598 2.532a1.5 1.5 0 1 1 2.804-1.064z' fill='%2360AEFF' fill-rule='nonzero'/%3E%3C/svg%3E%0A");
  }
}
@media (max-width: 767px) {
  .benefits__step--01 .benefits__phone::after, .benefits__step--02 .benefits__phone::after, .benefits__step--03 .benefits__phone::after {
    content: none;
  }
}
.benefits__step--01 .benefits__phone {
  background-image: url("/img/landing/phone-effects-step1.png");
}
.landing-page_ios .benefits__step--01 .benefits__phone {
  background-image: url("/img/landing/iphone-effects-step1.png");
}
.benefits__step--01 .benefits__phone::after {
  bottom: -194px;
  left: 50%;
}
.benefits__step--02 .benefits__phone {
  background-image: url("/img/landing/phone-effects-step2.png");
}
.landing-page_ios .benefits__step--02 .benefits__phone {
  background-image: url("/img/landing/iphone-effects-step2.png");
}
.benefits__step--02 .benefits__phone::after {
  bottom: -194px;
  right: 50%;
  transform: scale(-1, 1);
}
.benefits__step--03 .benefits__phone {
  background-image: url("/img/landing/phone-effects-step3.png");
}
.landing-page_ios .benefits__step--03 .benefits__phone {
  background-image: url("/img/landing/iphone-effects-step3.png");
}
.benefits__step--03 .benefits__phone::after {
  bottom: -194px;
  left: 50%;
}
.benefits__step--04 .benefits__phone {
  background-image: url("/img/landing/phone-effects-step4.png");
}
.landing-page_ios .benefits__step--04 .benefits__phone {
  background-image: url("/img/landing/iphone-effects-step4.png");
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefits__phone {
    width: 502px;
    height: 526px;
  }
  .benefits__step--01 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step1-1.png");
  }
  .landing-page_ios .benefits__step--01 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step1-1.png");
  }
  .benefits__step--01 .benefits__phone:after {
    bottom: -84px;
  }
  .benefits__step--02 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step2-1.png");
  }
  .landing-page_ios .benefits__step--02 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step2-1.png");
  }
  .benefits__step--02 .benefits__phone:after {
    bottom: -84px;
  }
  .benefits__step--03 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step3-1.png");
  }
  .landing-page_ios .benefits__step--03 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step3-2.png");
  }
  .benefits__step--03 .benefits__phone:after {
    bottom: -84px;
  }
  .benefits__step--04 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step4-1.png");
  }
  .landing-page_ios .benefits__step--04 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step4-1.png");
  }
}
@media (max-width: 767px) {
  .benefits__phone {
    width: 480px;
    height: 504px;
  }
  .benefits__step--01 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step1-2.png");
  }
  .landing-page_ios .benefits__step--01 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step1-2.png");
  }
  .benefits__step--02 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step2-2.png");
  }
  .landing-page_ios .benefits__step--02 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step2-2.png");
  }
  .benefits__step--03 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step3-2.png");
  }
  .landing-page_ios .benefits__step--03 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step3-2.png");
  }
  .benefits__step--04 .benefits__phone {
    background-image: url("/img/landing/phone-effects-step4-2.png");
  }
  .landing-page_ios .benefits__step--04 .benefits__phone {
    background-image: url("/img/landing/iphone-effects-step4-2.png");
  }
}

.benefit-card {
  position: relative;
  border-radius: 10px;
  display: inline-flex;
}
@media (max-width: 767px) {
  .benefit-card {
    width: 100%;
  }
}
.benefit-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 10px;
  padding: 2px;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.benefit-card--01::before {
  background: radial-gradient(circle at 100% 100%, #ff959f, #ff4b4b 14%, #ecb002 27%, rgba(221, 255, 0, 0.7) 46%, rgba(1, 226, 112, 0) 67%, rgba(0, 184, 239, 0) 99%);
}
.landing-page_ios .benefit-card--01::before {
  background: radial-gradient(circle at 100% 100%, #00c405, #209f94 27%, #06a1f3 46%, rgba(183, 57, 192, 0) 67%, rgba(237, 3, 74, 0) 99%);
}
.benefit-card--02::before {
  background: radial-gradient(circle at 100% 100%, rgba(255, 149, 159, 0), rgba(255, 75, 75, 0) 14%, rgba(236, 176, 2, 0) 27%, rgba(221, 255, 0, 0) 46%, #01e270 67%, #00b8ef 99%);
}
.landing-page_ios .benefit-card--02::before {
  background: radial-gradient(circle at 100% 100%, rgba(0, 196, 5, 0), rgba(32, 159, 148, 0) 27%, rgba(6, 161, 243, 0) 46%, #b739c0 67%, #ed034a 99%);
}
.benefit-card--03::before {
  background: radial-gradient(circle at 100% 100%, #ff959f, #ff4b4b 14%, #ecb002 27%, rgba(221, 255, 0, 0.7) 46%, rgba(1, 226, 112, 0) 67%, rgba(0, 184, 239, 0) 99%);
}
.landing-page_ios .benefit-card--03::before {
  background: radial-gradient(circle at 100% 100%, rgba(0, 196, 5, 0), rgba(32, 159, 148, 0) 27%, rgba(6, 161, 243, 0) 46%, #b739c0 67%, #ed034a 99%);
}
.benefit-card--04::before {
  background: radial-gradient(circle at 100% 100%, rgba(255, 149, 159, 0), rgba(255, 75, 75, 0) 14%, rgba(236, 176, 2, 0) 27%, rgba(221, 255, 0, 0) 46%, #01e270 67%, #00b8ef 99%);
}
.landing-page_ios .benefit-card--04::before {
  background: radial-gradient(circle at 100% 100%, #00c405, #209f94 27%, #06a1f3 46%, rgba(183, 57, 192, 0) 67%, rgba(237, 3, 74, 0) 99%);
}
@media (max-width: 767px) {
  .benefit-card--01::after, .benefit-card--02::after, .benefit-card--03::after {
    content: "";
    width: 103px;
    height: 66px;
    position: absolute;
    bottom: -50%;
    transform: translateY(-50%);
    background-size: 100%;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='103' height='66' viewBox='0 0 103 66' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m91.076 52.082.102.048 10.918 6.149a.834.834 0 0 1 .083 1.399l-.102.064-11.08 5.85a.833.833 0 0 1-.875-1.414l.096-.06 8.189-4.325-2.818-.037a.833.833 0 0 1 .023-1.667l2.82.038-8.071-4.544a.834.834 0 0 1-.366-1.033l.048-.102a.834.834 0 0 1 1.033-.366zm-5.43 5.712c1.454.082 2.928.15 4.424.206a.833.833 0 0 1-.062 1.665 224.851 224.851 0 0 1-4.456-.207.833.833 0 1 1 .095-1.664zm-10.036-.818.104.005c1.444.157 2.912.298 4.405.424a.833.833 0 0 1-.14 1.661c-1.506-.127-2.988-.27-4.445-.428a.833.833 0 0 1-.027-1.654l.103-.008zm-9.829-1.381.104.011c1.427.248 2.882.478 4.366.69a.833.833 0 0 1-.236 1.65c-1.5-.214-2.972-.447-4.415-.698a.833.833 0 0 1 .079-1.652l.102-.001zm-9.629-2.073c1.397.362 2.828.702 4.292 1.021a.833.833 0 0 1-.355 1.629c-1.485-.324-2.936-.67-4.354-1.036a.833.833 0 1 1 .417-1.614zm-9.459-2.958c1.347.504 2.735.983 4.162 1.436a.833.833 0 0 1-.505 1.589 90.014 90.014 0 0 1-4.24-1.463.833.833 0 0 1 .583-1.562zm-9.02-4.059a67.32 67.32 0 0 0 3.931 1.953.833.833 0 1 1-.693 1.516 68.986 68.986 0 0 1-4.029-2.002.833.833 0 1 1 .791-1.467zm-8.297-5.377a61.933 61.933 0 0 0 3.57 2.548.833.833 0 0 1-.92 1.39 63.6 63.6 0 0 1-3.665-2.617.833.833 0 0 1 1.015-1.321zm-7.36-6.605a68.535 68.535 0 0 0 3.144 3.065.833.833 0 0 1-1.125 1.23 70.201 70.201 0 0 1-3.22-3.14.833.833 0 1 1 1.201-1.155zm-6.36-7.556a79.82 79.82 0 0 0 2.71 3.464.833.833 0 0 1-1.283 1.063 81.486 81.486 0 0 1-2.767-3.536.833.833 0 0 1 1.34-.991zm-5.44-8.299a95.626 95.626 0 0 0 2.304 3.757.833.833 0 0 1-1.4.904 97.292 97.292 0 0 1-2.344-3.822.833.833 0 1 1 1.44-.839zM5.63 9.865c.63 1.353 1.278 2.674 1.94 3.964a.833.833 0 0 1-1.482.761 117.311 117.311 0 0 1-1.968-4.02.833.833 0 1 1 1.51-.705zM1.779.705c.529 1.397 1.071 2.767 1.628 4.11a.833.833 0 1 1-1.54.638A141.29 141.29 0 0 1 .221 1.295a.833.833 0 0 1 1.558-.59z' fill='%2360AEFF' fill-rule='nonzero'/%3E%3C/svg%3E%0A");
  }
  .benefit-card--01::after, .benefit-card--03::after {
    left: -26px;
  }
  .benefit-card--02::after {
    right: -26px;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='103' height='66' viewBox='0 0 103 66' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m11.924 52.082-.102.048L.904 58.28a.834.834 0 0 0-.083 1.399l.102.064 11.08 5.85a.833.833 0 0 0 .875-1.414l-.096-.06-8.189-4.325 2.818-.037a.833.833 0 0 0-.023-1.667l-2.82.038 8.071-4.544a.834.834 0 0 0 .366-1.033l-.048-.102a.834.834 0 0 0-1.033-.366zm5.43 5.712c-1.454.082-2.928.15-4.424.206a.833.833 0 0 0 .062 1.665c1.506-.055 2.992-.124 4.456-.207a.833.833 0 1 0-.095-1.664zm10.036-.818-.104.005c-1.444.157-2.912.298-4.405.424a.833.833 0 0 0 .14 1.661c1.506-.127 2.988-.27 4.445-.428a.833.833 0 0 0 .027-1.654l-.103-.008zm9.829-1.381-.104.011a146.49 146.49 0 0 1-4.366.69.833.833 0 0 0 .236 1.65c1.5-.214 2.972-.447 4.415-.698a.833.833 0 0 0-.079-1.652l-.102-.001zm9.629-2.073c-1.397.362-2.828.702-4.292 1.021a.833.833 0 0 0 .355 1.629c1.485-.324 2.936-.67 4.354-1.036a.833.833 0 1 0-.417-1.614zm9.459-2.958A88.348 88.348 0 0 1 52.145 52a.833.833 0 0 0 .505 1.589 90.014 90.014 0 0 0 4.24-1.463.833.833 0 0 0-.583-1.562zm9.02-4.059a67.32 67.32 0 0 1-3.931 1.953.833.833 0 1 0 .693 1.516 68.986 68.986 0 0 0 4.029-2.002.833.833 0 1 0-.791-1.467zm8.297-5.377a61.933 61.933 0 0 1-3.57 2.548.833.833 0 0 0 .92 1.39 63.6 63.6 0 0 0 3.665-2.617.833.833 0 0 0-1.015-1.321zm7.36-6.605a68.535 68.535 0 0 1-3.144 3.065.833.833 0 0 0 1.125 1.23 70.201 70.201 0 0 0 3.22-3.14.833.833 0 1 0-1.201-1.155zm6.36-7.556a79.82 79.82 0 0 1-2.71 3.464.833.833 0 0 0 1.283 1.063 81.486 81.486 0 0 0 2.767-3.536.833.833 0 0 0-1.34-.991zm5.44-8.299a95.626 95.626 0 0 1-2.304 3.757.833.833 0 0 0 1.4.904c.8-1.238 1.581-2.513 2.344-3.822a.833.833 0 1 0-1.44-.839zm4.587-8.803a115.645 115.645 0 0 1-1.94 3.964.833.833 0 0 0 1.482.761c.672-1.309 1.329-2.649 1.968-4.02a.833.833 0 1 0-1.51-.705zm3.85-9.16a139.625 139.625 0 0 1-1.628 4.11.833.833 0 1 0 1.54.638 141.29 141.29 0 0 0 1.646-4.158.833.833 0 0 0-1.558-.59z' fill='%2360AEFF' fill-rule='nonzero'/%3E%3C/svg%3E%0A");
  }
}
.benefit-card__block {
  border-radius: 8px;
  position: relative;
  z-index: 1;
  padding: 104px 30px 102px;
}
@media (max-width: 1023px) {
  .benefit-card__block {
    width: 100%;
    padding: 47px 20px 48px;
  }
}
.benefit-card__block::after, .benefit-card__block::before {
  width: 111px;
  height: 101px;
  position: absolute;
  z-index: -1;
  background-image: url("/img/landing/im-effects-0.svg");
  background-size: 100%;
}
@media (max-width: 1023px) {
  .benefit-card__block::after, .benefit-card__block::before {
    width: 78px;
    height: 71px;
  }
}
.benefit-card--01 .benefit-card__block::before, .benefit-card--03 .benefit-card__block::before {
  content: "";
  top: 20px;
  right: 30px;
}
@media (max-width: 1023px) {
  .benefit-card--01 .benefit-card__block::before, .benefit-card--03 .benefit-card__block::before {
    right: 20px;
  }
}
.benefit-card--02 .benefit-card__block::before {
  content: "";
  top: -139px;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefit-card--02 .benefit-card__block::before {
    top: -91px;
  }
}
@media (max-width: 767px) {
  .benefit-card--02 .benefit-card__block::before {
    top: -61px;
    left: auto;
    right: -26px;
    transform: none;
  }
}
.benefit-card--02 .benefit-card__block::after {
  content: "";
  bottom: -161px;
  left: 30px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefit-card--02 .benefit-card__block::after {
    bottom: -91px;
    left: -30px;
  }
}
@media (max-width: 767px) {
  .benefit-card--02 .benefit-card__block::after {
    bottom: -86px;
    left: -26px;
  }
}
.benefit-card--04 .benefit-card__block::before {
  content: "";
  top: -139px;
  left: 30px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefit-card--04 .benefit-card__block::before {
    top: -111px;
    left: -36px;
  }
}
@media (max-width: 767px) {
  .benefit-card--04 .benefit-card__block::before {
    top: -61px;
    left: auto;
    right: -26px;
  }
}
.benefit-card--04 .benefit-card__block::after {
  content: "";
  bottom: -161px;
  right: 112px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefit-card--04 .benefit-card__block::after {
    bottom: -71px;
    right: 62px;
  }
}
@media (max-width: 767px) {
  .benefit-card--04 .benefit-card__block::after {
    bottom: -86px;
    left: -26px;
    right: auto;
  }
}
.benefit-card__title {
  font-size: 34px;
  line-height: 40px;
  padding-bottom: 20px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .benefit-card__title {
    font-size: 24px;
    line-height: 30px;
    padding-bottom: 18px;
  }
}
@media (max-width: 767px) {
  .benefit-card__title {
    font-size: 20px;
    line-height: 30px;
    padding-bottom: 16px;
  }
}
.benefit-card__desc {
  font-size: 20px;
  line-height: 30px;
  color: var(--dark);
}
@media (max-width: 1023px) {
  .benefit-card__desc {
    font-size: 16px;
  }
}

.hero {
  margin-top: -30px;
  background-image: linear-gradient(127deg, #64b3ff 1%, #365ee5 64%), linear-gradient(to bottom, #2f5bea, #2f5bea), linear-gradient(to bottom, var(--white), var(--white));
  position: relative;
}
.hero::after {
  content: "";
  height: 10px;
  opacity: 0.5;
  background-image: radial-gradient(circle at 92% 91%, #00c405, #209f94 20%, #06a1f3 43%, #b739c0 66%, #ed034a 93%);
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
}
.hero__container {
  display: flex;
  align-items: flex-end;
  min-height: 758px;
  width: 100%;
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media (max-width: 767px) {
  .hero__container {
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media (max-width: 1023px) {
  .hero__container {
    padding-top: 100px;
    min-height: 672px;
  }
}
@media (max-width: 767px) {
  .hero__container {
    padding-top: 40px;
    min-height: auto;
  }
}
.hero__content {
  padding-bottom: 53px;
  position: relative;
  z-index: 2;
  width: 48%;
}
@media (max-width: 1023px) {
  .hero__content {
    padding-bottom: 33px;
  }
}
@media (max-width: 767px) {
  .hero__content {
    width: 100%;
  }
}
.hero__header {
  display: flex;
  align-items: center;
  gap: 30px;
}
@media (max-width: 1023px) {
  .hero__header {
    gap: 20px;
  }
  .hero__header img {
    width: 72px;
    height: 72px;
  }
}
@media (max-width: 767px) {
  .hero__header {
    gap: 15px;
  }
}
.hero__title {
  font-weight: bold;
  font-size: 34px;
  line-height: 36px;
  color: var(--white);
  padding-bottom: 16px;
}
@media (max-width: 1023px) {
  .hero__title {
    font-size: 30px;
    padding-bottom: 10px;
  }
}
.landing-page_ios .hero__title {
  padding-bottom: 0;
}
.hero__subtitle {
  font-weight: bold;
  font-size: 24px;
  line-height: 26px;
  color: var(--white);
}
@media (max-width: 1023px) {
  .hero__subtitle {
    font-size: 20px;
  }
}
.hero__desc {
  padding-top: 20px;
}
.hero__features {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  padding-top: 40px;
}
.landing-page_ios .hero__features {
  padding-top: 20px;
}
.hero__feature {
  background-color: var(--white);
  display: flex;
  gap: 15px;
  align-items: center;
  padding: 12px 20px;
  border-radius: 12px;
  box-shadow: 0 2px 10px 0 rgba(33, 40, 62, 0.1);
}
.hero__feature-icon {
  font-size: 26px;
  min-width: 36px;
  text-align: center;
}
.hero__feature-text {
  font-size: 20px;
  line-height: 36px;
  font-weight: 500;
  color: var(--dark);
}
@media (max-width: 1023px) {
  .hero__feature-text {
    font-size: 18px;
    line-height: 34px;
  }
}
.hero__download {
  padding-top: 40px;
}
@media (max-width: 1023px) {
  .hero__download {
    padding-top: 30px;
  }
  .hero__download img {
    height: 48px;
  }
}
.hero__download a[href] {
  display: inline-flex;
}
.hero__image {
  position: relative;
  z-index: 1;
  width: 52%;
}
@media (max-width: 767px) {
  .hero__image {
    display: none;
  }
}
.hero__phone {
  width: 820px;
  height: 660px;
  background-image: url("/img/landing/phone-effects-0.png");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: bottom center;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 768px) and (max-width: 1023px) {
  .hero__phone {
    background-image: url("/img/landing/phone-effects-1.png");
    width: 594px;
    height: 572px;
  }
}
.landing-page_ios .hero__phone {
  background-image: url("/img/landing/iphone-effects-0.png");
}
@media (min-width: 768px) and (max-width: 1023px) {
  .landing-page_ios .hero__phone {
    background-image: url("/img/landing/iphone-effects-1.png");
  }
}

.how-it-works {
  padding-top: 60px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .how-it-works {
    padding-top: 40px;
  }
}
@media (max-width: 767px) {
  .how-it-works {
    padding-top: 80px;
    padding-bottom: 70px;
  }
}
.how-it-works__steps {
  list-style: none;
  display: flex;
  gap: 30px;
}
@media (max-width: 1023px) {
  .how-it-works__steps {
    flex-wrap: wrap;
    gap: 20px;
  }
}
.how-it-works__step {
  flex: 1;
  padding: 14px 14px 30px;
  border-radius: 10px;
  box-shadow: 0 2px 8px 0 rgba(33, 40, 62, 0.1);
  background-color: var(--white);
}
@media (min-width: 768px) and (max-width: 1023px) {
  .how-it-works__step {
    flex-basis: calc(50% - 10px);
  }
}
@media (max-width: 767px) {
  .how-it-works__step {
    flex-basis: 100%;
  }
}
.how-it-works__title {
  font-weight: bold;
  font-size: 24px;
  line-height: 30px;
  text-align: center;
  color: var(--dark);
  padding-top: 5px;
}
.how-it-works__icon img {
  display: block;
  margin: 0 auto;
  height: auto;
}

.footer {
  position: relative;
}
.footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -10px;
  height: 10px;
  opacity: 0.5;
  background-image: radial-gradient(circle at 100% 100%, #ff4b4b, #ecb002 23%, #df0 48%, #01e270 73%, #00b8ef 103%);
}

.landing-page_ios + .footer::before {
  background-image: radial-gradient(circle at 92% 91%, #00c405, #209f94 20%, #06a1f3 43%, #b739c0 66%, #ed034a 93%);
}