Hello Myles,

my answers inline, bolded:

(Animation) Show a different logo upon scroll-down (Desktop & Mobile) 

as I see that you don't have smooth scroll enabled, in /js/scripts.js you need to define an event for scroll that changes the logo as you wish

for example

$(window).scroll(function(){
     if ($(this).scrollTop() some condition here related with scroll top position ) {

         show one logo
     } else {

        show a different logo
     }
});

Make burger menu appear upon scroll-down (Desktop-only)

See above

Add a custom background on Burger menu (Desktop & Mobile)

If this is related with the overlay menu background:

nav.open {
    background-color: Your_color_here !important;
}

Add black & transparent gradient overlay on hero/featured images except on homepage (Desktop & Mobile)

.split-slider #image-slider {
    opacity: 1 !important;
}

in customizer -> additional CSS

Edit "About" page according to attached "Pages.png"

Not sure how you can achieve that

Add custom social media icons (Desktop & Mobile)

you can add different social media in /include/defines.php/ the $grenada_social_links array

Replace colours across website e.g. blacks, greys & whites

The theme comes with two background flavors: light and dark. to change them open /js/scripts.js and change #141414 and #fff between lines 263 and 297