You can put opacity on the header and maybe you already have, but it wont be evident because theres nothing behind it currently. If you wanted to have the background image behind the header with opacity then you would need to move the entire container of that content below the header higher up. I did it below in the screenshot to demonstrate what it might look like. You might want to do something using position to move the below container up to align with the top of the viewing area, but you would want to make sure that works out for you responsively for mobile as well as any other potential elements around the header that might push things down further, like an additional sale banner at the top you might potentially be using at a later time. You might need a dev for this if you don't have someone on the team who is familiar with code, html, css.
*Please like and accept solution if that's helpful!