/* Keep the logo and menu visible throughout the page. */
.site-header { position: sticky; top: 0; z-index: 60; }
.site-header .site-header__top { justify-content: space-between; }
.site-header .brand { display: inline-flex; flex: 0 0 auto; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: flex-start; }
.site-header .brand img { order: 0; flex: 0 0 auto; }
.site-header .brand__frequency { order: 1; flex: 0 0 auto; }
html { scroll-padding-top: 160px; }
.article-sidebar { top: 160px; }
@media (min-width: 701px) {
  .nav-wrap .nav-tag { display: none; }
  .main-nav { --menu-gap: clamp(10px, 1.8vw, 28px); flex-wrap: wrap; column-gap: var(--menu-gap); row-gap: 0; }
  .main-nav > a { position: relative; }
  .main-nav > a + a::before { content: ""; position: absolute; left: calc(var(--menu-gap) / -2); top: 50%; width: 1px; height: 18px; background: #fff; transform: translateY(-50%); pointer-events: none; }
}
@media (max-width: 700px) {
  html { scroll-padding-top: 140px; }
  .main-nav { max-height: calc(100dvh - 140px); overflow-y: auto; }
}
@media (max-width: 390px) {
  .site-header .site-header__top { gap: 8px; }
  .site-header .brand { gap: 7px; }
  .site-header .brand img { width: clamp(105px, calc(100vw - 230px), 130px); }
}
