How to adjust main site header so my logo appears to float above content?

Hello, I was previously starting to design my site in a different application until I discovered Squarespace.

However I was previously able to make my logo in my header appear on top (or in the foreground) of my main content and also allow it to stick in position.

Is it possible to do this in Squarespace?

Please do check the video of my old work: 

Also this is the link to the current page I am working on: https://bluebird-porcupine-yzdg.squarespace.com/home-v7

Password is: squarespace

NOTE: I would like my brand logo the same position in my video i.e. to the left with the page links, cart and login button to the right.

Many thanks in advance,

Best,

Faizal

This may be the place to start:

https://www.webdesignbyanthony.com.au/blog/sticky-nav-transparent-header-squarespace 

and this as well: https://stackoverflow.com/questions/32099022/sticky-header-that-is-transparent-over-main-banner

Thanks very much Derrick,

So I found the code useful as it makes my header sticky:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    if(window.location.href.indexOf("search") > -1) {
       var editCSS = document.createElement('style');
        editCSS.innerHTML = ".sqs-search-page-input {margin-top: 50px;} .Header { background-color: white !important; }";
        document.body.appendChild(editCSS);
    }
});
</script>

But I didn't know if I should add the next code as the document you shared states that it will turn my header from transparent to white.

I want to keep the header transparent.

I also notice that since I've added this code in my Page Settings / Advance, I notice now that some earlier code is now permanent on my homepage top even when I sign out and check the live site.

Please advise.

Sorry - I'm not at all confident with code.

Best,

Faizal