Mobile first Responsive page with css grid

Hi~ Congrats on finishing this challenge!

One way to solve the hover effect on contact link is by making a new variable with lighter opacity of your --white color like this: --light-white: hsl(0, 0%, 100%, 0.4);. Now you can use this as the background color for hover effect.

._links:last-child:hover {
    color: var(--white);
    background-color: var(--light-white);
}

Also to make your links accessible for screen readers, it's advisable to put discernible text like this <a href="#">Home<a>. But if you'll only put an icon or image you should add aria-label attribute. For example:

<a href="#" aria-label=""Website logo>
     <img src="images/logo.svg" alt="icon">
</a>

If you have any questions you can reach out to me. Hope this helps~ Happy Coding!!