Responsive product page using GRID

My approach

Picked up another easy looking challenge which did not have a lot of issues. I was going to use grid for this but realised midway that block level elements do the trick with good padding and margin rules. I still need to figure out how to margin and padding is going to work when we are switching view. For this one, I went from desktop to mobile instead of the other way around.

Some questions and notes I had for the community:

1. Is this approach feasible? I need to figure out how do people work with their margins and padding while designing things.
2. I'll pick a bit more difficult next project to understand the usage of grid and get better at responsiveness in general.
3. Need to figure out why my firefox dev console shows a different view compared to when I actually use my phone to see it.