HTML, CSS, CSS Variables and Flexbox and Grid

Hey, awesome work on this one. Desktop layout look really great, you could make the upper-right-corner background to be a bit bigger. The mobile state looks great as well but if you go to at 390px below, the screen starts to hide the content and creates a horizontal scrollbar.

Here are some other suggestions for the site:

• For the site-logo, remove the word logo from it since you don't want to include words that relates to graphic such as logo when using alt attribute.
• On the phone-section, the pattern background-image is only decorative so use the alt="" on it. Usually, when you use aria-hidden="true" on an img , you use an empty value for the alt attribute.
• For the phone image, I think you can add a descriptive alt value for it , it could be something like alt="equalizer app running on mobile".

FOOTER

• Same as well for the site-logo, remove the logo word from it.
• For the social-media links, remove the word link from each of the a tag since screen-reader will already announce that it is a link, so use only the social-media's name on it.
• Adding an extra aria-hidden="true" on the img tag for each social media so that it will be totally ignored by screen-reader.

Aside from those, great job again on this one.

Hi! David, really impressive and really good designed and it's responsive too. I checked your code and you really structured your code really well.

Keep it up! ❤️