TESTIMONIAL-GRID-SECTION

Hi. I see that the border on the images are all purple; the original design has only Daniel Clifford border and Partick Adams with borders. The color of Daniel Clifford's border is the color of his "Verified Grafuate".

I would suggest to take <main> tag to wrap every <article> tag. Then

body {
    display: grid;
    place-items: center;
}

Do not give width or height to <main> Or <article> tag. Instead use accurate padding using Paint app. Every article should have class="grid-item-1" and so on. <main> tag is Grid container Use

main {
    max-width: 1120px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, min-content);
    gap: 30px;
}

To make your HTML even more shorter, Structure your <article> Tag like :

    <article class="grid-item1">
      <div class="card-head">
        <img>
        <div class="card-user">
          <span  class="name">Daniel Clifford</span>
          <p class="title">Verified Graduate</p>
        </div>
      </div>
      <h2 class="card-head">
      </h2>
      <p class="detailes">
      </p>
    </article>

Your solution is pretty cool by the way. Happy coding.