Recipe Page - Semantic HTML markup | React

I'd mainly like feedback on whether the use of HTML tags have been properly used. I have doubts about the usage of <section> tags like this one, and the table tag with regard to the best practices in using them, and any specific syntax I may have missed.

Also, if the use of multiple media queries for some breakpoint as per here, here, and here, so as to keep the conditional styling near the default styles is considered more, or less favorable as compared to keeping a single media query per breakpoint, that includes every conditional style.

Lastly, I was seeing this issue in Edge dev tools:

'meta[name=theme-color]' is not supported by Firefox, Firefox for Android.

It might be due to the meta tag:

<meta name="theme-color" content="#e0e0a0" />

Is there any way to work around this issue? It's not causing any apparent problems, but should some other parameters be written for it? (The major requirement of this tag is to give the browser bar in Chrome mobile the color #e0e0a0.)