.instruction {
  background: rgba(19, 19, 19, 1);
  padding: 0 0 80px;
}

.breadcrumbs-wrapper {
  margin-bottom: 40px;
}

.header-block-wrapper {
  margin-bottom: 64px;
}

.steps {
  padding: 80px 0 0;
}

.instruction-step {
  display: grid;
  align-items: center;
  grid-template-areas: 'a b';
  grid-template-columns: 1fr 1fr;
  margin-bottom: 80px;
  gap: 40px;
}

.instruction-step:last-child {
  margin-bottom: 0;
}

.even {
  grid-area: a;
}

.instruction-step-text {
  max-width: 610px;
}

.instruction-step-title {
  margin-bottom: 24px;
}

.instruction-step-img {
  max-width: 610px;
  width: 100%;
  border-radius: 8px;
}

.instruction-step-img.odd {
  justify-self: flex-end;
}

.instruction-description {
  margin-top: 40px;
}

@media screen and (max-width: 1240px) {
  .instruction {
    padding: 0 0 46px;
  }

  .header-block-wrapper {
    margin-bottom: 46px;
  }

  .steps {
    padding-top: 60px;
  }
}

@media screen and (max-width: 900px) {
  .instruction {
    padding: 0 0 34px;
  }

  .header-block-wrapper {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 30px;
  }

  .steps {
    margin-top: 0;
    margin-bottom: 40px;
  }

  .instruction-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 24px;
    gap: 44px;
  }

  .instruction-step-text {
    width: 100%;
  }

  .instruction-step-img {
    width: 100%;
  }

  .odd {
    grid-area: none;
  }
}

@media screen and (max-width: 700px) {
  .steps {
    padding-top: 24px;
    margin-bottom: 0;
  }

  .instruction {
    padding: 0 0 24px;
  }

  .header-block-wrapper {
    margin-bottom: 24px;
  }

  .instruction-step-title {
    font-size: 20px;
    line-height: 30px;
  }

  .instruction-step-description {
    font-size: 14px;
    line-height: 20px;
  }

  .instruction-description {
    margin-top: 20px;
  }
}

@media screen and (max-width: 460px) {
}