using css grid, css flex, js

Hi, there 👋 Well done!

Mobile navigation menu behaves a bit weird on collapsing. You can fix that by moving some properties from open state to general nav properties:

nav {
+ position: fixed;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 75vw;
+ background-color: var(--off-white);
+ padding: 1.25rem;
  opacity: 0;
  z-index: -1;
  transition: all 0.3s ease-in-out;
}

.nav.open {
  oppacity: 1;
  z-index: 1;
}