Media query wont work on mobile

the following file has media query.
When I change the size of the browser, the page layout changes accorfing to the media query.

responsive - Copy.HTML (4.1 KB)

Yet, I recently opened this file on my mobile phone (Galaxy s10+) and the page layout is a desktop layout
Here are horizontal and vertical screensots

Why soesn;t the file open a bobile layout ?

You need the viewport meta tag in the page head.

<meta name=viewport content="width=device-width, initial-scale=1">