Header & Footer Customisation - Help Please

Hi,

I'm completely new to Squarespace and website code so I'd really appreciate the help.

There are a few changes I'd like to make, but don't know how to:

Header - website title on the right
Header - Pages on the left
Footer - Chain icon changed to a white phone handle icon (like this one, for example)
Footer - Social icons to be on the right of the text that's currently above them (email icon on the right of "E-mail", phone handle on the right of "phone number", IG icon on the right of "Instagram"

I'd appreciate the code to be broken down in 2 distinct sections - header & footer. This way I can put the //comment and know what code is for what :)

https://nonagon-heron-h5s3.squarespace.com/
Password = develop

Add to Design > Custom CSS

/* header layout */
.header-title-nav-wrapper {
    flex-direction: row-reverse;
}
.header-nav {
    text-align: left !important;
}

Do you have a footer mockup? We can help easier