/**
 * Mega Menu Styles
 * 
 * Two-column navigation with parent triggers (left) and children panels (right).
 * Parent and children live in separate DOM containers; ARIA attributes maintain
 * the accessible relationship between triggers and their panels.
 * All selectors are scoped with .mmenu to prevent conflicts.
 */

/* ==========================================================================
   CSS Custom Properties
   ========================================================================== */

.mmenu {
  --mmenu-color-text: var(--bricks-color-vvfxkt);
  --mmenu-color-text-hover: var(--bricks-color-nsotcn);
  --mmenu-color-bg-primary: var(--bricks-color-bzgodp);
  --mmenu-color-bg-secondary: var(--bricks-color-kjudao);
  --mmenu-color-border: var(--bricks-color-bvgnlo);
  --mmenu-font-family: "Roboto Serif", Georgia, serif;
  --mmenu-font-size-base: 44px;
  --mmenu-font-size-secondary: 28px;
  --mmenu-font-size-tertiary: 0.2px;
  --mmenu-spacing-xs: 0.5rem;
  --mmenu-spacing-sm: 0.75rem;
  --mmenu-spacing-md: 1rem;
  --mmenu-spacing-lg: 1.5rem;
  --mmenu-spacing-xl: 2rem;
  --mmenu-transition-speed: 200ms;
  --mmenu-transition-easing: ease-in-out;
  --mmenu-primary-width: 510px;
  --mmenu-secondary-width: 460px;
}

/* ==========================================================================
   Base Container
   ========================================================================== */

.mmenu {
  /* Desktop/p1 */
  font-family: "Mulish";
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 30px */
  flex-grow: 1;

  /* border: 1px solid green; */
}

.mmenu__container {
  display: flex;
  flex-direction: column;
  min-height: 400px;
  position: relative;
  height: 100%;
}

/* Desktop: Two-column layout via flex children */
@media (min-width: 768px) {
  .mmenu__container {
    flex-direction: row;
  }
}

/* ==========================================================================
   Parent Container (left column) – holds primary trigger buttons
   ========================================================================== */

.mmenu__parent-container {
  background-color: var(--mmenu-color-bg-primary);
  position: relative;
  z-index: 1;
}

@media (min-width: 768px) {
  .mmenu__parent-container {
    width: var(--mmenu-primary-width);
    flex-shrink: 0;
  }
}

/* ==========================================================================
   Children Container (right column) – holds all submenu panels
   ========================================================================== */

.mmenu__children-container {
  background-color: var(--mmenu-color-bg-secondary);
  position: relative;
  z-index: 1;
  flex-grow: 1;
}

@media (min-width: 768px) {
  .mmenu__children-container {
    width: var(--mmenu-secondary-width);
  }
}

/* Reduced sizes for medium screens */
@media (min-width: 768px) and (max-width: 1199px) {
  .mmenu {
    --mmenu-primary-width: 380px;
    --mmenu-secondary-width: 340px;
  }
}

/* ==========================================================================
   Primary List
   ========================================================================== */

.mmenu__primary-list {
  list-style: none;
  margin: 0;
  padding: var(--mmenu-spacing-lg);
  font-family: "Roboto Serif", Georgia, serif;
}

@media (min-width: 768px) {
  .mmenu__primary-list {
    padding: 48px; /* 72px var(--mmenu-spacing-xl); */
    padding-left:0;
  }
}

.mmenu__primary-item {
  /* margin-bottom: 5px; */
  margin-bottom: 0;
   /* var(--mmenu-spacing-md); */
  /* position: relative; */
}

.mmenu__primary-item:last-child {
  margin-bottom: 0;
}

/* Bullet point indicator for active item */
.mmenu__primary-item--active .mmenu__primary-link::before {
  content: "•";
  position: absolute;
  left: -35px;
  top: 7px;
  color: var(--mmenu-color-text);
  font-size: 42px;
  line-height: 1; 
}
.mmenu__primary-item--current-ancestor .mmenu__primary-link::before {
  content: "◦";
  position: absolute;
  left: -35px;
  top: 7px;
  color: var(--mmenu-color-text);
  font-size: 42px;
  line-height: 1; 
}

.mmenu__primary-link {
  display: block;
  width: 100%;
  background: none;
  border: none;
  padding: var(--mmenu-spacing-xs) 0;
  color: var(--mmenu-color-text);
  font-family: var(--mmenu-font-family);
  text-align: left;
  cursor: pointer;
  transition: color var(--mmenu-transition-speed) var(--mmenu-transition-easing);


  font-weight: 500;
  line-height: 54px;
  position: relative;
  /* font-size: 32px; */
  font-size: 28px;
  font-style: normal;
  font-weight: 300;
  line-height: 45px;
}

.mmenu__primary-item--current-ancestor .mmenu__primary-link,
.mmenu__primary-item--current-parent .mmenu__primary-link {
  font-weight: 500;
  
  color: var(--mmenu-color-text);
}


/* @media (min-width: 768px) and (max-width: 1199px) {
  .mmenu__primary-link {
    font-size: 36px;
    line-height: 44px;
  }
} */

.mmenu__primary-link:hover,
.mmenu__primary-link:focus {
  color: var(--mmenu-color-text-hover);
  outline: none;
}

.mmenu__primary-link:focus-visible {
  outline: 2px solid var(--mmenu-color-text);
  outline-offset: 2px;
}

.mmenu__primary-item--active .mmenu__primary-link {
  font-style: italic;
  font-weight: 600;
  color:var(--bricks-color-nsotcn);
}

/* ==========================================================================
   Submenu Panel (inside Children Container)
   Only the active panel is shown; container grows to fit its content.
   ========================================================================== */

.mmenu__submenu-panel {
  display: none;
  padding: var(--mmenu-spacing-lg);
  font-family: "Mulish", sans-serif;
  /* border: 1px solid magenta; */
}

.mmenu__submenu-panel--active,
.mmenu__submenu-panel[aria-hidden="false"] {
  display: block;
}

@media (min-width: 768px) {
  .mmenu__submenu-panel {
    padding: 48px; 
     /* 72px var(--mmenu-spacing-xl); */
  }
}

.mmenu__secondary-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mmenu__secondary-item {
  margin-bottom: 0;/* var(--mmenu-spacing-sm); */
}

.mmenu__secondary-item:last-child {
  margin-bottom: 0;
}

.mmenu__secondary-link {
  /* display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--mmenu-spacing-sm);
  width: 100%;
  background: none;
  border: none;
  padding: var(--mmenu-spacing-xs) 0;
  color: var(--mmenu-color-text);
  font-family: "Mulish", sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 400;
  line-height: 35px;
  letter-spacing: -0.56px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: color var(--mmenu-transition-speed) var(--mmenu-transition-easing); */

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--mmenu-spacing-sm);
  width: 100%;
  background: none;
  border: none;
  padding: 5px 0px;
  color: var(--mmenu-color-text);
  font-family: "Mulish", sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: 29px;
  letter-spacing: -0.56px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: color var(--mmenu-transition-speed) var(--mmenu-transition-easing);
}

@media (min-width: 768px) and (max-width: 1199px) {
  .mmenu__secondary-link {
    font-size: 22px;
    line-height: 28px;
  }

}

.mmenu__secondary-link:hover,
.mmenu__secondary-link:focus {
  color: var(--mmenu-color-text-hover);
  outline: none;
}

.mmenu__secondary-link:focus-visible {
  outline: 2px solid var(--mmenu-color-text);
  outline-offset: 2px;
}

.mmenu__secondary-link--expanded {
  font-family: "Roboto Serif", Georgia, serif;
  font-size: 28px;
  font-style: italic;
  font-weight: 600;
  line-height: 35px; /* 125% */
  letter-spacing: -0.56px;
}

@media (min-width: 768px) and (max-width: 1199px) {


  .mmenu__secondary-link--expanded {
    font-size: 22px;
    line-height: 28px;
  }
}

/* Expandable secondary items (with children) */
/* .mmenu__secondary-link--expandable {
    font-weight: 500;
    font-style: italic;
} */

/* Chevron Icon */
.mmenu__chevron {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  transition: transform var(--mmenu-transition-speed)
    var(--mmenu-transition-easing);
  transform: rotate(-90deg);
}

.mmenu__chevron svg {
  width: 100%;
  height: 100%;
}

/* Rotate chevron when expanded */
.mmenu__secondary-link--expanded .mmenu__chevron {
  transform: rotate(0deg);
}

/* ==========================================================================
   Tertiary Level (Third Level)
   ========================================================================== */

.mmenu__tertiary-list {
  list-style: none;
  margin: 0;
  padding: 0;
  /* padding-left: var(--mmenu-spacing-md); */
  padding-left:25px;
  margin-top: var(--mmenu-spacing-xs);
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height var(--mmenu-transition-speed)
      var(--mmenu-transition-easing),
    opacity var(--mmenu-transition-speed) var(--mmenu-transition-easing),
    margin-top var(--mmenu-transition-speed) var(--mmenu-transition-easing);
}

.mmenu__tertiary-list[aria-hidden="false"] {
  max-height: 250px;
  opacity: 1;
  margin-top: 0; /* var(--mmenu-spacing-sm); */
  margin-bottom:16px;
}

.mmenu__tertiary-item {
  margin-bottom:0; /* var(--mmenu-spacing-xs); */
}

.mmenu__tertiary-item:last-child {
  margin-bottom: 0;
}


/* If secondary links need a sub-title, wrap in a span.smaller which will use this styling */
.mmenu__tertiary-link,
.mmenu__secondary-link .smaller
 {
  display: block;
  /* padding: var(--mmenu-spacing-xs) 0; */
  color: var(--mmenu-color-text);
  font-family: Mulish, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
  text-decoration: none;
  transition: color var(--mmenu-transition-speed) var(--mmenu-transition-easing);
}

@media (min-width: 768px) and (max-width: 1199px) {
  .mmenu__tertiary-link,
 .mmenu__secondary-link .smaller {
    font-size: 16px;
  }
}




.mmenu__tertiary-link:hover,
.mmenu__tertiary-link:focus {
  color: var(--mmenu-color-text-hover);
  outline: none;
}

.mmenu__tertiary-link:focus-visible {
  outline: 2px solid var(--mmenu-color-text);
  outline-offset: 2px;
}

/* ==========================================================================
   Current Page Trail
   Highlights the active breadcrumb path through all three menu levels.
   --current:          the item IS the current page
   --current-ancestor: an ancestor of the current page (grandparent+)
   --current-parent:   the direct parent of the current page
   ========================================================================== */

/* --- Primary level (mirrors the --active open style) --- */
/*
.mmenu__primary-item--current .mmenu__primary-link,
.mmenu__primary-item--current-ancestor .mmenu__primary-link,
.mmenu__primary-item--current-parent .mmenu__primary-link {
  font-style: italic;
  font-weight: 600;
  color:var(--bricks-color-vvfxkt);
}
*/
/* Bullet indicator for current trail (same as --active bullet) */
/* .mmenu__primary-item--current .mmenu__primary-link::before,
.mmenu__primary-item--current-ancestor .mmenu__primary-link::before,
.mmenu__primary-item--current-parent .mmenu__primary-link::before {
  content: "•";
  position: absolute;
  left: calc(-1 * var(--mmenu-spacing-md));
  top: 0.15em;
  color: var(--mmenu-color-text);
  font-size: 1.25em;
  line-height: 1;
} */

/* --- Secondary level --- */

.mmenu__secondary-item--current .mmenu__secondary-link,
.mmenu__secondary-item--current-ancestor .mmenu__secondary-link,
.mmenu__secondary-item--current-parent .mmenu__secondary-link {
  /* font-family: "Roboto Serif", Georgia, serif; */
  /* font-style: italic; */
  font-weight: 700;
  /* color: var(--bricks-color-nsotcn); */
}


/* --- Tertiary level --- */
.mmenu__tertiary-item--current .mmenu__tertiary-link {
  font-weight: 700;
  color: var(--bricks-color-nsotcn);
}

/* ==========================================================================
   Mobile Responsive Adjustments
   ========================================================================== */

@media (max-width: 767px) {
  .mmenu__container {
    min-height: auto;
  }

  .mmenu__parent-container {
    background-color: var(--mmenu-color-bg-primary);
  }

  .mmenu__children-container {
    background-color: var(--mmenu-color-bg-secondary);
  }

  .mmenu__primary-item {
    border-bottom: 1px solid var(--mmenu-color-border);
  }

  .mmenu__primary-item:last-child {
    border-bottom: none;
  }

  .mmenu__primary-link {
    font-size: 28px;
    line-height: 36px;
  }

  /* Mobile: Submenu panel fills full width of children container */
  .mmenu__submenu-panel {
    width: 100%;
    padding: var(--mmenu-spacing-md);
  }

  .mmenu__secondary-link {
    font-size: 20px;
    line-height: 28px;
  }

  .mmenu__tertiary-link {
    font-size: 16px;
  }
}

/* ==========================================================================
   Accessibility Enhancements
   ========================================================================== */

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  .mmenu__chevron,
  .mmenu__tertiary-list,
  .mmenu__primary-link,
  .mmenu__secondary-link,
  .mmenu__tertiary-link {
    transition: none;
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .mmenu__primary-link:focus-visible,
  .mmenu__secondary-link:focus-visible,
  .mmenu__tertiary-link:focus-visible {
    outline-width: 3px;
  }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
  .mmenu__container {
    display: block;
  }

  .mmenu__parent-container,
  .mmenu__children-container {
    width: 100%;
    background: none;
  }

  .mmenu__primary-list {
    padding: 0;
  }

  .mmenu__submenu-panel {
    display: block !important;
    background: none;
    padding: 0;
    padding-left: var(--mmenu-spacing-lg);
  }

  .mmenu__tertiary-list {
    display: block !important;
    max-height: none !important;
    opacity: 1 !important;
  }

  .mmenu__chevron {
    display: none;
  }
}


  body.mega-menu-open   #brx-header::before {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    background-color:rgba(0, 0, 0, 0.5);
  }
  #brx-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom:0;
    width:100%;
    height:100%;
    background-color:rgba(0, 0, 0, 0);
    z-index: -1; /* Just below the header */
    transition:backdrop-filter 0.5s ease, -webkit-backdrop-filter 0.5s ease, background-color 0.5s ease;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }


/* 


Mobile 


*/

/* Lock body scroll when mega menu is open */

@media (max-width: 767px) {
  body {
    --mmenu-admin-bar-offset: 0px;
  }

  body.admin-bar {
    --mmenu-admin-bar-offset: 46px;
  }

  body.mega-menu-open {
    overflow: hidden;
    height: 100vh;
    height: 100dvh;
  }

  /* Make the mobile menu container a viewport takeover panel */
  body.mega-menu-open #brx-header {
    position: fixed;
    top: var(--mmenu-admin-bar-offset);
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 9999;
    /* max-height: calc(100vh - 70px);
    max-height: calc(100dvh - 70px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 9999; */
  }

  body.mega-menu-open .mobile-menu-container {
    max-height: calc(100vh - 70px - var(--mmenu-admin-bar-offset));
    max-height: calc(100dvh - 70px - var(--mmenu-admin-bar-offset));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  } 
  body.mega-menu-open   #brx-header::before {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    background-color:rgba(0, 0, 0, 0.5);
  }
  #brx-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom:0;
    width:100%;
    height:100%;
    background-color:rgba(0, 0, 0, 0);
    z-index: -1; /* Just below the header */
    transition:backdrop-filter 0.5s ease, -webkit-backdrop-filter 0.5s ease, background-color 0.5s ease;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
}

/* body.mega-menu-open {
  overflow: hidden;
  height: 100vh;
  height: 100dvh;
}


body.mega-menu-open .mobile-menu-container {
  max-height: calc(100vh - 70px);
  max-height: calc(100dvh - 70px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
} */

.mobile-menu {
    padding: 25px;
    width: 100%;
}


.mobile-menu  .bricks-nav-menu-wrapper {
  width:100%;
}

/* :where(.brxe-nav-menu.mobile-menu) .bricks-nav-menu>li {
  margin-left:0;
} */

.mobile-menu-container .omnipresent-menu-container {
  width:100%;
}


.brxe-nav-menu.mobile-menu .bricks-nav-menu>li {
margin-left: 0;
margin-bottom: 12px;
}
    

.brxe-nav-menu.mobile-menu .bricks-nav-menu>li > a,
.brxe-nav-menu.mobile-menu .bricks-nav-menu>li > .brx-submenu-toggle > a {
  font-family: Mulish;
  font-size: 22px;
  font-style: normal;
  font-weight: 600;
  line-height: 30px; /* 125% */
  letter-spacing: -0.56px;
  display:block; /* override bricks default flex display which causes issues with sup tags in menu items */
}
.brxe-nav-menu.mobile-menu .bricks-nav-menu>li > ul.sub-menu a {
  font-family: Mulish;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 30px */
  display:block; /* override bricks default flex display which causes issues with sup tags in menu items */
}


.brxe-nav-menu.mobile-menu .bricks-nav-menu>li > ul.sub-menu  ul.sub-menu a {
  padding-left:40px;
}

:where(.brxe-nav-menu.mobile-menu) .bricks-nav-menu .sub-menu a, 
:where(.brxe-nav-menu.mobile-menu) .bricks-nav-menu .sub-menu button {
  color:var(--bricks-color-akrshi);
}

.mobile-menu-container .omnipresent-menu .bricks-nav-menu li {
  border-bottom:none;
  border:0;
}

.mobile-menu-container .omnipresent-menu.brxe-nav-menu .bricks-nav-menu {
  flex-wrap:wrap;
}

:where(.brxe-nav-menu.mobile-menu ) .bricks-nav-menu .sub-menu {
  background-color:transparent;
  margin-top:16px;
}
:where(.brxe-nav-menu.mobile-menu ) .bricks-nav-menu .sub-menu .sub-menu {

  margin-top:6px;
}

:where(.brxe-nav-menu.mobile-menu) .bricks-nav-menu .sub-menu li {
  margin-bottom:6px;
}


:where(.brxe-nav-menu.mobile-menu) .bricks-nav-menu .sub-menu a {
 padding-right:0;
}
:where(.brxe-nav-menu) .bricks-nav-menu .sub-menu button {
  padding:0;
}
.mobile-menu-container .omnipresent-menu.brxe-nav-menu .bricks-nav-menu {
  padding-top:12px;
  padding-bottom:12px;
}
.mobile-menu-container .omnipresent-menu.brxe-nav-menu .bricks-nav-menu > li > a {
padding-top:0;
padding-bottom:0;    
padding: 12px 25px;
}

.mobile-menu-container .omnipresent-menu .bricks-nav-menu li {
  margin-left:0;
      width: 50%;
}

.line-below-item {
    border-bottom: 1px solid var(--bricks-color-nsotcn);
    padding-bottom: 12px;
    margin-bottom: 12px;
}


.language-dropdown > .brx-submenu-toggle > button {
  position:relative;
      padding-right: 14px;
}

.language-dropdown > .brx-submenu-toggle > button::after {
  content: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%225%22%20height%3D%229%22%20viewBox%3D%220%200%205%209%22%20fill%3D%22none%22%3E%0A%3Cpath%20d%3D%22M0.5%208.5L4.5%204.5L0.5%200.5%22%20stroke%3D%22%23F9F0E4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E);
  position: absolute;
     right: 0;
    top: 2px;
  /* transform: translateY(-50%); */
  width: 4px;
  height: 12px;
  transition:transform 0.15s ease;
 transform:rotate(0deg);
}


.language-dropdown.open > .brx-submenu-toggle > button::after {
  transform:rotate(90deg);
}

.language-dropdown.brxe-dropdown .brx-dropdown-content > li > a:hover {
  color: var(--bricks-color-nsotcn);
  font-weight:700;
}

.toggle-button.brxe-div:hover {
cursor: pointer;
}



/* show depth when mega menu is open */
body.mega-menu-open .main-menu {
      box-shadow: 0px 4px 10px #7e7e7e61
}

/*

MEGA MENU ANIMATIONS

Animate the open and close of the mega menu. Requires removing sticky position
because sticky cases scroll change which triggers the close on scroll 

*/

#brx-header.brx-sticky.on-scroll {
  position:fixed !important;

}
#brx-content {
  /* Account for fixed header height */
  padding-top:70px;
}

@media(min-width:992px) {

  #megaMenuContainer {
    display: flex !important;

    overflow: hidden;
    transition:max-height 0.2s ease;
    max-height:0;
  }
  .mega-menu-open #megaMenuContainer {
    max-height:700px;
    transition:max-height 0.4s ease-out;
  }
}

.brxe-nav-menu.mobile-menu .bricks-nav-menu>li > ul.sub-menu a {
  white-space:normal;
}
.brxe-nav-menu.mobile-menu .bricks-nav-menu>li > ul.sub-menu a > span.smaller { 
    font-size: 16px;
    display: block;
    margin-top: -6px;
}