Profile card component challenge using flexbox

Your site looks pretty good. Some feedback I'd give is that you forgot to use overflow: hidden on your body to hide the bottom of the circle. I personally think it would've been better if you used the background-image property to implement the circles. Something like this could have worked:

 background-color: var(--theme-dark-cyan);
  background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg");
  background-repeat: no-repeat, no-repeat;
  background-position: right 52vw bottom 35vh, left 48vw top 52vh;
  /* top img is offset 52 percent of the vw from the right and offset 35 of the vh from the bottom*/
  /* bottom img is offset 48 percent of the vw from the left and offset 52 of the vh from the top*/

With regards to your set up for the profile stats. I believe it would've been better if you did something like this:

   <div class="card_profile_stats">

      <div>
        <h3>80K</h3>
        <p>Followers</p>
      </div>

      <div>
        <h3>803K</h3>
        <p>Likes</p>
      </div>

      <div>
        <h3>1.4K</h3>
        <p>Photos</p>
      </div>

    </div>

Then you could assign display: flex to the .card_profile_stats class, along with justify-content: space-between. You could also add in margins to adjust it to your liking. Structuring your <div> tags and imagining everything in boxes is how I learned to lay stuff out (along with grid and flexbox).

Hope you found this useful 👍