Having ridiculous issues with logo image in header

I've blown a couple of days working on ideas from the forum, SS customer support, and even ChatGPT, and I still can fix this issue.

It's as simple as: 

1. I have a white logo that I want to appear on the background headers.
2. I want its alternate black logo buddy to appear on background-free headers.

The issues have been as follows:

1. Despite being duplicates in every sense (apart from colour), the black logo appears in a different place and size to the (original) white.
2. Now, I cannot adjust the px size of the white logo. It's just big and intransigent.

Surely, this is an easy fix? I've watched several YouTube videos that fix it with one line of code, but whenever I try it, the black logo is smaller and not as far left set as the white.

I'm pulling my hair out and have exhausted all options. Other than redesigning the site from scratch so all page headers have backgrounds (I'd rather not start again).

You can see from the two screen grabs how, on the home page, the image is larger and set further left (and higher). On the About page, however, it's smaller and set lower and further right).

What am I missing here? Is this a page-style setting anomaly? 

🙏🏾

Can you share site url?

Site is in development, so I. can't share the URL yet.

You can follow this to share site url, if site in trial/unpublished