Desktop First Solution Using HTML CSS

What are you most proud of, and what would you do differently next time?

I developed a static recipe blog website using HTML and CSS. It took for about 1-2 days based on total hours that I was able to commit. But since my main goal is to recreate the website close to the design as closely as possible, so I focused on a desktop-first approach.

I implemented a desktop-first approach using media queries with max-width to make the site responsive. These are the breakpoints I used:

@media (max-width: 1024px) /* Styles for laptops and tablets */

@media (max-width: 768px) /* Styles for tablets */

@media (max-width: 480px) /* Common phones */

@media (max-width: 376px) /* small phones */

However, I need to deepen my understanding of CSS units such as %, px, rem, em, vw, vh to make the layout become more flexible and consistent.