.site-nav{margin-bottom:20px;border:1px solid var(--line);background:var(--window);box-shadow:8px 8px 0 var(--shadow)}
.site-nav__bar{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:8px 12px;border-bottom:1px solid var(--line);font-family:var(--font-ui);
  background:repeating-linear-gradient(to bottom, color-mix(in srgb, var(--accent) 14%, white) 0, color-mix(in srgb, var(--accent) 14%, white) 3px, color-mix(in srgb, var(--accent) 8%, white) 3px, color-mix(in srgb, var(--accent) 8%, white) 6px);
}
.site-nav__brand{margin:0;font-size:.95rem;font-weight:700;letter-spacing:.04em}
.site-nav__toggle{border:1px solid var(--line);background:var(--window-2);padding:6px 10px;font-family:var(--font-ui)}
.site-nav__toggle{display:none}
.site-nav__menu{display:flex;flex-wrap:wrap;gap:8px;padding:12px;align-items:flex-start}
.site-nav__menu > a,.site-nav__submenu a,.site-nav__item > a{text-decoration:none;padding:8px 10px;border:1px solid transparent;font-family:var(--font-ui);font-size:.9rem;display:block}
.site-nav__menu > a:hover,.site-nav__menu > a[aria-current="page"],.site-nav__item > a:hover,.site-nav__item > a[aria-current="page"],.site-nav__submenu a:hover,.site-nav__submenu a[aria-current="page"]{border-color:var(--line);background:var(--window-2)}
.site-nav__item{position:relative;display:inline-flex;align-items:stretch;width:max-content}
.site-nav__item > a{padding-bottom:18px}
.site-nav__submenu-toggle{position:absolute;left:10px;right:10px;bottom:6px;height:8px;padding:0;border:none;background:transparent;box-shadow:none;cursor:pointer}
.site-nav__submenu-toggle::before{content:"";display:block;width:100%;height:4px;border:1px solid var(--line);background:color-mix(in srgb, var(--accent) 18%, var(--window-2));opacity:.85;transition:background .16s ease, transform .16s ease, box-shadow .16s ease, opacity .16s ease}
.site-nav__submenu-toggle:hover::before,.site-nav__item.is-open .site-nav__submenu-toggle::before,.site-nav__item.has-submenu:hover .site-nav__submenu-toggle::before{background:color-mix(in srgb, var(--accent-2) 72%, white 28%);opacity:1;transform:translate(0,1px)}
.site-nav__submenu-toggle:focus-visible{outline:1px solid var(--line);outline-offset:2px}
.site-nav__submenu{display:none;position:absolute;top:calc(100% + 2px);left:0;min-width:240px;border:1px solid var(--line);background:var(--window);box-shadow:8px 8px 0 var(--shadow);padding:6px;z-index:10}
.site-nav__item.is-open .site-nav__submenu{display:block}
@media (hover:hover){.site-nav__item.has-submenu:hover .site-nav__submenu{display:block}}
@media (max-width: 640px){
  .site-nav__toggle{display:inline-block}
  .site-nav__menu{display:none;flex-direction:column;align-items:stretch}
  .site-nav.is-open .site-nav__menu{display:flex}
  .site-nav__item{display:flex;flex-direction:column;width:100%}
  .site-nav__item > a{width:100%}
  .site-nav__submenu-toggle{left:10px;right:10px;bottom:6px}
  .site-nav__submenu{position:static;box-shadow:none;min-width:0;margin-top:4px}
}