2nd attempt to correct

Hello👋!

I reviewed your code and its great but there are changes to made!!!

Optional:Most developers as default and global css they use style.css instead of index.css its not necessary as far as I know but its better

1.Width and height of card needs to be corrected in total it should be width: 320px; and height should be height: 497px; in rems(on default 16px) its width:20rem; height: 31,0625rem;

2. Distance between the text and Qr-code image should be more... It should be 16px or 1rem you can achieve this by putting texts in one div like this:

<div class="container">
    <img src="images/image-qr-code.png" alt="QR code" class="qr"/>
      <div class="text-cont">
             <h1> improve your front-end skills by building projects</h1>
              <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p>
       </div>
  </div>

and add this styles to container in css:

.container {
     display:flex;
     flex-direction: column;
     align-items: center;
     gap: 16px;  /*or 1 rem if you work with rems*/
}

you also should add styles to .text-cont:

.text-cont {
     display:flex;
     flex-direction: column;
     align-items: center;
     gap: 16px;
} 

or to not use extra lines...

.container , .text-cont {
     display:flex;
     flex-direction: column;
     align-items: center;
     gap: 16px;
}

I don't have time to find other issues I hope you figure this out! I hope my comment was helpful. Good Luck In Next Projects!!!! I would appreciate if you mark this comment as helpful!