@jjdavenport
Posted
The solution does include semantic html, its clear and readable, could be improved by using the <dialog> element for the mobile menu and removing any unnecessarycode like the commented out section. The page is accessible however could be improved with aria-labels. The reason the overlay doesnt cover the entire viewport is because you mobile site has overflow although this is not a problem because it has enough content that the user needs to scroll on most viewports. In terms of z-index, think of it as layering your elements the higher the z-index the higher the layer your element will apear on, so its best to set the overlay and nav at a higher z-index for example. The only way the site differs from the design significantly is the font-family.
Well done!