/* -------------------------first-screen----------------------- */
.first-screen {
  background: url(../img/after-stroke_bg.webp) no-repeat center center;
  background-size: cover;
  /* background-attachment: fixed; */
}
.fs__title span {
  font-size: 24px;
  display: inline-block;
  margin-top: 0;
}
.fs__title h1 {
  display: inherit;
  flex-direction: unset;
}
/* -------------------advantages-------------------- */
.advantages-left__list-title {
  margin-bottom: 24px;
  font-size: 20px;
}
.advantages-left__list {
  margin-top: 57px;
}
.advantages-left__list li:not(:last-child) {
  margin-bottom: 15px;
}
.advantages-left__list li span.c-orange {
  font-size: 20px;
}
.advantages__subtitle {
  max-width: 100%;
}
.advantage .icon-check {
  top: 50%;
  transform: translateY(-50%);
}
.advantage__text {
  margin-top: 0;
}
/* -------------------------types------------------------- */
.types {
  padding: 120px 0;
  position: relative;
}
.types:before {
  content: '';
  width: 558px;
  height: 478px;
  position: absolute;
  left: 0;
  bottom: 0;
  background: url(../img/Vector.webp) no-repeat left bottom;
  background-size: contain;
  z-index: 0;
}
.types:after {
  content: '';
  width: 187px;
  height: 100%;
  position: absolute;
  right: 70px;
  top: 0;
  background: url(../img/types-before.webp) no-repeat right top;
  background-size: contain;
  z-index: 0;
}
.types__container {
  position: relative;
  z-index: 1;
}
.types__title {
  margin-bottom: 45px;
}
.types__cards {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.types__card {
  width: calc((100% - 2 * 30px) / 2);
  margin: 0 15px;
  padding: 40px;
  box-shadow: 0px 20px 70px -30px rgba(19, 27, 54, 0.25);
  border-radius: 10px;
}
.types__card-top {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.types__card-img {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  margin-right: 30px;
}
.types__card-title {
  width: calc(100% - 70px - 30px);
  font-size: 20px;
  line-height: 140%;
}
.types__card-content p:not(:last-child) {
  margin-bottom: 15px;
}
.types__card-list-title {
  margin-bottom: 4px;
}
.types__card-list {
  padding-left: 32px;
}
.types__card-list li {
  position: relative;
}
.types__card-list li::before {
  content: '';
  width: 4px;
  height: 4px;
  background: var(--c-black);
  position: absolute;
  left: -17px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}
/* ------------------------methods--------------------- */
.methods {
  padding: 91px 0 93px;
  position: relative;
}
.methods:before {
  content: '';
  width: 50vw;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background: url(../img/bg-methods.webp) no-repeat center center;
  background-size: cover;
}
.methods__container {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.methods__left {
  width: calc((100% - 2 * 30px) / 2);
  margin: 0 15px;
}
.methods__title {
  margin-bottom: 30px;
}
.methods__text {
  margin-bottom: 36px;
  padding-right: 30px;
}
.methods__text p {
  margin-bottom: 15px;
}
.methods__list-title {
  font-size: 20px;
  line-height: 120%;
  margin-bottom: 15px;
}
.methods__list {
  padding-left: 30px;
}
.methods__list li {
  position: relative;
}
.methods__list li:not(:last-child) {
  margin-bottom: 15px;
}
.methods__list li:before {
  content: ' ';
  width: 10px;
  height: 10px;
  position: absolute;
  left: -30px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--c-orange);
  border-radius: 50%;
}
@media screen and (max-width: 1300px) {
  /* ---------------advantages--------------- */
  .advantages-left__list {
    margin-top: 50px;
  }
  .advantages-left__list-title {
    margin-bottom: 21px;
    font-size: 17px;
  }
  .advantages-left__list li:not(:last-child) {
    margin-bottom: 13px;
  }
  .advantages-left__list li span.c-orange {
    font-size: 17px;
  }
  /* ----------------types---------------- */
  .types {
    padding: 105px 0;
  }
  .types__title {
    margin-bottom: 39px;
  }
  .types::before {
    width: 487px;
    height: 417px;
  }
  .types::after {
    width: 163px;
    right: 61px;
  }
  .types__cards {
    margin: 0 -10px;
  }
  .types__card {
    width: calc((100% - 2 * 20px) / 2);
    margin: 0 10px;
    padding: 35px;
  }
  .types__card-top {
    margin-bottom: 18px;
  }
  .types__card-img {
    width: 60px;
    height: 60px;
    margin-right: 26px;
  }
  .types__card-title {
    width: calc(100% - 60px - 26px);
    font-size: 18px;
  }
  .types__card-content p:not(:last-child) {
    margin-bottom: 13px;
  }
  .types__card-list {
    padding-left: 28px;
  }
  /* -------------------methods----------------------- */
  .methods {
    padding: 80px 0;
  }
  .methods__title {
    margin-bottom: 26px;
  }
  .methods__text {
    margin-bottom: 30px;
    padding-right: 26px;
  }
  .methods__list-title {
    font-size: 18px;
    margin-bottom: 13px;
  }
  .methods__list {
    padding-left: 26px;
  }
  .methods__list li:not(:last-child) {
    margin-bottom: 13px;
  }
  .methods__list li::before {
    left: -26px;
  }
}
@media screen and (max-width: 1100px) {
  /* ---------------advantages--------------- */
  .advantages-left__list {
    margin-top: 44px;
  }
  .advantages-left__list-title {
    margin-bottom: 18px;
    font-size: 16px;
  }
  .advantages-left__list li:not(:last-child) {
    margin-bottom: 11px;
  }
  /* ----------------types---------------- */
  .types {
    padding: 92px 0;
  }
  .types__title {
    margin-bottom: 30px;
  }
  .types__card {
    width: calc((100% - 2 * 16px) / 2);
    margin: 0 8px;
    padding: 30px;
  }
  .types__card-top {
    margin-bottom: 15px;
  }
  .types__card-img {
    margin-right: 20px;
  }
  .types__card-title {
    width: calc(100% - 60px - 20px);
    font-size: 16px;
  }
  .types__card-content p:not(:last-child) {
    margin-bottom: 10px;
  }
  .types__cards {
    margin: 0px -8px;
  }
  /* -------------------methods----------------------- */
  .methods__title {
    margin-bottom: 23px;
  }
  .methods__text {
    margin-bottom: 26px;
    padding-right: 0;
  }
  .methods__list-title {
    font-size: 16px;
    margin-bottom: 11px;
  }
  .methods__list li:not(:last-child) {
    margin-bottom: 11px;
  }
}
@media screen and (max-width: 950px) {
  /* ---------------advantages--------------- */
  .advantages-left__list {
    margin-top: 30px;
  }
  .advantages-left__list-title {
    margin-bottom: 16px;
  }
  .advantages-left__list li:not(:last-child) {
    margin-bottom: 10px;
  }
  /* ----------------types---------------- */
  .types {
    padding: 80px 0;
  }
  .types__cards {
    margin: 0;
  }
  .types__card {
    width: 100%;
    margin: 8px 0;
  }
  .types__title {
    margin-bottom: 20px;
  }
  /* -------------------methods----------------------- */
  .methods {
    padding: 70px 0;
  }
  .methods__title {
    margin-bottom: 20px;
  }
  .methods__text {
    margin-bottom: 20px;
  }
  .methods__list-title {
    font-size: 15px;
  }
  .methods__text p {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 800px) {
  /* ---------------advantages--------------- */
  .advantages-left__list-title {
    margin-bottom: 14px;
    font-size: 14px;
  }
  .advantages-left__list {
    margin-top: 15px;
  }
  .advantages-left__list li:not(:last-child) {
    margin-bottom: 8px;
  }
  .advantages-left__list li span.c-orange {
    font-size: 14px;
  }
  /* ----------------types---------------- */
  .types {
    padding: 40px 0;
  }
  .types__title {
    margin-bottom: 15px;
  }
  .types__card {
    padding: 20px;
  }
  .types__card-title {
    font-size: 14px;
  }
  .types__card-img {
    margin-right: 15px;
  }
  .types__card-content p:not(:last-child) {
    margin-bottom: 5px;
  }
  .types__card-top {
    margin-bottom: 10px;
  }
  .types__card-img {
    width: 50px;
    height: 50px;
  }
  .types__card-list {
    padding-left: 20px;
  }
  .types::before {
    width: 260px;
    height: 222px;
  }
  .types::after {
    width: 55px;
    right: 20px;
  }
  /* -------------------methods----------------------- */
  .methods::before {
    width: 100vw;
    height: 300px;
    top: auto;
    bottom: 0;
  }
  .methods {
    padding: 40px 0 320px;
  }
  .methods__title {
    margin-bottom: 10px;
  }
  .methods__text {
    margin-bottom: 16px;
  }
  .methods__list-title {
    font-size: 14px;
  }
  .methods__left {
    width: 100%;
    margin: 0;
  }
  .methods__container {
    margin: 0;
  }
  .methods__list li:not(:last-child) {
    margin-bottom: 8px;
  }
  .methods__list {
    padding-left: 24px;
  }
  .methods__list li::before {
    left: -20px;
  }
}