/* templates/blocks/header-mobile-menu/style.css — v4.0.1
   Classic drawer + generic Mega Menu mobile navigation
*/

.pf-mmenu-wrapper {
  --mmenu-trigger-icon-size: 24px;
  --mmenu-trigger-icon-color: #ffffff;
  --mmenu-trigger-size: 48px;
  --mmenu-trigger-bg: #f6b800;
  --mmenu-trigger-radius: 14px;
  --mmenu-trigger-shadow: 0 8px 24px rgba(0,0,0,.18);
  --mmenu-float-top: 50%;
  --mmenu-float-bottom: 120px;
  --mmenu-float-offset-x: 16px;
  --mmenu-zindex: 10020;

  --mmenu-panel-bg: #ffffff;
  --mmenu-panel-w: 300px;
  --mmenu-panel-pad: 20px;

  --mmenu-header-bg: transparent;
  --mmenu-header-pad: 15px 20px;
  --mmenu-header-align: space-between;
  --mmenu-header-border-w: 1px;
  --mmenu-header-border-style: solid;
  --mmenu-header-border-color: #e0e0e0;
  --mmenu-header-text-color: inherit;
  --mmenu-header-font-family: inherit;
  --mmenu-header-font-size: 1.1em;
  --mmenu-header-font-weight: 600;
  --mmenu-header-text-transform: none;
  --mmenu-header-letter-spacing: normal;
  --mmenu-header-line-height: normal;

  --mmenu-main-item-pad: 10px 0;
  --mmenu-main-item-radius: 0px;
  --mmenu-main-item-text-color: #111827;
  --mmenu-main-item-text-color-hover: #111827;
  --mmenu-main-item-bg: transparent;
  --mmenu-main-item-bg-hover: transparent;
  --mmenu-main-item-shadow-hover: none;
  --mmenu-main-item-sep-w: 1px;
  --mmenu-main-item-sep-style: solid;
  --mmenu-main-item-sep-color: #eeeeee;
  --mmenu-main-line-h: 1px;
  --mmenu-main-line-color: currentColor;
  --mmenu-main-item-font-family: inherit;
  --mmenu-main-item-font-size: inherit;
  --mmenu-main-item-font-weight: inherit;
  --mmenu-main-item-text-transform: none;
  --mmenu-main-item-letter-spacing: normal;
  --mmenu-main-item-line-height: normal;

  --mmenu-item-icon-size: 20px;
  --mmenu-item-icon-box-size: 24px;
  --mmenu-item-icon-gap: 12px;
  --mmenu-item-icon-color: currentColor;
  --mmenu-item-badge-bg: #ef4444;
  --mmenu-item-badge-text-color: #ffffff;
  --mmenu-item-badge-font-size: 11px;
  --mmenu-item-badge-radius: 999px;
  --mmenu-item-badge-padding: 3px 8px;

  --mmenu-sub-container-bg: #f8f8f8;
  --mmenu-sub-indicator-color: #333333;
  --mmenu-indent-step: 16px;
  --mmenu-sub-item-pad: 8px 0 8px 15px;
  --mmenu-sub-item-radius: 0px;
  --mmenu-sub-item-text-color: #333333;
  --mmenu-sub-item-text-color-hover: #333333;
  --mmenu-sub-item-bg: transparent;
  --mmenu-sub-item-bg-hover: transparent;
  --mmenu-sub-item-shadow-hover: none;
  --mmenu-sub-item-sep-w: 1px;
  --mmenu-sub-item-sep-style: solid;
  --mmenu-sub-item-sep-color: #e0e0e0;
  --mmenu-sub-line-h: 1px;
  --mmenu-sub-line-color: currentColor;
  --mmenu-sub-item-font-family: inherit;
  --mmenu-sub-item-font-size: inherit;
  --mmenu-sub-item-font-weight: inherit;
  --mmenu-sub-item-text-transform: none;
  --mmenu-sub-item-letter-spacing: normal;
  --mmenu-sub-item-line-height: normal;
}

.pf-mmenu__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--mmenu-trigger-size);
  height: var(--mmenu-trigger-size);
  background: var(--mmenu-trigger-bg);
  border: none;
  border-radius: var(--mmenu-trigger-radius);
  box-shadow: var(--mmenu-trigger-shadow);
  padding: 0;
  margin: 0;
  cursor: pointer;
  line-height: 1;
  color: var(--mmenu-trigger-icon-color, #ffffff) !important;
  -webkit-text-fill-color: currentColor !important;
  -webkit-tap-highlight-color: transparent;
  z-index: 2;
}
.pf-mmenu-wrapper .pf-mmenu__trigger,
.pf-mmenu-wrapper .pf-mmenu__trigger:hover,
.pf-mmenu-wrapper .pf-mmenu__trigger:focus,
.pf-mmenu-wrapper .pf-mmenu__trigger:focus-visible,
.pf-mmenu-wrapper .pf-mmenu__trigger:active {
  appearance: none !important;
  background: var(--mmenu-trigger-bg) !important;
  border: 0 !important;
  color: var(--mmenu-trigger-icon-color, #ffffff) !important;
  -webkit-text-fill-color: currentColor !important;
}
.pf-mmenu__trigger i,
.pf-mmenu__trigger svg,
.pf-mmenu__trigger img,
.pf-mmenu__trigger .pf-mmenu-svg-icon {
  width: var(--mmenu-trigger-icon-size);
  height: var(--mmenu-trigger-icon-size);
  display: block;
}
/*
 * The trigger icon is intentionally isolated from theme/block CSS.
 * Some blocks use broad selectors such as button i or .fa::before with
 * !important; these rules keep the value selected in this block authoritative.
 */
.pf-mmenu-wrapper .pf-mmenu__trigger,
.pf-mmenu-wrapper .pf-mmenu__trigger i,
.pf-mmenu-wrapper .pf-mmenu__trigger i::before,
.pf-mmenu-wrapper .pf-mmenu__trigger svg,
.pf-mmenu-wrapper .pf-mmenu__trigger svg *,
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu-svg-icon,
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu-svg-icon * {
  color: var(--mmenu-trigger-icon-color, #ffffff) !important;
  -webkit-text-fill-color: currentColor !important;
}
.pf-mmenu-wrapper .pf-mmenu__trigger i {
  font-size: var(--mmenu-trigger-icon-size) !important;
}
.pf-mmenu-wrapper .pf-mmenu__trigger svg,
.pf-mmenu-wrapper .pf-mmenu__trigger svg *,
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu-svg-icon svg,
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu-svg-icon svg * {
  fill: currentColor !important;
  stroke: currentColor !important;
}
/*
 * Canonical bars icon used by the picker, Builder Preview and PHP render.
 * A single SVG path prevents theme rules for span:nth-child() or generic
 * hamburger components from changing the length of individual bars.
 */
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu__bars-svg {
  display: block !important;
  width: var(--mmenu-trigger-icon-size) !important;
  height: var(--mmenu-trigger-icon-size) !important;
  flex: 0 0 var(--mmenu-trigger-icon-size) !important;
  overflow: visible !important;
  color: var(--mmenu-trigger-icon-color, #ffffff) !important;
  fill: none !important;
  stroke: currentColor !important;
}
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu__bars-svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.4 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke;
  transform: none !important;
}

/* Legacy fallback for already-cached markup from v3.0.4. */
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu__hamburger {
  display: inline-flex !important;
  width: var(--mmenu-trigger-icon-size) !important;
  height: var(--mmenu-trigger-icon-size) !important;
  flex: 0 0 var(--mmenu-trigger-icon-size) !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: space-between !important;
  gap: 0 !important;
  padding: calc(var(--mmenu-trigger-icon-size) * .17) 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  color: var(--mmenu-trigger-icon-color, #ffffff) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: visible !important;
}
.pf-mmenu-wrapper .pf-mmenu__trigger .pf-mmenu__hamburger > span {
  display: block !important;
  width: 100% !important;
  height: max(2px, calc(var(--mmenu-trigger-icon-size) * .105)) !important;
  min-height: max(2px, calc(var(--mmenu-trigger-icon-size) * .105)) !important;
  flex: 0 0 max(2px, calc(var(--mmenu-trigger-icon-size) * .105)) !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--mmenu-trigger-icon-color, #ffffff) !important;
  color: var(--mmenu-trigger-icon-color, #ffffff) !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
.pf-mmenu-svg-icon { display: inline-flex; align-items: center; justify-content: center; }

.pf-mmenu--display-floating .pf-mmenu__trigger {
  position: fixed;
  z-index: var(--mmenu-zindex);
}
.pf-mmenu--display-floating.pf-mmenu--float-right .pf-mmenu__trigger { right: var(--mmenu-float-offset-x); }
.pf-mmenu--display-floating.pf-mmenu--float-left .pf-mmenu__trigger { left: var(--mmenu-float-offset-x); }
.pf-mmenu--display-floating.pf-mmenu--use-top .pf-mmenu__trigger {
  top: var(--mmenu-float-top);
  transform: translateY(-50%);
}
.pf-mmenu--display-floating.pf-mmenu--use-bottom .pf-mmenu__trigger { bottom: var(--mmenu-float-bottom); }

.pf-mmenu__panel {
  position: fixed;
  top: 0;
  bottom: 0;
  width: min(92vw, var(--mmenu-panel-w));
  background: var(--mmenu-panel-bg);
  z-index: calc(var(--mmenu-zindex) - 1);
  transition: transform .3s cubic-bezier(.77,0,.175,1);
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 25px rgba(0,0,0,.15);
}
.pf-mmenu--from-left .pf-mmenu__panel { left: 0; transform: translateX(-100%); }
.pf-mmenu--from-right .pf-mmenu__panel { right: 0; transform: translateX(100%); }

.pf-mmenu__overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  z-index: calc(var(--mmenu-zindex) - 2);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
  cursor: pointer;
}

.pf-mmenu-wrapper.is-open .pf-mmenu__panel { transform: translateX(0); }
.pf-mmenu-wrapper.is-open .pf-mmenu__overlay { opacity: 1; visibility: visible; }

.pf-mmenu__header {
  display: flex;
  justify-content: var(--mmenu-header-align);
  align-items: center;
  flex-shrink: 0;
  background-color: var(--mmenu-header-bg);
  padding: var(--mmenu-header-pad);
  border-bottom-width: var(--mmenu-header-border-w);
  border-bottom-style: var(--mmenu-header-border-style);
  border-bottom-color: var(--mmenu-header-border-color);
}
.pf-mmenu__header > span {
  flex-grow: 1;
  text-align: left;
  color: var(--mmenu-header-text-color);
  font-family: var(--mmenu-header-font-family);
  font-size: var(--mmenu-header-font-size);
  font-weight: var(--mmenu-header-font-weight);
  text-transform: var(--mmenu-header-text-transform);
  letter-spacing: var(--mmenu-header-letter-spacing);
  line-height: var(--mmenu-header-line-height);
}
.pf-mmenu__close {
  background: none;
  border: none;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  padding: 5px;
  color: #888;
  -webkit-tap-highlight-color: transparent;
  transition: color .2s ease;
}
.pf-mmenu__close:hover { color: #000; }
.pf-mmenu__body { flex-grow: 1; overflow-y: auto; padding: 0; }

.pf-mmenu__list,
.pf-mmenu__submenu { list-style: none; margin: 0; padding: 0; }

.pf-mmenu__item > a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  min-width: 0;
  text-decoration: none;
  position: relative;
  transition: color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.pf-mmenu__item-leading {
  display: inline-flex;
  align-items: center;
  gap: var(--mmenu-item-icon-gap);
  min-width: 0;
  flex: 1 1 auto;
}
.pf-mmenu__item-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.pf-mmenu__item-trailing {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-left: auto;
  flex: 0 0 auto;
}
.pf-mmenu__item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 var(--mmenu-item-icon-box-size);
  width: var(--mmenu-item-icon-box-size);
  height: var(--mmenu-item-icon-box-size);
  color: var(--pf-menu-item-icon-color, var(--mmenu-item-icon-color));
  font-size: var(--mmenu-item-icon-size);
  line-height: 1;
}
.pf-mmenu__item-icon i { font-size: inherit; line-height: 1; }
.pf-mmenu__item-icon img,
.pf-mmenu__item-icon svg,
.pf-mmenu__item-svg {
  display: block;
  width: var(--mmenu-item-icon-size);
  height: var(--mmenu-item-icon-size);
  max-width: 100%;
  max-height: 100%;
}
.pf-mmenu__item-icon img { object-fit: contain; }
.pf-mmenu__item-icon svg { fill: currentColor; stroke: currentColor; }
.pf-mmenu__item-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: var(--mmenu-item-badge-padding);
  border-radius: var(--mmenu-item-badge-radius);
  background: var(--pf-menu-item-badge-bg, var(--mmenu-item-badge-bg));
  color: var(--mmenu-item-badge-text-color);
  font-size: var(--mmenu-item-badge-font-size);
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.pf-mmenu--sub-click .pf-mmenu__item.has-sub > a { cursor: pointer; }

.pf-mmenu__list > .pf-mmenu__item {
  border-bottom-width: var(--mmenu-main-item-sep-w);
  border-bottom-style: var(--mmenu-main-item-sep-style);
  border-bottom-color: var(--mmenu-main-item-sep-color);
}
.pf-mmenu__list > .pf-mmenu__item:last-child { border-bottom: none; }

.pf-mmenu__list > .pf-mmenu__item > a {
  padding: var(--mmenu-main-item-pad);
  padding-left: var(--mmenu-panel-pad);
  padding-right: var(--mmenu-panel-pad);
  color: var(--mmenu-main-item-text-color);
  background-color: var(--mmenu-main-item-bg);
  border-radius: var(--mmenu-main-item-radius);
  font-family: var(--mmenu-main-item-font-family);
  font-size: var(--mmenu-main-item-font-size);
  font-weight: var(--mmenu-main-item-font-weight);
  text-transform: var(--mmenu-main-item-text-transform);
  letter-spacing: var(--mmenu-main-item-letter-spacing);
  line-height: var(--mmenu-main-item-line-height);
}
.pf-mmenu__list > .pf-mmenu__item > a:hover {
  color: var(--mmenu-main-item-text-color-hover);
  background-color: var(--mmenu-main-item-bg-hover);
  box-shadow: var(--mmenu-main-item-shadow-hover);
}
.pf-mmenu__list > .pf-mmenu__item > a::after,
.pf-mmenu__submenu .pf-mmenu__item > a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  transform: scaleX(0);
  transition: transform .3s ease;
}
.pf-mmenu__list > .pf-mmenu__item > a::after {
  height: var(--mmenu-main-line-h);
  background-color: var(--mmenu-main-line-color);
}
.pf-mmenu__submenu .pf-mmenu__item > a::after {
  height: var(--mmenu-sub-line-h);
  background-color: var(--mmenu-sub-line-color);
}
.pf-mmenu--mainstyle-underline .pf-mmenu__list > .pf-mmenu__item > a:hover::after { transform: scaleX(1); }

.pf-mmenu--sub-click .pf-mmenu__submenu,
.pf-mmenu--sub-hover .pf-mmenu__submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease-in-out;
}
.pf-mmenu--sub-expanded .pf-mmenu__submenu { max-height: 10000px; }
.pf-mmenu__submenu { background: var(--mmenu-sub-container-bg); }
.pf-mmenu__submenu .pf-mmenu__item {
  border-bottom-width: var(--mmenu-sub-item-sep-w);
  border-bottom-style: var(--mmenu-sub-item-sep-style);
  border-bottom-color: var(--mmenu-sub-item-sep-color);
}
.pf-mmenu__submenu .pf-mmenu__item:last-child { border-bottom: none; }

.pf-mmenu__submenu .pf-mmenu__item > a {
  padding: var(--mmenu-sub-item-pad);
  padding-right: var(--mmenu-panel-pad);
  color: var(--mmenu-sub-item-text-color);
  background-color: var(--mmenu-sub-item-bg);
  border-radius: var(--mmenu-sub-item-radius);
  font-family: var(--mmenu-sub-item-font-family);
  font-size: var(--mmenu-sub-item-font-size);
  font-weight: var(--mmenu-sub-item-font-weight);
  text-transform: var(--mmenu-sub-item-text-transform);
  letter-spacing: var(--mmenu-sub-item-letter-spacing);
  line-height: var(--mmenu-sub-item-line-height);
}
.pf-mmenu__submenu[data-depth="2"] .pf-mmenu__item > a { padding-left: calc(var(--mmenu-panel-pad) + 1 * var(--mmenu-indent-step)); }
.pf-mmenu__submenu[data-depth="3"] .pf-mmenu__item > a { padding-left: calc(var(--mmenu-panel-pad) + 2 * var(--mmenu-indent-step)); }
.pf-mmenu__submenu[data-depth="4"] .pf-mmenu__item > a { padding-left: calc(var(--mmenu-panel-pad) + 3 * var(--mmenu-indent-step)); }
.pf-mmenu__submenu[data-depth="5"] .pf-mmenu__item > a { padding-left: calc(var(--mmenu-panel-pad) + 4 * var(--mmenu-indent-step)); }

.pf-mmenu__submenu .pf-mmenu__item > a:hover {
  color: var(--mmenu-sub-item-text-color-hover);
  background-color: var(--mmenu-sub-item-bg-hover);
  box-shadow: var(--mmenu-sub-item-shadow-hover);
}
.pf-mmenu--substyle-underline .pf-mmenu__submenu .pf-mmenu__item > a:hover::after { transform: scaleX(1); }

.pf-mmenu__accordion-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  margin-right: -6px;
  color: var(--mmenu-sub-indicator-color);
  position: relative;
  flex: 0 0 auto;
}
.pf-mmenu__accordion-toggle::before,
.pf-mmenu__accordion-toggle::after {
  content: '';
  display: block;
  transition: transform .3s ease, border-color .3s ease;
  background-color: transparent;
}
.pf-mmenu-wrapper[class*="--indicator-triangle"] .pf-mmenu__accordion-toggle::before,
.pf-mmenu-wrapper:not([class*="--indicator-"]) .pf-mmenu__accordion-toggle::before {
  width: 7px;
  height: 7px;
  border-style: solid;
  border-color: var(--mmenu-sub-indicator-color);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.pf-mmenu-wrapper[class*="--indicator-triangle"] .pf-mmenu__item.is-open > a .pf-mmenu__accordion-toggle::before,
.pf-mmenu-wrapper:not([class*="--indicator-"]) .pf-mmenu__item.is-open > a .pf-mmenu__accordion-toggle::before {
  transform: rotate(-135deg);
}
.pf-mmenu-wrapper[class*="--indicator-chevron"] .pf-mmenu__accordion-toggle::before {
  width: 8px;
  height: 8px;
  border-style: solid;
  border-color: var(--mmenu-sub-indicator-color);
  border-width: 0 2px 2px 0;
  transform: translateY(-2px) rotate(45deg);
}
.pf-mmenu-wrapper[class*="--indicator-chevron"] .pf-mmenu__item.is-open > a .pf-mmenu__accordion-toggle::before {
  transform: translateY(0) rotate(-135deg);
}
.pf-mmenu-wrapper[class*="--indicator-plus"] .pf-mmenu__accordion-toggle::before,
.pf-mmenu-wrapper[class*="--indicator-plus"] .pf-mmenu__accordion-toggle::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  background-color: var(--mmenu-sub-indicator-color);
}
.pf-mmenu-wrapper[class*="--indicator-plus"] .pf-mmenu__accordion-toggle::before { transform: translate(-50%, -50%) rotate(0deg); }
.pf-mmenu-wrapper[class*="--indicator-plus"] .pf-mmenu__accordion-toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.pf-mmenu-wrapper[class*="--indicator-plus"] .pf-mmenu__item.is-open > a .pf-mmenu__accordion-toggle::after { transform: translate(-50%, -50%) rotate(180deg); }

.pf-mmenu--sub-hover .pf-mmenu__item.has-sub:hover > .pf-mmenu__submenu { max-height: 1000px; }

@media (max-width: 767px) {
  .pf-mmenu--display-floating .pf-mmenu__trigger {
    width: max(42px, var(--mmenu-trigger-size));
    height: max(42px, var(--mmenu-trigger-size));
  }
}


/* V2.8 — item metadata responsive safeguards */
@media (max-width: 480px) {
  .pf-mmenu__item-badge { max-width: 92px; overflow: hidden; text-overflow: ellipsis; }
  .pf-mmenu__item-leading { gap: max(8px, calc(var(--mmenu-item-icon-gap) * .8)); }
}


/* V2.8.1 — bilingual mapping empty state */
.pf-mmenu__empty {
  padding: 24px var(--mmenu-panel-pad);
  color: var(--mmenu-main-item-text-color);
  font-size: .92em;
  line-height: 1.5;
  opacity: .7;
}

/* v3.0.0 advanced metadata + mobile header hardening */
html,body{max-width:100%}
body.pf-mmenu-body-locked{touch-action:none;overscroll-behavior:none}
.pf-mmenu-wrapper,.pf-mmenu__panel,.pf-mmenu__overlay{box-sizing:border-box}
.pf-mmenu__panel{max-width:100vw;height:100dvh;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);overflow:hidden}
.pf-mmenu__body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.pf-mmenu__trigger:focus-visible,.pf-mmenu__close:focus-visible,.pf-mmenu__item>a:focus-visible,.pf-mmenu__accordion-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media(max-width:767.98px){.pf-mmenu__panel{width:min(calc(100vw - 24px),var(--mmenu-panel-w))}.pf-mmenu__trigger{min-width:40px;min-height:40px}.pf-mmenu__overlay{width:100vw;height:100dvh}}
@media(prefers-reduced-motion:reduce){.pf-mmenu__panel,.pf-mmenu__overlay,.pf-mmenu__submenu{transition:none!important}}

/* ============================================================
 * v4.0.2 — Generic Mega Menu mobile navigation
 * ============================================================ */
.pf-mmenu-wrapper {
  --mmenu-mega-panel-w: 100vw;
  --mmenu-mega-panel-max-w: 720px;
  --mmenu-mega-rail-w: 34%;
  --mmenu-mega-columns: 3;
  --mmenu-mega-columns-small: 2;
  --mmenu-mega-gap: 14px;
  --mmenu-mega-l1-visual-size: 22px;
  --mmenu-mega-l2-visual-size: 64px;
  --mmenu-mega-l3-visual-size: 18px;
  --mmenu-mega-thumb-fit: contain;
  --mmenu-mega-rail-bg: #f8fafc;
  --mmenu-mega-rail-text: #111827;
  --mmenu-mega-rail-active-bg: #ffffff;
  --mmenu-mega-rail-active-text: #ef4444;
  --mmenu-mega-content-bg: #ffffff;
  --mmenu-mega-tile-bg: transparent;
  --mmenu-mega-tile-text: #111827;
  --mmenu-mega-l3-text: #4b5563;
  --mmenu-mega-visual-bg: transparent;
  --mmenu-mega-visual-radius: 10px;
  --mmenu-mega-content-pad: 16px;
  --mmenu-mega-content-pad-mobile: 12px;
  --mmenu-mega-rail-item-pad-tablet: 12px 10px;
  --mmenu-mega-rail-item-pad-mobile: 10px 8px;
  --mmenu-mega-rail-arrow-size: 16px;
  --mmenu-mega-rail-arrow-color: #64748b;
  --mmenu-mega-l1-font-size-tablet: 13px;
  --mmenu-mega-l1-font-size-mobile: 12px;
  --mmenu-mega-l1-font-weight: 600;
  --mmenu-mega-l1-line-height: 1.25;
  --mmenu-mega-l2-font-size-tablet: 12px;
  --mmenu-mega-l2-font-size-mobile: 12px;
  --mmenu-mega-l2-font-weight: 600;
  --mmenu-mega-l2-line-height: 1.25;
  --mmenu-mega-l3-font-size-tablet: 11px;
  --mmenu-mega-l3-font-size-mobile: 11px;
  --mmenu-mega-l3-font-weight: 400;
  --mmenu-mega-l3-line-height: 1.35;
  --mmenu-mega-panel-title-size-tablet: 15px;
  --mmenu-mega-panel-title-size-mobile: 14px;
  --mmenu-mega-panel-title-weight: 700;
  --mmenu-mega-viewall-size-tablet: 12px;
  --mmenu-mega-viewall-size-mobile: 11px;
  --mmenu-mega-viewall-weight: 600;
}

.pf-mmenu--layout-mega .pf-mmenu__panel {
  width: min(var(--mmenu-mega-panel-w), var(--mmenu-mega-panel-max-w), 100vw);
  max-width: 100vw;
}
.pf-mmenu--layout-mega .pf-mmenu__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  padding: 0;
}
.pf-mmenu__mega {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(108px, var(--mmenu-mega-rail-w)) minmax(0, 1fr);
  background: var(--mmenu-mega-content-bg);
}
.pf-mmenu__mega-rail {
  min-width: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background: var(--mmenu-mega-rail-bg);
  border-right: 1px solid rgba(15,23,42,.08);
  padding: 8px 0;
}
.pf-mmenu__mega-root {
  appearance: none;
  width: 100%;
  min-height: 54px;
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 9px;
  border: 0;
  border-left: 3px solid transparent;
  background: transparent;
  color: var(--mmenu-mega-rail-text);
  padding: var(--mmenu-mega-rail-item-pad-tablet);
  text-align: left;
  font: inherit;
  font-size: var(--mmenu-mega-l1-font-size-tablet);
  font-weight: var(--mmenu-mega-l1-font-weight);
  line-height: var(--mmenu-mega-l1-line-height);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.pf-mmenu__mega-root:hover,
.pf-mmenu__mega-root:focus-visible,
.pf-mmenu__mega-root.is-active {
  background: var(--mmenu-mega-rail-active-bg);
  color: var(--mmenu-mega-rail-active-text);
}
.pf-mmenu__mega-root.is-active { border-left-color: currentColor; }
.pf-mmenu__mega-root-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.pf-mmenu--mega-no-arrows .pf-mmenu__mega-root {
  grid-template-columns: auto minmax(0,1fr);
}
.pf-mmenu__mega-root-arrow {
  font-size: var(--mmenu-mega-rail-arrow-size);
  line-height: 1;
  color: var(--mmenu-mega-rail-arrow-color);
  opacity: .85;
}
.pf-mmenu__mega-content {
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background: var(--mmenu-mega-content-bg);
  padding: var(--mmenu-mega-content-pad);
}
.pf-mmenu__mega-panel[hidden] { display: none !important; }
.pf-mmenu__mega-panel { min-width: 0; }
.pf-mmenu__mega-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.pf-mmenu__mega-panel-title {
  color: var(--mmenu-mega-tile-text);
  font-size: var(--mmenu-mega-panel-title-size-tablet);
  font-weight: var(--mmenu-mega-panel-title-weight);
  line-height: 1.3;
}
.pf-mmenu__mega-viewall,
.pf-mmenu__mega-empty-link {
  color: var(--mmenu-mega-rail-active-text);
  text-decoration: none;
  font-size: var(--mmenu-mega-viewall-size-tablet);
  font-weight: var(--mmenu-mega-viewall-weight);
}
.pf-mmenu__mega-grid {
  display: grid;
  grid-template-columns: repeat(var(--mmenu-mega-columns), minmax(0,1fr));
  gap: var(--mmenu-mega-gap);
  align-items: start;
}
.pf-mmenu__mega-group {
  min-width: 0;
  background: var(--mmenu-mega-tile-bg);
  border-radius: 10px;
}
.pf-mmenu__mega-tile {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  color: var(--mmenu-mega-tile-text);
  text-decoration: none;
  text-align: center;
  line-height: var(--mmenu-mega-l2-line-height);
  font-size: var(--mmenu-mega-l2-font-size-tablet);
  font-weight: var(--mmenu-mega-l2-font-weight);
}
.pf-mmenu__mega-tile-label {
  width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
}
.pf-mmenu__mega-visual {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  overflow: hidden;
  background: var(--mmenu-mega-visual-bg);
  border-radius: var(--mmenu-mega-visual-radius);
  color: currentColor;
}
.pf-mmenu__mega-visual--l1 {
  width: var(--mmenu-mega-l1-visual-size);
  height: var(--mmenu-mega-l1-visual-size);
  font-size: var(--mmenu-mega-l1-visual-size);
}
.pf-mmenu__mega-visual--l2 {
  width: var(--mmenu-mega-l2-visual-size);
  height: var(--mmenu-mega-l2-visual-size);
  font-size: calc(var(--mmenu-mega-l2-visual-size) * .52);
}
.pf-mmenu__mega-visual--l3 {
  width: var(--mmenu-mega-l3-visual-size);
  height: var(--mmenu-mega-l3-visual-size);
  font-size: var(--mmenu-mega-l3-visual-size);
}
.pf-mmenu__mega-visual > img,
.pf-mmenu__mega-visual .pf-mmenu__item-icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: var(--mmenu-mega-thumb-fit);
}
.pf-mmenu__mega-visual > i,
.pf-mmenu__mega-visual .pf-mmenu__item-icon {
  width: 100%;
  height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: inherit;
  color: inherit;
}
.pf-mmenu__mega-l3 {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
}
.pf-mmenu__mega-l3-link {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: var(--mmenu-mega-l3-text);
  text-decoration: none;
  font-size: var(--mmenu-mega-l3-font-size-tablet);
  font-weight: var(--mmenu-mega-l3-font-weight);
  line-height: var(--mmenu-mega-l3-line-height);
}
.pf-mmenu__mega-l3-link > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.pf-mmenu__mega-root:focus-visible,
.pf-mmenu__mega-tile:focus-visible,
.pf-mmenu__mega-l3-link:focus-visible,
.pf-mmenu__mega-viewall:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

@media (max-width: 480px) {
  .pf-mmenu__mega-content { padding: var(--mmenu-mega-content-pad-mobile); }
  .pf-mmenu__mega-root {
    padding: var(--mmenu-mega-rail-item-pad-mobile);
    font-size: var(--mmenu-mega-l1-font-size-mobile);
  }
  .pf-mmenu__mega-tile { font-size: var(--mmenu-mega-l2-font-size-mobile); }
  .pf-mmenu__mega-l3-link { font-size: var(--mmenu-mega-l3-font-size-mobile); }
  .pf-mmenu__mega-panel-title { font-size: var(--mmenu-mega-panel-title-size-mobile); }
  .pf-mmenu__mega-viewall,
  .pf-mmenu__mega-empty-link { font-size: var(--mmenu-mega-viewall-size-mobile); }
}

@media (max-width: 380px) {
  .pf-mmenu__mega { grid-template-columns: minmax(112px, 38%) minmax(0,1fr); }
  .pf-mmenu__mega-grid { grid-template-columns: repeat(var(--mmenu-mega-columns-small), minmax(0,1fr)); }
}
