/* Mobile overlay fix — shared by Content.com.vn, SEO.com.vn and DGM.vn.
   Keep the Impact desktop navigation and 68px/60px chrome unchanged.
   Loaded last, after all source route CSS and Jakarta overrides. */
@media (max-width:991px) {
  body.ds .navigationcontainer,
  body.ds .navigationcontainer.scrolling,
  body.ds .navigationcontainer.slide-up {
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    z-index:2147482000!important;
    isolation:isolate!important;
    transform:none!important;
    -webkit-transform:none!important;
    overflow:visible!important;
    height:var(--contentcv-header-mobile,60px)!important;
    min-height:var(--contentcv-header-mobile,60px)!important;
  }
  body.ds .navigationcontainer #navigation-wrapper {
    position:relative!important;
    overflow:visible!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper {
    display:none!important;
    position:fixed!important;
    inset:var(--contentcv-header-mobile,60px) 0 0 0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:calc(100vh - var(--contentcv-header-mobile,60px))!important;
    height:calc(100dvh - var(--contentcv-header-mobile,60px))!important;
    max-height:none!important;
    margin:0!important;
    padding:12px 18px calc(90px + env(safe-area-inset-bottom,0px))!important;
    box-sizing:border-box!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    background:#fff!important;
    color:#171a20!important;
    box-shadow:0 12px 26px rgba(20,24,35,.15);
    border-top:1px solid #eee;
    z-index:2147482001!important;
    transform:none!important;
    -webkit-transform:none!important;
    opacity:0;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper.static-nav-open {
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper > .drop-nav {
    flex:0 0 auto!important;
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    display:block!important;
    border-bottom:1px solid #eceef1;
    margin:0!important;
    padding:0!important;
    white-space:normal!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper > .drop-nav > a {
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    height:auto!important;
    min-height:48px!important;
    line-height:1.45!important;
    margin:0!important;
    padding:12px 5px!important;
    white-space:normal!important;
    font-family:'Plus Jakarta Sans',Arial,sans-serif!important;
    font-weight:600!important;
    font-size:15px!important;
    text-decoration:none!important;
    pointer-events:auto!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper .drop-nav > .submenu a {pointer-events:auto!important;}
  body.ds #impact-primary-navigation.main.menu-primary__wrapper .drop-nav > .submenu {
    display:none!important;
    position:static!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    margin:0!important;
    padding:0 0 12px 12px!important;
    background:#fff!important;
    box-shadow:none!important;
    visibility:visible!important;
    opacity:1!important;
    transform:none!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper .drop-nav.static-dropdown-open > .submenu {
    display:block!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper > .spacer {display:none!important;}
  body.ds #impact-primary-navigation.main.menu-primary__wrapper > .menu-actions {
    flex:0 0 auto!important;
    margin:15px 0!important;
    padding:8px 0!important;
    height:auto!important;
    display:flex!important;
  }
  body.ds #impact-primary-navigation.main.menu-primary__wrapper > .menu-actions .cta-button {
    display:inline-flex!important;
    align-items:center!important;
  }
  html.static-menu-open, html.static-menu-open body.ds {overflow:hidden!important;}
  body.ds #hamburger-icon {position:relative;z-index:2147482002!important;}
  /* Legacy off-canvas DOM is empty; never let it intercept taps on the working menu. */
  body.ds #navigation-mobile, body.ds .navigation__mobile--backdrop {display:none!important;pointer-events:none!important;}
}
/* Preserve the WordPress admin bar above the menu on logged-in devices. */
@media (max-width:782px) {
  body.ds.admin-bar .navigationcontainer {top:46px!important;}
  body.ds.admin-bar #impact-primary-navigation.main.menu-primary__wrapper {
    top:calc(var(--contentcv-header-mobile,60px) + 46px)!important;
    height:calc(100dvh - var(--contentcv-header-mobile,60px) - 46px)!important;
  }
}
@media (min-width:783px) and (max-width:991px) {
  body.ds.admin-bar .navigationcontainer {top:32px!important;}
  body.ds.admin-bar #impact-primary-navigation.main.menu-primary__wrapper {
    top:calc(var(--contentcv-header-mobile,60px) + 32px)!important;
    height:calc(100dvh - var(--contentcv-header-mobile,60px) - 32px)!important;
  }
}

/* Mobile-only footer alignment fix: source CSS centered footer <li>/<a> even with left-aligned headings. */
@media (max-width: 991px) {
  body.ds #footer.contentcv-footer .contentcv-footer-inner,
  body.ds #footer.contentcv-footer .contentcv-footer-intro,
  body.ds #footer.contentcv-footer .contentcv-footer-intro p,
  body.ds #footer.contentcv-footer .contentcv-footer-brand,
  body.ds #footer.contentcv-footer .contentcv-footer-brand a,
  body.ds #footer.contentcv-footer .contentcv-footer-contact,
  body.ds #footer.contentcv-footer #footerMenu.contentcv-footer-columns,
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock,
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .mainMenuItem,
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .submenu,
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .submenu ul,
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .submenu li,
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .submenu li a,
  body.ds #footer.contentcv-footer .contentcv-footer-bottom,
  body.ds #footer.contentcv-footer .contentcv-footer-bottom > div,
  body.ds #footer.contentcv-footer .contentcv-footer-bottom span {
    text-align: left !important;
  }
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .submenu li {
    display: block !important;
  }
  body.ds #footer.contentcv-footer #footerMenu .widgetBlock .submenu li a {
    display: inline-block !important;
  }
}

/* Mobile 4-item bottom navigation, compact monochrome v2026-10-17.
   This controls the WHITE fixed bottom bar, not the DARK 4-column footer.
   Loaded last so Impact per-page a/link styles cannot turn labels blue. */
@media (max-width: 991px) {
  body.ds nav.contentcv-mobile-bottom {
    box-sizing: border-box !important;
    display: grid !important;
    /* Above source hero/video layers, below the hamburger overlay (2147482000). */
    z-index: 2147481000 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    height: calc(54px + env(safe-area-inset-bottom, 0px)) !important;
    min-height: 54px !important;
    max-height: none !important;
    padding: 4px max(8px, env(safe-area-inset-right, 0px)) calc(4px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px)) !important;
    background: #fff !important;
    border-top: 1px solid #e7e7e7 !important;
    box-shadow: 0 -2px 10px rgba(0,0,0,.055) !important;
  }
  body.ds nav.contentcv-mobile-bottom > a,
  body.ds nav.contentcv-mobile-bottom > a:link,
  body.ds nav.contentcv-mobile-bottom > a:visited,
  body.ds nav.contentcv-mobile-bottom > a:hover,
  body.ds nav.contentcv-mobile-bottom > a:focus,
  body.ds nav.contentcv-mobile-bottom > a:active {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    color: #171717 !important;
    background: transparent !important;
    font-family: 'Plus Jakarta Sans', Arial, sans-serif !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-decoration: none !important;
    padding: 0 2px !important;
    margin: 0 !important;
    min-height: 44px !important;
    height: 45px !important;
    width: 100% !important;
    white-space: nowrap !important;
    transition: none !important;
    -webkit-tap-highlight-color: transparent;
  }
  body.ds nav.contentcv-mobile-bottom > a > span,
  body.ds nav.contentcv-mobile-bottom > a:is(:link, :visited, :hover, :focus, :active) > span {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    line-height: 19px !important;
    height: 19px !important;
    min-height: 19px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #171717 !important;
  }
  body.ds { padding-bottom: calc(54px + env(safe-area-inset-bottom, 0px)) !important; }
}