Space tourism website with mobile first workflow, json data fetching

A multipager that I thoroughly enjoyed building!!

Question:

There was an issue in styling the body element towards the end of the project. It appeared, even though after resetting the CSS, there was an odd margin at the top of the body, shifting the entire body down. I tried stackoverflow tricks margin: 0 !important; padding: 0 !important; however, it did not work.

Eventually I got around by adding border-top: 0.001rem solid transparent; Don't like the solution, but it worked.

Can anyone explain why this happened in the first place and solutions please? Thanks and happy coding!