Place two separate logos in the header

I’ve got a bespoke header on my website, which has the title on the left and a graphic logo on the right. This is designed as a single header-sized item.

I’ve noticed that something odd happens when the pages are minimized, or when viewing on a small screen. Most of the website automatically rearranges itself to accommodate the narrowed screen, EXCEPT the header image. It can’t adjust, so it gets squashed inwards, like an accordion.

Is there a way to get around this? I could deselect the smartphone mode, but this would create other problems of course. There doesn’t seem to be a way to upload the header in two different sections.

Many thanks – and thanks also for the latest Mantra updates!
AJ