Loading problem in build context

[knupel]

Hello,
I meet a problem with complex components in deployment part, but not in local part.
I will go try to explain clearly as possible the issue.
I coded a navigation bar structured like below : Logo, menu, cart
https://cafe366stan.gatsbyjs.io/
to organize the menu, I used a css grid-template-areas: "logo menu_big cart";
and in my code the component is organize like that

<Logo classNameContainer={logo}/>
<Menu/>
<CartButton quantity={quantity} classNameContainer={cart}/>

the component <Menu/> is the complex one, because to build it, there are elements from Contentful apiand others from Shopify api. When I deploy on gAtsby cloud the project with components in this order, the last component lost the css properties in the first loading or connection on the web site, and every thing back to normal after the first click navigation on the menu.

I used two days to find the solution to solve the problem of first loading / connection. My solution is to change the order of the component like that:

<Logo classNameContainer={logo}/>
<CartButton quantity={quantity} classNameContainer={cart}/>
<Menu/>

I figure that's work because the complex component is build at last moment and all the csscan be apply correctly before work on the next component.
But I don't understand why this problem not appear in local deployment with gatsbt develop only when the site is deployed on server.

For information my project is based on the Shopify-starter and deploy on gatsby cloud.
menu.js
menu.module.css

Et voilà, I want share my problem and the strange solution I founded to avoid it !!!

Thanks for the poject Gatsby... it's awesome :)