Recipe Page - Beginner HTML, CSS project with basic responsiveness

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

I'm proud of producing a solution that is as close to the original design as possible.

One thing I would do differently is that instead jumping into coding immediately, I would note down common styles and plan the approach better.

What challenges did you encounter, and how did you overcome them?

I struggled with understanding how, when working on the mobile view, the list-items would overflow outside the parent's reduced width, where any other element's width would be self-corrected.

Ultimately, it took a lot of inspection of the html elements to realize that the list item was inheriting its width from the parent, but would get pushed to the right by the list marker.

What specific areas of your project would you like help with?

I would like general feedback on my CSS, if I am accidentally using any anti-patterns (such as using the wrong size units).

I would also like to know if I have made the right decisions with regard to html tags. Especially in the nutrition section, I went for a header-less table instead of a regular div grid, for which I had to write custom CSS just for the last column and last row. I did this because my understanding is that it helps accessibility, but I would like confirmation from a more experienced reviewer.