/* ═══════════════════════════════════════════
   NAV
═══════════════════════════════════════════ */
nav {
  position:        fixed;
  top:             0;
  left:            0;
  right:           0;
  padding:         24px 40px;
  display:         flex;
  justify-content: space-between;
  align-items:     center;
  z-index:         100;
  mix-blend-mode:  difference;
}

nav .logo {
  display: block;
  height:  40px;
}

nav .logo img {
  height:  100%;
  width:   auto;
  display: block;
  filter:  brightness(0) invert(1);
}

nav ul {
  display:    flex;
  gap:        32px;
  list-style: none;
}

nav ul a {
  color:          var(--c-cream);
  text-decoration: none;
  font-size:      13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  transition:     color .3s;
}

nav ul a:hover,
nav ul a:focus-visible {
  color: var(--c-peach);
}