/* Shared mobile masthead menu. Visible only at <=820px; desktop unchanged. */
.mh-menu{
  display:none;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  color:var(--sb-ink);
  cursor:pointer;
  flex-shrink:0;
  -webkit-appearance:none;
  appearance:none;
}
.mh-menu::before{
  content:"";
  display:block;
  width:18px;
  height:2px;
  background:currentColor;
  box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor;
}
.mh-menu:focus-visible{
  outline:2px solid var(--sb-copper);
  outline-offset:2px;
}
@media (max-width:820px){
  .mh-menu{display:inline-flex;margin-left:auto;}
  .mh-nav{margin-left:0;}
}

.mh-panel{
  display:none;
  background:var(--sb-page);
  border-top:1px solid var(--sb-rule);
  border-bottom:1px solid var(--sb-rule);
  padding:6px 0 10px;
}
.mh-panel:not([hidden]){
  display:block;
}
.mh-panel a{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  box-sizing:border-box;
  min-height:44px;
  margin:0;
  padding:0 clamp(18px,4vw,36px);
  border:0;
  border-radius:0;
  background:transparent;
  font-family:var(--sb-f-sans);
  font-size:15px;
  font-weight:500;
  color:var(--sb-ink);
  text-decoration:none;
  box-shadow:none;
  width:100%;
}
.mh-panel a:hover,
.mh-panel a:focus-visible{
  color:var(--sb-copper);
  text-decoration:none;
  outline:none;
}
.mh-panel a.btn,
.mh-panel a.btn.primary,
.mh-panel a.btn.secondary{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  margin:0;
  padding:0 clamp(18px,4vw,36px);
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-family:var(--sb-f-sans);
  font-size:15px;
  font-weight:600;
  text-decoration:none;
}
.mh-panel a.btn.primary{
  color:var(--sb-copper);
}
.mh-panel a.btn.secondary{
  color:var(--sb-oak);
}
