/* Mobile menu (☰). Only active once menu.js has run, so the full menu still shows without JavaScript. */
.menu-btn{display:none}
.has-menu nav[data-menu] .menu-btn{flex:none;width:44px;height:44px;margin-right:-10px;border:0;background:none;border-radius:12px;cursor:pointer;color:inherit;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;-webkit-tap-highlight-color:transparent}
.has-menu nav[data-menu] .menu-btn span{display:block;width:22px;height:2px;border-radius:2px;background:currentColor;transition:transform .25s ease,opacity .2s ease}
.has-menu nav[data-menu].open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.has-menu nav[data-menu].open .menu-btn span:nth-child(2){opacity:0}
.has-menu nav[data-menu].open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.has-menu nav[data-menu] .menu-btn:focus-visible{outline:3px solid #ffc23d;outline-offset:2px}

@media (max-width:960px){
  .has-menu nav[data-menu="ac"] .menu-btn{display:inline-flex;margin-left:auto}
  .has-menu nav[data-menu="ac"] ul{display:none!important}
  .has-menu nav[data-menu="ac"].open ul{display:flex!important}
}
@media (max-width:760px){
  .has-menu nav[data-menu="mc"] .menu-btn{display:inline-flex;margin-left:6px}
  .has-menu nav[data-menu="mc"] .pill{margin-left:auto}
  .has-menu nav[data-menu="mc"] ul{display:none!important}
  .has-menu nav[data-menu="mc"].open ul{display:flex!important}
}
/* the opened panel */
.has-menu nav[data-menu].open ul{position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;margin:0;
  padding:6px max(16px,env(safe-area-inset-left,0px)) 14px;background:#fff;border-bottom:1px solid #e5e5ea;
  box-shadow:0 18px 30px -18px rgba(0,0,0,.25);max-height:calc(100vh - 80px);overflow-y:auto;animation:menuIn .22s ease both}
.has-menu nav[data-menu].open ul li{display:block!important;padding:0!important;border:0!important}
.has-menu nav[data-menu].open ul li + li{border-top:1px solid #f0f0f2!important}
.has-menu nav[data-menu].open ul a{display:block;padding:15px 4px;font-size:18px;font-weight:600;color:#1d1d1f;white-space:normal}
@keyframes menuIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.has-menu nav[data-menu].open ul{animation:none}.has-menu nav[data-menu] .menu-btn span{transition:none}}
