.wp-block-navigation ul,
  .wp-block-navigation ul li {
  	list-style: none;
  	padding: 0;
  }

  footer .global-navigation ul {
  	flex-direction: column;
  }

  footer .global-navigation a {
  	font-size: var(--wp--preset--font-size--body);
  }

  .wp-block-navigation__container {
  	padding: 0;
  	display: flex;
  	flex-wrap: wrap;
  }

  .wp-block-navigation__container a {
  	text-decoration: none;
  }

  .global-navigation.branch,
  .global-navigation.branch :is(nav, ul, li, a) {
  	width: 100%;
  	max-width: 100%;
  }

  /* reset lists */
  .mega-menu nav ul,
  .megamenu nav li {
  	margin: 0;
  	padding: 0;
  	list-style: none;
  }

  /* the second-level UL becomes our column grid */
  .mega-menu nav>ul {
  	display: grid;
  	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  	gap: 1rem;
  }

  /* column headings (Volunteer & Intern, Teen Programmes) */
  .mega-menu nav>ul>li>a {
  	display: inline-block;
  	text-transform: uppercase;
  	font-weight: 900;
  	font-size: 0.875rem;
  	/* 14px */
  	color: #004835;
  	border-bottom: 2px solid #004835;
  	padding-bottom: 0.25rem;
  }

  /* the sub-lists inside each column */
  .mega-menu nav>ul>li>ul {
  	margin-top: 1rem;
  }

  /* individual sub-items (Conservation & Environment, etc.) */
  .mega-menu nav>ul>li>ul>li {
  	margin-bottom: 0.75rem;
  }

  .mega-menu nav>ul>li>ul>li>a {
  	display: block;
  	text-decoration: none;
  	text-transform: none;
  	font-weight: normal;
  	font-size: 0.875rem;
  	/* 14px */
  	color: #004835;
  	padding: 0;
  }

  /* hover state for clarity */
  .mega-menu nav>ul>li>ul>li>a:hover {
  	text-decoration: underline;
  }

  .mega-menu .wp-block-navigation-item {
  	display: flex;
  	flex-direction: column;
  	width: 100%;
  }

  .global-navigation.top ul {
  	font-weight: 800;
  	text-transform: uppercase;
  	gap: 1rem;
  }

  /* MOBILE MENU */

  /* Hide all menus by default */

  .mobile-menu-container {
  	.submenu-arrow {
  		align-self: center;
  	}
  }

  .mobile-menu-container li.wp-block-navigation-item {
  	position: initial;
  	width: 100%;
  	display: flex;
  	font-size: 2rem;
  	font-weight: 800;
  	justify-content: space-between;
  }

  .mobile-menu-container ul {
  	gap: 0.5rem;
  }

  .mobile-menu-container ul>li>ul {
  	position: absolute;
  	background: white;
  	top: 0;
  	left: 0;
  	width: 100%;
  	opacity: 0;
  	pointer-events: none;
  	flex-wrap: nowrap;
  }
  
  .mobile-menu-container ul>li>ul.active {
	height: 100%;
	overflow-x: scroll;
  }

  /* 2. but always show level-3 inline */
  .mobile-menu-container ul ul ul {
  	position: static !important;
  	opacity: 1 !important;
  	/* restore normal flow */
  	display: block;
  	height: auto !important;
  	margin-bottom: 1rem;
  }

  /* 3. hide the arrow on items that only link to level-3 */
  .mobile-menu-container ul ul li.has-children>.submenu-arrow {
  	display: none;
  }

  .mobile-menu-container .active {
  	z-index: 9;
  	opacity: 1;
  	pointer-events: all;
  }

  .mobile-menu-container ul ul.active * {
  	pointer-events: all;
  }

  .mobile-menu-container ul ul li {
  	font-size: 1.2rem !important;
  	flex-direction: column;
  }

  .mobile-menu-container nav.global-navigation {
  	height: 67vh;
  	position: relative;
  }

  div#back-to-all.active {
  	display: flex;
  }

  [data-level="1"] {
  	z-index: 3;
  }

  [data-level="2"] {
  	z-index: 6;
  }

  .mobile-menu-container .has-active-child {
  	opacity: 1;
  }

  .mobile-menu-container a {
  	text-decoration: none;
  	width: 100%;
  	padding: 0.5rem 0;
  }

  .small-nav {
  	font-size: 1rem !important;
  	font-weight: 400 !important;
  }

  .mobile-menu-container nav.global-navigation>ul {
  	display: grid !important;
  	grid-template-columns: 1fr 1fr;
  	row-gap: 20px;
  }

  .mobile-menu-container li:not(.small-nav) {
  	grid-column: span 2;
  }

  .mobile-menu-container ul:not(.has-active-child) li:not(.small-nav) {
  	position: relative;
  }

  ul.socials {
  	display: flex;
  	padding: 0;
  	list-style: none;
  	gap: 1rem;
  }

  ul.socials a {
  	display: flex;
  }

  .mobile-menu-container ul ul li li a {
  	font-weight: 200 !important;
  	padding: 0 !important;
  }

  .mobile-menu-container .submenu-arrow {
	min-width: 44px;/* WCAG AAA min size */
    min-height: 44px;/* WCAG AAA min size */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }