Second menu on nav bar doesn't work well

Hello,

I recently had a client buy Maximenu and mobile menu, but ran into lots of issues during development. Site uses latest Joomla with latest PHP 7.3 and Gantry 5 framework.

First I made a maximenu to replace the main menu. This worked well, except I got problems with positioning when I activated the mobile menu. Its menu bar overlapped and stayed on top of the other elements, like a language bar module that is published in a top row. Only the responsive mode worked ok, but not the mobile menu.

Then I made a menu in Joomla, with a search icon (menutype: separator) and a submenu item also as separator with a search module's ID as name. When I made a maximenu for this, I can't get it to work properly no matter what. When the icon is clicked and the search box appears, although its position is on the top row (same row with the language module) the search box goes underneath the main menu. I tried setting the z-index of the main menu to 1 and the search menu z-index to 10, but it has no effect whatsoever.
Also the search icon menu gets a responsive hamburger icon, even thought its responsive option is not activated.

I include some screenshots, and I appreciate any help to solve this.

Screenshot 1: the search icon, which is set as the parent item of the menu, occupies the full size of its module position block, even if I remove margins, paddings, submenu height/width etc.
Screenshot 2: the search box opens under the other menu of the next row.
Screenshot 3: the search icon menu also gets a responsive hamburger menu, thought it's set to not active in its options (and no mobile menu either).

As a compartison, the following small menu at the top (search box and login module) was made with Maximenu (free version) for another site with similar settings, and worked ok. Here, the Gantry's own navigation bar menu is used and also its own mobile menu.
Screenshot 4: search box appears when search icon is clicked, without going under the second row items.
Screenshot 5: the top row menu remains visible, since its responsive design is not activated. The hamburger menu is from the menu of the next row (Gantry's own).

Hi
It seems that some problems are related to CSS issues (overlap, margins etc)
I'm note sure to understand every point that you mentioned because this is a long text

Please give me the url of the page so that I can check step by step to help you fix all that
CEd

From what I've been able to figure out so far, is that the main maximenu module overlaps everything else, despite having a z-index value of -1. So the second maximenu at the top, even if its z-index is 10 will still slide open underneath the main menu.

If I turn off the main maximenu and go back to Gantry's main menu module, then the top maximenu works ok and slides open above the main menu below it. But with two maximenu modules in the same navigation section, in different rows, for some reason the one that was made first (or has the "home" in it, I don't know) will stay on top of everything else.

I'm testing all these to our development site, not the live one, which isn't accessible for the public. I have made a test account - where can I send you the login details?

please send me the details here
www.joomlack.fr/en/contact

I have sent you by email the solution to add a position:relative; CSS rule on the top menu so that it will be over the second menu

Thanks, this worked immediately.

Now there is only the problem of the top maximenu going into responsive mode, regardless of its options. Here the screenshot from mobile view tests (portrait view, various widths):