Try adding a Header Element, add a comment to the Hero ie <!-- page hero no content --> this will allow the header to work when there is no content required.
On the Site Header options, select merged, and a Offset Site Header Height of 104px thats the height of your navigation.
Then you can change the navigation colors. Lastly just set the display rules for the Product pages and where else you need it.