Landing Page using flexbox & grid, with CSS BEM and SCSS

Hello. Would love to hear your feedback - especially about the photos in hero section which change a lot from mobile/tablet - into desktop version. I have done it on desktop as :after and :before elements with position: abslute . I am not really proud of this solution - in my opinion it looks quite messy. I am still struggling with the inline paddings and media breakpoints. E.g. the design looks good with 1440px width (as in desktop design) and with 768px (tablet design) but i don`t know what to apply with e.g. 1024px (small laptop). Should i consider e.g. using min(XXXvw, XXXrem) value for margins/paddings? I would love to hear any feedback from you about that.