Hello Mohammed!
Excellent Job. You pretty much nailed the overall design. I too find it difficult to make it 100% down to the smallest details without the Figma design files.
Regarding media queries, the general practice is to use min-width
. The idea is that you design the website mobile first; meaning the default values (paddings, margins, layouts, etc) are all made to look best on mobile. Then, in a media query, you specify the minimum width at which things should start to change. So for example you would tell it to start expanding some paddings and margins when the width reaches 375px, and then start changing layouts when hitting 700px. So you are always expanding from the smaller sizes, rather than shrinking down to mobile size.
Hope it helps.
Marked as helpful