.mw-vert-nav {
  /* Animation variables (set inline by module) */
  --mw-nav-anim: 300ms;
  --mw-nav-stagger: 60ms;
  /* Hamburger CSS variables (optional; set inline by module when provided) */
  --mw-burger-size: 40px;
  --mw-burger-thickness: 2px;
  --mw-burger-gap: 6px;
  --mw-burger-color: currentColor; /* falls back to text/link color */
}

.mw-vert-nav .mw-vert-nav__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.mw-vert-nav .mw-vert-nav__title {
  font-weight: 600;
}

/* Hamburger */
.mw-vert-nav .mw-vert-nav__burger {
  display: none; /* shown under breakpoint via .is-collapsible */
  width: var(--mw-burger-size);
  height: calc(var(--mw-burger-gap) * 2 + var(--mw-burger-thickness) * 3 + 8px);
  background: transparent;
  border: 0;
  padding: 4px;
  cursor: pointer;
}
.mw-vert-nav .mw-vert-nav__burger span {
  display: block;
  height: var(--mw-burger-thickness);
  width: 100%;
  background: var(--mw-burger-color);
  margin: var(--mw-burger-gap) 0;
  transition: transform .2s ease, opacity .2s ease, background .2s ease;
}
.mw-vert-nav.is-open .mw-vert-nav__burger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.mw-vert-nav.is-open .mw-vert-nav__burger span:nth-child(2) { opacity: 0; }
.mw-vert-nav.is-open .mw-vert-nav__burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* List layout */
.mw-vert-nav .mw-vert-nav__wrap { margin-top: .5rem; }
.mw-vert-nav .mw-vert-nav-list { list-style: none; margin: 0; padding: 0; }
.mw-vert-nav .mw-vert-nav-list > li { display: block; }
.mw-vert-nav .mw-vert-nav-list a,
.mw-vert-nav .mw-vert-nav-list .menu-item > a {
  display: block;
  text-decoration: none;
  padding: .35rem 0;
  transition: color .2s ease;
}
/* Link colors, hover, and active states are controlled by Divi Design tab (Advanced > Fonts: Menu Links) */

/* Per-item animation states */
.mw-vert-nav .mw-vert-nav-list > li {
  opacity: 1;
  transform: none;
  transition: opacity var(--mw-nav-anim) ease, transform var(--mw-nav-anim) ease;
}

/* Collapsible behavior under breakpoint */
.mw-vert-nav.is-collapsible .mw-vert-nav__burger { display: inline-block; }
.mw-vert-nav.is-collapsible .mw-vert-nav__wrap { display: none; }
.mw-vert-nav.is-collapsible.is-open .mw-vert-nav__wrap { display: block; }

/* While opening, animate items in with stagger (JS sets transition-delay) */
.mw-vert-nav.is-collapsible.is-opening .mw-vert-nav-list > li { opacity: 1; transform: none; }
.mw-vert-nav.is-collapsible:not(.is-open) .mw-vert-nav-list > li,
.mw-vert-nav.is-collapsible.is-closing .mw-vert-nav-list > li { opacity: 0; transform: translateY(8px); }

/* Burger alignment helpers */
.mw-vert-nav.burger-left .mw-vert-nav__header { justify-content: space-between; }
.mw-vert-nav.burger-left .mw-vert-nav__burger { order: 0; }
.mw-vert-nav.burger-left .mw-vert-nav__title { order: 1; }
.mw-vert-nav.burger-right .mw-vert-nav__burger { order: 1; }
.mw-vert-nav.burger-right .mw-vert-nav__title { order: 0; }

/* Desktop (above breakpoint) always visible, no burger */
@media (min-width: 0px) {
  /* The JS toggles .is-collapsible based on data-mw-nav-breakpoint; we don't hardcode a media query number here. */
}
