Just the basics of HTML and CSS were used

Greetings! you have done a great job 😎

📌 Some accessibility and semantics recommendations for your HTML

• To improve the semantics of your HTML, you can change your <div class="attribution"> to a <footer class="attribution">
• I think that in this case it is not correct to use figure and figcaption. But I'll leave that to your discretion
• You can apply display: block to the image to remove the white space generated underneath. Although visually in this case it is irrelevant, it helps you better calculate the space with other elements
• Instead of using margin to center your content in the center of the screen, you can use the flexbox properties in the body:

body {
      background-color: hsl(212, 45%, 89%)
      min-height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      gap: 20px; /* Separate the main from the footer */
}