It’s hard to see what was changed in the CSS because you’re using the CSS minifier. Is it possible to turn that off temporarily while we look at the code to fix the issues? That would make it much easier to see what’s going on in the CSS.
If you remove the top: 20px;
from .header-image .site-title > a
in your CSS then it will move the logo back up inside the Black header area –
.header-image .site-title > a {
background-size: contain !important;
display: block;
height: 60px;
text-indent: -9999px;
position: relative;
top: 20px;
}
Then once you scroll down the logo won’t overlap outside the header area into the white space of other sections.