<ul>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  <li>
    <p>text</p>
  </li>
  
</ul>

<p>Цветные уголки оставлены для наглядности</p>
<p>Для https://qna.habr.com/q/1221324</p>

@import url("https://fonts.googleapis.com/css2?family=Mulish&display=swap");

body {
  margin: 20px;
  font-family: Mulish, sans-serif;
}

ul {
  --fz: 18px;
  --lh: 3.5;
  --line-size: 8px;
  --r: 40px;
  --color: #4841A1;
  margin: 0;
  padding-left: 0;
  font-size: var(--fz);
  line-height: var(--lh);
  counter-reset: advantage;
  list-style-type: none;
}
li {
  display: grid;
  grid-template-columns: min-content 1fr;
  gap: 20px;
}
li:not(:first-child) {
  margin-top: calc(0px - var(--line-size) );
}
li::before {
  content: counter(advantage);
  counter-increment: advantage;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: calc(var(--r) * 2);
  padding-left: 10px;
  padding-right: 10px;
  font-size: 1.5;
}
li:nth-child(odd)::before {
  background: radial-gradient(
        at top right,
        #9CBBFC calc(var(--r) - var(--line-size) - 1px),
        var(--color) calc(var(--r) - var(--line-size)),
        var(--color) calc(var(--r) - 1px),
        transparent var(--r)
      )
      no-repeat left bottom / var(--r) var(--r),
    radial-gradient(
        at bottom right,
        #D8EFF7 calc(var(--r) - var(--line-size) - 1px),
        var(--color) calc(var(--r) - var(--line-size)),
        var(--color) calc(var(--r) - 1px),
        transparent var(--r)
      )
      no-repeat left top / var(--r) var(--r),
    linear-gradient(to bottom, var(--color), var(--color)) no-repeat left 
      center / var(--line-size) calc(100% - 2*var(--r)),
    linear-gradient(to right, var(--color), var(--color)) no-repeat bottom 
      center / calc(100% - 2*var(--r)) var(--line-size);
}

li:nth-child(even)::before {
  background: radial-gradient(
        at top left,
        #F7CE6B calc(var(--r) - var(--line-size) - 1px),
        var(--color) calc(var(--r) - var(--line-size)),
        var(--color) calc(var(--r) - 1px),
        transparent var(--r)
      )
      no-repeat right bottom / var(--r) var(--r),
    radial-gradient(
        at bottom left,
        #9CBBFC calc(var(--r) - var(--line-size) - 1px),
        var(--color) calc(var(--r) - var(--line-size)),
        var(--color) calc(var(--r) - 1px),
        transparent var(--r)
      )
      no-repeat right top / var(--r) var(--r),
    linear-gradient(to bottom, var(--color), var(--color)) no-repeat right 
      center / var(--line-size) calc(100% - 2*var(--r)),
    linear-gradient(to right, var(--color), var(--color)) no-repeat bottom 
      center / calc(100% - 2*var(--r)) var(--line-size);
}