I would like to make the header overlap, but when I turn on the overlap options, it will make the product page going to the top(please see the screenshot), how do I fix that?
I suggest you enable the overlap header for specific pages via its settings: https://take.ms/bXTVo , thus the product/shop pages will not have such a problem.
If there’s anything else we can do, please get in touch.