Need help with flex , specifically flex wrap usage on my project

I was checking out how responsive the above webpage I made is Project Link
I’m using flex wrap to get the elements aligned in a column when the width is less than 600px
But I want the nav-bar to be in the next line at 600px itself, but it gets wrapped to next line when the width is 362px
so until 363px, the nav-bar is compressed and in the same line as the logo and heading
How can I get it to wrap to next line at 600px itself

Just an idea… Have you tried adding flex-direction: column in the media query and see what happens?
Not sure it would work.