<div class="work__item">
  <div class="work__content">
    <h2 class="work__item-title">
      Вивчаємо продукт
    </h2>
    <div class="work__item-count">
      01
    </div>
    <div class="work__item-desc">
      Знайомимось із властивостями Вашого товару або послуги, визначаємо цінову категорію,
      сильні
      та слабкі сторони та врешті решт розуміємо на яку аудиторію орієнтувати контент та
      рекламу.
    </div>
  </div>

</div>

body {
  max-width: 500px;
  width: 100%;
  background: linear-gradient(
    220deg,
    rgba(201, 232, 255, 0.4) 0%,
    rgba(240, 211, 255, 0.4) 51.46%,
    rgba(239, 224, 170, 0.4) 100%
  );
}
.work__item {
  --padding: 40px;
  --radius: 20px;
  position: relative;
  max-width: 500px;
}
.work__content {
  //position: relative;

  display: grid;
  grid-template-columns: 1fr min-content;
}

.work__item-title {
  font-size: 27px;
  font-weight: 700;
  line-height: 120%;
  margin-bottom: 24px;

  padding: var(--padding) var(--padding) 20px var(--padding);
  margin: 0;
  border-radius: var(--radius) var(--radius) 0 0;
  background: #fff;
}

.work__item-desc {
  color: #212121;
  font-size: 18px;
  font-weight: 400;
  line-height: 160%;
  max-width: 430px;
  opacity: 0.8;

  grid-column: 1/-1;
  padding: 0 var(--padding) var(--padding);
  border-radius: 0 var(--radius) var(--radius) var(--radius);
  background: #fff;
}

.work__item-count {
  //position: absolute;
  //top: 20px;
  //right: 20px;
  color: #5b7fff;
  font-family: Montserrat;
  font-size: 38px;
  font-weight: 600;

  position: relative;
}

.work__item-count::after {
  content: "";
  position: absolute;
  //top: 0;
  //right: 0;
  //width: 100px;
  //height: 100px;
  background: radial-gradient(calc(2 * var(--radius)) at top right, transparent 49%, #f05 51%) no-repeat right bottom;

  bottom: 0;
  left: 0;
  width: var(--radius);
  aspect-ratio: 1;
}