HTML, Sass and JS built with a small @keyframe animation on hero image

Hi there! I'm happy to receive feedback on my site. Specific areas I want to focus on are my Sass organisation and responsive breakpoints. I'm still learning to integrate Sass into my workflow and I often doubt whether I'm nesting in an efficient manner. Especially when it comes to the responsive break points. I end up prioritising readability, but find that the resulting css has a lot of duplicate sections. Any advice on how to approach this would be much appreciated.