Does the display:flex element interfere with mobile adaptation?

Question

css

Hello. In the header of the site, I applied such a property as display: flex to the li elements. There are 3 of them in total. The fact is that when optimizing a site for mobile, they not only do not follow each other, but also overlap each other. Here is the project - https://clck.ru/FKxL7 . I can't figure out how to fix this.

Answer 1

Show the code on codepen, no one will download the archive.
Offhand - in the media query for mobile, specify , or simplyflex-direction: column;flex-wrap: wrap;

Answer 2

Hello. So where is the adaptation for the elements?
And yet, it is desirable to insert li into ul.
A piece of your code on CodePen
https://codepen.io/denys-buhlak/pen/drREbX