.nav-toggle{
  display:none;width:44px;height:44px;align-items:center;justify-content:center;
  padding:0;border:1px solid var(--line2);border-radius:3px;background:transparent;
  color:var(--ink);cursor:pointer;
}
.nav-toggle svg{width:20px;height:20px}
.nav-toggle .nav-close{display:none}
.nav-toggle[aria-expanded="true"] .nav-open{display:none}
.nav-toggle[aria-expanded="true"] .nav-close{display:block}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

@media (max-width:879px){
  nav.wrap{position:relative;gap:10px}
  .nav-toggle{display:inline-flex;margin-left:auto}
  .nav-links{
    display:none;position:absolute;left:20px;right:20px;top:calc(100% + 1px);
    padding:12px;background:var(--surface);border:1px solid var(--line);
    box-shadow:0 16px 34px rgba(23,27,29,.12);z-index:60;
  }
  .nav-links.is-open{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .nav-links a{display:flex;align-items:center;min-height:48px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .nav-links a:last-child{border-bottom:0}
  .nav-cta{min-height:44px}
}

@media (max-width:360px){
  nav.wrap{padding-left:16px;padding-right:16px}
  .nav-links{left:16px;right:16px}
  .nav-cta{padding-left:12px;padding-right:12px}
}

@media (prefers-reduced-motion:reduce){.nav-toggle{transition:none}}