Ciao, non so se hai già modificato qualcosa ma, da quel che vedo, lo sfondo è impostato con background-size:cover; questo significa che l'immagine non è solo ritagliata ma viene comunque scalata in modo da riuscire a coprire sempre l'area dell'elemento in questione.
Se poi il logo va a posizionarsi in modo scoordinato da tale immagine, questo è un altro problema.

Personalmente ti consiglierei di non cercare a tutti i costi "l'incastro" tra logo (intestazione) e immagine di sfondo ma, piuttosto, fai in modo che le due cose restino a se stanti anche se sovrapposte. Ad esempio potresti impostare un box o una fascia semitrasparente al di sotto del logo stesso, in modo che qualunque sia l'immagine che ci sta sotto e qualunque sia la posizione, il logo resti comunque ben distinto e sempre leggibile.

Prova, ad esempio, ad impostare qualcosa del genere all'elemento contenitore del logo, o al tag img stesso (cioè l'elemento img del logo):
codice:
background: rgba(255, 255, 255, .6);
padding: 8px;
Chiaramente è solo un'idea.