/* Additive navigation styles. Keep the current site.css and blog table styles. */
.nav-group { position: relative; }
.nav-group > summary {
  cursor: pointer;
  list-style: none;
  padding: .5rem;
  border-radius: 3px;
  color: var(--ink);
  font-family: var(--sans);
  font-size: .85rem;
  font-weight: 500;
  white-space: nowrap;
}
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group > summary::after { content: " ▾"; font-size: .8em; }
.nav-group[open] > summary::after { content: " ▴"; }
.nav-group > summary:hover,
.nav-group[open] > summary { color: var(--nh-blue-deep); background: var(--tint); }
.nav-group__links {
  position: absolute;
  z-index: 105;
  top: 100%;
  left: 0;
  display: grid;
  min-width: 16rem;
  padding: .4rem;
  background: #fff;
  border: 1px solid var(--rule);
  border-radius: 3px;
  box-shadow: var(--shadow);
}
.nav .nav-group__links a { display: block; padding: .65rem .8rem; }
.seo-article-list { padding: 0; margin: 2rem 0; list-style: none; }
.seo-article-list > li { padding: 1.3rem 0; border-top: 1px solid var(--rule); }
.seo-article-list h2 { font-size: 1.22rem; margin: 0 0 .65rem; }
.seo-article-list p { margin: 0 0 .6rem; }
.seo-article-list .seo-article-meta { color: var(--gray); font-size: .85rem; }
.seo-post-links { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--rule); }
@media (max-width: 1240px) {
  .nav { max-height: calc(100dvh - var(--seo-nav-top, 170px)); flex-wrap: nowrap; justify-content: flex-start; overflow-y: auto; overscroll-behavior: contain; }
  .nav > * { flex-shrink: 0; }
  .nav-group > summary { padding: .8rem .2rem; font-size: 1rem; border-bottom: 1px solid var(--rule); }
  .nav-group__links { position: static; min-width: 0; padding: .2rem 0 .5rem 1rem; border: 0; box-shadow: none; }
  .nav .nav-group__links a { white-space: normal; padding: .75rem .5rem; }
}
