.Section {
  display: block;
}

.Header {
  font-family: $font-roboto;
  font-weight: 300;
  font-size: 32px;
  line-height: 130%;
  color: $color-text;
  margin-bottom: 16px;
}

.Text {
  font-family: $font-roboto;
  font-weight: 400;
  font-size: rem(16px);
  line-height: 130%;
  color: $color-text;
  margin-bottom: 16px;
}

.Container {
  display: grid;
  grid-template-columns: auto;
  gap: 20px;

  @include iftablet{
    grid-template-columns: auto 200px;
    gap: 40px;
  }

  @include iflaptop{
    grid-template-columns: auto 200px;
    gap: 40px;
  }

  @include ifdesktop{
    grid-template-columns: auto 200px;
    gap: 100px;
  }
}

.Icons {
  display: flex;
  flex-direction: row;
  justify-content: space-around;

  .Icon {
    display: flex;
    flex-direction: column;
    align-items: center;

    .Image {
      margin-bottom: 16px;
      width: 100px;
      height: auto;

      @include iftablet{
        width: 120px;
        height: auto;
      }
      @include iflaptop{
        width: 120px;
        height: auto;
      }
      @include ifdesktop{
        width: 150px;
        height: auto;
      }
    }

    .Description {
      font-family: $font-roboto;
      font-weight: 400;
      font-size: 16px;
      line-height: 130%;
      color: $color-green;
      text-transform: uppercase;
    }
  }
}

.CallOrder {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;

  .Title {
    font-family: $font-roboto;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    color: $color-text;
  }

  .Btn {
    border-width: 1px 1px 1px 1px;
    border-color: $color-green;
    border-radius: 15px 15px 15px 15px;
    box-shadow: 2px 2px 5px 0px $color-green;
  }

  .Description {
    font-family: $font-roboto;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: $color-text;
  }
}