/* Shared mobile navigation. Every page has the same .nav pill; below 860px the link list is hidden by each
   page's own CSS and this file adds a menu button (injected by nav.js) that opens the list as a panel under
   the pill. Loaded after each page's styles so these rules win. */
.nav .navtoggle{display:none}
@media (max-width:860px){
  .nav{flex-wrap:wrap}
  .nav .brand{order:1}
  .nav .navtoggle{order:2;display:inline-grid;place-items:center;width:40px;height:40px;margin-left:auto;border:0;border-radius:50%;background:var(--forest,#1F5A3A);cursor:pointer;padding:0;position:relative}
  .nav .navtoggle i{position:absolute;left:12px;width:16px;height:2px;border-radius:2px;background:#fff;transition:transform .25s,opacity .2s,top .25s}
  .nav .navtoggle i:nth-child(1){top:14px}.nav .navtoggle i:nth-child(2){top:19px}.nav .navtoggle i:nth-child(3){top:24px}
  .nav.open .navtoggle i:nth-child(1){top:19px;transform:rotate(45deg)}.nav.open .navtoggle i:nth-child(2){opacity:0}.nav.open .navtoggle i:nth-child(3){top:19px;transform:rotate(-45deg)}
  .nav ul{display:none}
  .nav.open{border-radius:26px;background:rgba(251,250,245,.98)}
  .nav.open ul{order:3;display:flex;flex-direction:column;align-items:stretch;gap:2px;width:100%;margin:10px -4px 0;padding:10px 0 4px;border-top:1px solid rgba(20,38,27,.08);font-size:16px}
  .nav.open ul li,.nav.open ul li:not(:last-child){display:block}
  .nav.open ul li a{display:block;padding:12px 14px;border-radius:14px;color:var(--ink,#14261B);font-weight:500}
  .nav.open ul li a:hover{background:rgba(20,38,27,.05);text-decoration:none}
  .nav.open ul li a[aria-current]{color:var(--forest,#1F5A3A);font-weight:600}
  .nav.open ul li:last-child a{text-align:center;margin-top:8px;background:var(--forest,#1F5A3A);color:#fff;font-weight:600}
}
@media (max-width:480px){.nav .brand span{display:none}}
