.navlinks { display: flex; gap: 22px; align-items: center; }
.navlinks > a, .kdrop-btn {
  font-size: 12px;
  color: rgba(0, 0, 0, .8);
  background: none;
  border: 0;
  padding: 14px 0;
  font-family: inherit;
  cursor: pointer;
  line-height: 1;
}
.kdrop { position: relative; }
.kdrop-btn::after {
  content: "";
  display: inline-block;
  margin-left: 5px;
  border: 3px solid transparent;
  border-top-color: currentColor;
  transform: translateY(1px);
}
.ksub {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 250px;
  padding: 8px;
  padding-top: 14px;
  background: transparent;
  border: 0;
  z-index: 80;
}
.kdrop:hover .ksub, .kdrop:focus-within .ksub, .kdrop.open .ksub { display: block; }
.ksub::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 6px;
  bottom: 0;
  background: #fff;
  border: 1px solid #d2d2d7;
  border-radius: 14px;
  box-shadow: 0 18px 40px -24px rgba(0, 0, 0, .45);
}
.ksub a { display: block; padding: 9px 10px; border-radius: 10px; }
.ksub a:hover { background: #f5f5f7; }
.ksub strong { display: block; color: #1d1d1f; font-size: 13px; font-weight: 600; }
.ksub span { display: block; color: #6e6e73; font-size: 12px; font-weight: 400; margin-top: 2px; }
@media (max-width: 820px) {
  .navlinks.navlinks { display: flex !important; flex-wrap: wrap; gap: 2px 14px; }
  nav > div { height: auto !important; min-height: 44px; padding-top: 8px; padding-bottom: 8px; }
}