/* Mobile menu, shared by every page with the top nav (nav.js builds it).
   Below 720px the pages hide their text links and keep only the CTA pills;
   this puts every destination back behind one button. */
.nav { position: sticky; }
.nav-burger {
  display: none;
  width: 42px; height: 42px; margin-left: 0.4rem; flex: none;
  border: 2px solid rgba(0,0,0,0.12); border-radius: 12px;
  background: #fff; cursor: pointer;
  align-items: center; justify-content: center; flex-direction: column; gap: 4px;
}
.nav-burger span {
  display: block; width: 18px; height: 2.5px; border-radius: 2px; background: #2C2C2C;
  transition: transform 0.18s, opacity 0.18s;
}
.nav-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
.nav-menu {
  display: none;
  position: absolute; left: 0; right: 0; top: 100%;
  background: #FFF8F0; border-bottom: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 14px 28px rgba(0,0,0,0.12);
  padding: 0.3rem 0 0.8rem;
}
.nav-menu.open { display: block; }
.nav-menu a {
  display: block; padding: 0.85rem 1.5rem;
  color: #2C2C2C; text-decoration: none; font-weight: 800; font-size: 1.05rem;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.nav-menu a:first-child { border-top: none; }
.nav-menu a:hover, .nav-menu a[aria-current="page"] { color: #2D5A27; }
.nav-menu a.cta { color: #B87333; }
@media (max-width: 720px) {
  .nav-burger { display: inline-flex; }
}
@media (min-width: 721px) {
  .nav-menu { display: none !important; }
}