/* Relia concrete Page navigation. Only the two named roots receive this class.
   Keep the native hover, drawer, submenu transforms and back-button JavaScript.
   Load after the existing header/navigation styles. */

@media (min-width:1024px) {
  .f-menu__item.mws-page-guides { position:static; }
  .f-menu__item.mws-page-guides > .f-mega-menu {
    top:100%;
    left:0 !important;
    right:0 !important;
    width:min(1320px, calc(100vw - 48px)) !important;
    max-width:calc(100vw - 32px);
    min-width:0;
    margin-left:auto;
    margin-right:auto;
    max-height:calc(100vh - 150px);
    max-height:calc(100dvh - max(110px, var(--f-header-height, 110px)) - 20px);
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    background:rgb(var(--color-background, 255 255 255));
    border:1px solid #d8e2e9;
    box-shadow:0 14px 28px rgb(20 45 65 / 12%);
  }
  /* Opening/closing remains the native hover/active state, with keyboard parity. */
  .f-menu__item.mws-page-guides:hover > .f-mega-menu,
  .f-menu__item.mws-page-guides:focus-within > .f-mega-menu {
    visibility:visible;
    opacity:1;
    pointer-events:auto;
    transform:translate3d(0,0,0);
  }
  .f-menu__item.mws-page-guides > .f-mega-menu > .f-mega-menu__container {
    width:100% !important;
    max-width:none !important;
    padding:0;
    margin:0;
    box-sizing:border-box;
  }
  .f-menu__item.mws-page-guides .f-mega-menu__inner {
    display:block !important;
    width:100%;
    padding:26px 28px 30px !important;
  }
  .f-menu__item.mws-page-guides .f-sub-menu--level-1 {
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr));
    align-items:start;
    gap:28px 24px;
    width:100% !important;
    min-width:0;
    margin:0 !important;
    padding:0 !important;
    list-style:none;
  }
  .f-menu__item.mws-page-guides .f-sub-menu__item--level-1 {
    width:auto !important;
    min-width:0;
    padding:0 !important;
    margin:0 !important;
    border:0;
  }
  .f-menu__item.mws-page-guides .f-sub-menu__item--level-1 > .f-menu__link {
    display:block;
    padding:5px 4px 11px;
    color:#17364c;
    font-size:14px;
    line-height:1.55;
    font-weight:700;
    border-bottom:1px solid #d9e3ea;
    overflow:visible;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  /* Third-level Pages are already visible, so no off-panel flyout is needed. */
  .f-menu__item.mws-page-guides .f-sub-menu__item--level-1 > .f-menu__link > .f-menu__sub-arrow { display:none; }
  .f-menu__item.mws-page-guides .f-mega-menu__column {
    position:static !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    width:100%;
    min-width:0 !important;
    margin:10px 0 0 !important;
    padding:0 !important;
    background:transparent;
    box-shadow:none;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }
  .f-menu__item.mws-page-guides .f-mega-menu__column::before { content:none; }
  .f-menu__item.mws-page-guides .f-sub-menu--level-2 {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:2px;
    width:100%;
    padding:0;
    margin:0;
    list-style:none;
  }
  .f-menu__item.mws-page-guides .f-sub-menu__item--level-2 { min-width:0; }
  .f-menu__item.mws-page-guides .f-sub-menu__item--level-2 > .f-menu__link {
    display:block;
    padding:8px 9px;
    min-height:38px;
    color:#415d72;
    font-size:13px;
    line-height:1.65;
    border-radius:3px;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    overflow-wrap:anywhere;
    transition:background-color .15s,color .15s;
  }
  .f-menu__item.mws-page-guides .f-sub-menu__item--level-2 > .f-menu__link:hover {
    color:#943b19;
    background:#f5ede7;
  }
  .f-menu__item.mws-page-guides .f-menu__link:focus-visible {
    outline:2px solid #ad461d;
    outline-offset:2px;
    color:#943b19;
    background:#f8f1eb;
  }
  .f-menu__item.mws-page-guides > .f-mega-menu::-webkit-scrollbar { display:block; width:7px; }
  .f-menu__item.mws-page-guides > .f-mega-menu::-webkit-scrollbar-thumb { background:#a9bbc8; border-radius:4px; }
}
@media (min-width:1360px) {
  .f-menu__item.mws-page-guides .f-sub-menu--level-1 { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media (min-width:1024px) and (max-width:1199px) {
  .f-menu__item.mws-page-guides .f-sub-menu--level-1 { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px 20px; }
  .f-menu__item.mws-page-guides .f-mega-menu__inner { padding:24px; }
}

/* Native mobile panels stay separate, translated, and opened by the native JS. */
@media (max-width:1023px) {
  .f-menu-mobile__item.mws-page-guides > .f-megamenu-mobile,
  .f-menu-mobile__item.mws-page-guides .f-megamenu-mobile--level-2 {
    min-width:0;
    max-width:100%;
    max-height:var(--menu-drawer-height, calc(100vh - 88px));
    max-height:var(--menu-drawer-height, calc(100dvh - 88px));
  }
  .f-menu-mobile__item.mws-page-guides .f-megamenu-mobile__wrapper {
    min-height:0;
    max-height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    padding-bottom:calc(24px + env(safe-area-inset-bottom));
    -webkit-overflow-scrolling:touch;
  }
  .f-menu-mobile__item.mws-page-guides .f-megamenu-mobile__wrapper.open-submenu { overflow:hidden; }
  .f-menu-mobile__item.mws-page-guides .f-submenu-mobile {
    list-style:none;
    padding:0 0 12px;
    margin:0;
  }
  .f-menu-mobile__item.mws-page-guides .f-menu-mobile__item { min-width:0; align-items:stretch; }
  .f-menu-mobile__item.mws-page-guides .f-menu-mobile__link {
    min-width:0;
    min-height:48px;
    padding:12px 18px;
    color:#24455d;
    font-size:15px;
    line-height:1.6;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    overflow-wrap:anywhere;
  }
  .f-menu-mobile__item.mws-page-guides .f-menu-mobile__link span { white-space:normal; }
  .f-menu-mobile__item.mws-page-guides .f-menu-mobile__toggle-button {
    flex:0 0 48px;
    min-width:48px;
    min-height:48px;
    padding-right:16px;
  }
  .f-menu-mobile__item.mws-page-guides .f-menu-mobile__back-button {
    position:sticky;
    top:0;
    z-index:2;
    flex-shrink:0;
    min-height:48px;
    color:#17364c;
    background:rgb(var(--color-background, 255 255 255));
    font-size:15px;
    line-height:1.5;
    white-space:normal;
  }
  .f-menu-mobile__item.mws-page-guides a:hover { background:#f5ede7; color:#943b19; }
  .f-menu-mobile__item.mws-page-guides a:focus-visible,
  .f-menu-mobile__item.mws-page-guides button:focus-visible,
  .f-menu-mobile__item.mws-page-guides [data-toggle-submenu]:focus-visible {
    outline:2px solid #ad461d;
    outline-offset:-3px;
    color:#943b19;
    background:#f8f1eb;
  }
}
@media (prefers-reduced-motion:reduce) {
  .f-menu__item.mws-page-guides .f-menu__link { transition:none; }
}
