:root {
  --general-color: #5871A1;
  --cursor-color: #7B9FE3;
}

@media (min-width: 1281px) {
  .vertical-title {
    font: 700 17.045vh/1.35 var(--font);
  }

  .challenge__img, .solution__img {
    width: auto;
  }
}

.case-cover__img {
  height: 100vh;
  width: auto;
}

.process__img--1 {
  height: 23.977vh;
  right: 138.409vh;
}

.process__img--2 {
  height: 42.045vh;
  right: 60.455vh;
}

.challenge, .solution {
  .vertical-title {
    height: 100vh;
  }
}

.challenge {
  padding-left: 30.682vh;
}

.challenge__content:nth-child(1) {
  padding-top: 18.864vh;
}

.challenge__content:nth-child(2) {
  margin-top: auto;
  margin-left: 32.045vh;

  .challenge__img {
    height: 67.614vh;
    margin-left: 0;
  }
}

.solution {
  padding: 0 30.682vh 0 15.341vh;
}

@media (min-width: 1281px) {
  .solution__content {
    margin-left: 15.341vh;
  }
}

.solution__content:nth-of-type(1) {
  padding-top: 19.886vh;
}

.solution__content:nth-of-type(2) {
  padding-top: 50.568vh;
}

.solution__content:nth-of-type(3) {
  padding-top: 15.341vh;
}

.solution__content:nth-of-type(4) {
  padding-top: 0;

  .solution__img {
    height: 100vh;
  }
}

.solution__content:nth-of-type(5) {
  padding-top: 25.227vh;
}

.solution__content:nth-of-type(6) {
  padding-top: 0;
  display: flex;
  flex-direction: column;
  gap: 8.523vh;

  .solution__img {
    margin: 0 5.455vh;
    height: 63.864vh;
    width: auto;
  }
}

.solution__content:nth-of-type(7) {
  padding-top: 19.432vh;
}

.solution__content:nth-of-type(8) {
  margin-top: auto;

  .solution__img {
    height: 63.864vh;
  }
}

.solution__content:nth-of-type(9) {
  padding-top: 53.977vh;
}

.delivered-features__container {
  display: flex;
}

.delivered-features__list {
  width: 72.727vh;
}

.integrations {
  padding: 0 15.341vh;
  display: flex;
  align-items: center;
  background-color: #F4F2EC;
}

.integrations__img {
  height: 65.568vh;
}

@media (max-width: 1280px) {
  .case-cover__img {
    width: 100vw;
    height: auto;
  }

  .process > picture:nth-child(1) {
    margin: 0 0 0 auto;
  }

  .process__img, .challenge__content.challenge__content .challenge__img, .solution__content.solution__content .solution__img {
    height: auto;
  }

  .process__img--1 {
    width: 17.708vw;
  }

  .process__img--2 {
    width: 42.318vw;
    margin: 0 3.125vw;
  }

  .challenge, .solution {
    display: flex;
    flex-direction: column;
    padding: 10.677vw 0 0;

    .vertical-title {
      height: auto;
      position: absolute;
      top: 10.156vw;
      left: 1.042vw;
    }

    .content-block-md {
      width: auto;
      padding: 0;
    }
  }

  .challenge__content.challenge__content, .solution__content.solution__content, .challenge__img, .solution__img {
    margin: 0;
    padding: 0;
  }

  .challenge__content:nth-of-type(1) {
    margin: 0 8.594vw 0 10.156vw;
  }

  .challenge__content:nth-of-type(2) {
    padding: 0;

    .challenge__img {
      margin: 7.552vw 0 0 auto;
    }
  }

  .solution {
    padding-bottom: 10.156vw;
  }

  .solution__content:nth-of-type(1) {
    margin: 0 8.594vw 0 20.313vw;
  }

  .solution__content:nth-of-type(2) {
    margin: 7.552vw 8.594vw 0 24.479vw;
  }

  .solution__content:nth-of-type(3) {
    margin: 7.552vw 18.75vw 0 10.156vw;
  }

  .solution__content:nth-of-type(4) {
    margin: 10.156vw 0 0;

    .solution__img {
      width: 100%;
      height: auto;
    }
  }

  .solution__content:nth-of-type(5) {
    margin: 10.156vw 11.198vw 0 7.552vw;
  }

  .solution__content:nth-of-type(6) {
    margin: 7.552vw 18.75vw 0 0;
    gap: 7.552vw;

    .solution__img {
      width: 60.938vw;
      margin: 0;
    }

    .content-block__text {
      margin-left: 10.156vw;
    }
  }

  .solution__content:nth-of-type(7) {
    margin: 7.552vw 8.594vw 0 10.156vw;
  }

  .solution__content:nth-of-type(8) {
    margin: 7.552vw 0 0 auto;

    .solution__img {
      width: 56.901vw;
    }
  }

  .solution__content:nth-of-type(9) {
    margin: 7.552vw 21.354vw 0 7.552vw;
  }

  .delivered-features__container {
    flex-direction: column;
    gap: 1.042vw;
  }

  .delivered-features__list {
    width: auto;

    & + .delivered-features__list {
      margin-top: 0;
    }
  }

  .integrations {
    padding: 10.156vw 6.12vw;
  }

  .integrations__img {
    width: 100%;
    height: auto;
  }
}

@media (max-width: 767px) {
  .process {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .process__img--1 {
    width: 27.2vw;
  }

  .process__img--2 {
    width: 59.467vw;
    margin: 0 0 0 4.267vw;
  }

  .challenge, .solution {
    padding: 15.467vw 0 0;

    .vertical-title {
      position: static;
      margin-left: 15px;
    }

    .content-block-md {
      width: calc(100% - 27px);
      margin-left: 15px;
    }
  }

  .challenge__content:nth-of-type(2) .challenge__img {
    width: 66.667vw;
    margin: 14.133vw 12px 0 auto;
  }

  .solution {
    padding-bottom: 15.467vw;
  }

  .solution__content.solution__content {
    margin: 14.133vw 12px 0 15px;
  }

  .solution__content:nth-of-type(4) {
    margin: 14.133vw 0 0;
  }

  .solution__content:nth-of-type(6) {
    gap: 14.133vw;

    .solution__img {
      width: 72vw;
    }

    .content-block__text {
      margin-left: 0;
    }
  }

  .solution__content:nth-of-type(8) .solution__img {
    width: 72vw;
    margin-left: auto;
  }

  .delivered-features__container {
    gap: 2.667vw;
  }

  .integrations {
    padding: 15.467vw 12px 15.467vw 15px;
  }
}