/* =========================================================
   DBIZ MEGA MENU

   Structure:
     .megaMenu                  nav wrapper
       .megaMenu__top           top-level list (flex row)
         .megaMenu__topItem     each top-level li
           .megaMenu__trigger   button (has children)
           .megaMenu__topLink   link (no children)
           .megaMenu__panel     dropdown
========================================================= */
/* =========================================================
   NEUTRALISE LEGACY HEADER CSS

   layout.css carries ~1400 lines of ID-scoped rules written
   for the old menu markup (#block-dbiz-dbizheader > ul > li...).
   Those selectors outrank plain classes, so every mega-menu
   rule below is prefixed with the same ID to match.

   TODO: delete the legacy block from layout.css and drop
   these prefixes.
========================================================= */
#block-dbiz-dbizheader .megaMenu__detailTitle {
  display: flex;
  align-items: baseline;
  gap: 14px;

  margin: 0;

  color: #ffffff;
  font-family: var(--font-sans);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.megaMenu__detailCount {
  flex: 0 0 auto;

  padding: 4px 9px;
  border: 1px solid rgba(240, 123, 47, 0.28);

  color: #f07b2f;
  font-family: var(--font-mono);
  font-size: 0.55rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

#block-dbiz-dbizheader .megaMenu__detailDesc,
#block-dbiz-dbizheader .megaMenu__detailDesc p,
#block-dbiz-dbizheader .megaMenu__detailDesc div {
  margin: 12px 0 0;

  color: rgba(226, 234, 247, 0.55);
  font-family: var(--font-sans);
  font-size: 0.88rem;
  font-weight: 400;
  line-height: 1.65;
}

#block-dbiz-dbizheader .megaMenu__detailDesc p:last-child {
  margin-bottom: 0;
}

/* =========================================================
   TOP LEVEL — USE LAYOUT.CSS HEADER STYLES
========================================================= */

#block-dbiz-dbizheader .megaMenu__trigger,
#block-dbiz-dbizheader .megaMenu__topLink {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 34px;
  padding: 8px 16px;

  font-family: var(--font-sans);
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.02em;
  white-space: nowrap;

  color: rgba(255,255,255,.62);
  text-decoration: none;

  background: transparent;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 4px;

  outline: none;
  box-shadow: none;

  transition:
    color .2s ease,
    border-color .2s ease,
    background .2s ease;
}

/* space for chevron */
#block-dbiz-dbizheader .megaMenu__topItem.has-children .megaMenu__trigger {
  padding-right: 36px;
}
#block-dbiz-dbizheader .megaMenu__top {
  display: flex;
  align-items: center;
  gap: 12px; /* adjust 8–16px as needed */

  margin: 0;
  padding: 0;
  list-style: none;
}
/* corner brackets */
#block-dbiz-dbizheader .megaMenu__trigger::before,
#block-dbiz-dbizheader .megaMenu__topLink::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 4px;
  height: 4px;
  border: 1px solid rgba(255,255,255,.10);
  border-right: none;
  border-bottom: none;
  transition: width .2s ease, height .2s ease, border-color .2s ease;
}

#block-dbiz-dbizheader .megaMenu__trigger::after,
#block-dbiz-dbizheader .megaMenu__topLink::after {
  content: "";
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 4px;
  height: 4px;
  border: 1px solid rgba(255,255,255,.10);
  border-left: none;
  border-top: none;
  transition: width .2s ease, height .2s ease, border-color .2s ease;
}

/* chevron */
#block-dbiz-dbizheader .megaMenu__topItem.has-children {
  position: relative;
}

#block-dbiz-dbizheader .megaMenu__topItem.has-children::after {
  content: "";
  position: absolute;
  right: 15px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 2px solid rgba(255,255,255,.28);
  border-bottom: 2px solid rgba(255,255,255,.28);
  transform: translateY(-65%) rotate(45deg);
  pointer-events: none;
  transition: border-color .2s ease, transform .2s ease;
}

/* hover / active */
#block-dbiz-dbizheader .megaMenu__trigger:hover,
#block-dbiz-dbizheader .megaMenu__topLink:hover,
#block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"],
#block-dbiz-dbizheader .megaMenu__topLink.is-active,
#block-dbiz-dbizheader .megaMenu__topLink[aria-current="page"] {
  color: #F18943;
  background: transparent;
  border-color: transparent;
}

#block-dbiz-dbizheader .megaMenu__trigger:hover::before,
#block-dbiz-dbizheader .megaMenu__trigger:hover::after,
#block-dbiz-dbizheader .megaMenu__topLink:hover::before,
#block-dbiz-dbizheader .megaMenu__topLink:hover::after,
#block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"]::before,
#block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"]::after {
  width: 10px;
  height: 10px;
  border-color: #F18943;
}

#block-dbiz-dbizheader .megaMenu__topItem.has-children:hover::after,
#block-dbiz-dbizheader .megaMenu__topItem.has-children:focus-within::after {
  border-color: #F18943;
  transform: translateY(-35%) rotate(225deg);
}
/* =========================================================
   PANEL
========================================================= */

#block-dbiz-dbizheader .megaMenu__panel {
  position: absolute;
  top: 162%;
  left: -180px;
  z-index: 10002;

  width: min(980px, 92vw);
  min-width: 0;

  margin: 0;
  padding: 0;

  background: #070f22;
  border: 1px solid rgba(240, 123, 47, 0.18);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);

  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform: none;
}

#block-dbiz-dbizheader .megaMenu__panel[hidden] {
  display: none;
}

#block-dbiz-dbizheader .megaMenu__panel::before {
  content: none;
}

/* =========================================================
   LISTS INSIDE THE PANEL
========================================================= */

#block-dbiz-dbizheader .megaMenu__list {
  position: static;

  width: auto;
  min-width: 0;

  margin: 0;
  padding: 0;

  background: transparent;
  border: none;
  border-right: 1px solid rgba(226, 234, 247, 0.08);

  list-style: none;

  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

#block-dbiz-dbizheader .megaMenu__listItem {
  position: relative;
  display: block;
  width: 100%;

  margin: 0;
  padding: 0;

  list-style: none;
}

#block-dbiz-dbizheader .megaMenu__listItem::after {
  content: none;
}

#block-dbiz-dbizheader .megaMenu__listLink {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  width: 100%;
  min-height: 0;

  padding: 15px 22px;

  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(226, 234, 247, 0.06);
  border-left: 2px solid transparent;
  border-radius: 0;

  color: rgba(255,255,255,.6);
  font-family: var(--font-sans);
  font-size: 0.94rem;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: normal;

  text-decoration: none;

  transition:
    background-color 0.16s ease,
    border-left-color 0.16s ease,
    color 0.16s ease;
    font-family: "DM Sans", "DM Sans Fallback", ui-sans-serif, system-ui, sans-serif !important;
}

#block-dbiz-dbizheader .megaMenu__listLink::before,
#block-dbiz-dbizheader .megaMenu__listLink::after {
  content: none;
}

#block-dbiz-dbizheader .megaMenu__listLink:hover,
#block-dbiz-dbizheader .megaMenu__listLink.is-active {
  background-color: rgba(226, 234, 247, 0.045);
  border-left-color: #f07b2f;
  border-bottom-color: rgba(226, 234, 247, 0.06);
  color: #ffffff !important;
}

/* =========================================================
   SUBLIST (third level) inside the detail pane
========================================================= */

#block-dbiz-dbizheader .megaMenu__subList {
  position: static;

  width: auto;
  min-width: 0;

  margin: 20px 0 0;
  padding: 0;

  background: transparent;
  border: none;

  list-style: none;

  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  
}

#block-dbiz-dbizheader .megaMenu__subList > li {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

#block-dbiz-dbizheader .megaMenu__subList > li::after {
  content: none;
}
/* Right detail pane */
#block-dbiz-dbizheader .megaMenu__detail {
  padding: 28px 32px;
}

/* Remove the left/right gap */
#block-dbiz-dbizheader .megaMenu__subList {
  margin: 20px -32px 0;   /* <-- key change */
  padding: 0;
  list-style: none;
}

#block-dbiz-dbizheader .megaMenu__subList > li {
  position: relative;
  margin: 0;
  list-style: none;
}

#block-dbiz-dbizheader .megaMenu__subList > li::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(226,234,247,.08);
}

#block-dbiz-dbizheader .megaMenu__subLink {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;

  width: 100%;
  min-height: 44px;
  padding: 0 32px;

  border-left: 2px solid transparent;
  text-decoration: none;
  color: rgba(255,255,255,.6);
font-family: "DM Sans", "DM Sans Fallback", ui-sans-serif, system-ui, sans-serif !important;
  transition: background .16s ease, border-left-color .16s ease, color .16s ease;
}

#block-dbiz-dbizheader .megaMenu__subLink:hover,
#block-dbiz-dbizheader .megaMenu__subLink.is-active,
#block-dbiz-dbizheader .megaMenu__subLink[aria-current="page"] {
  background: rgba(226,234,247,.045);
  border-left-color: #F07B2F;
  color: #FFF !important;
}
.megaMenu {
  position: relative;
}

/* =========================================================
   TOP LEVEL
========================================================= */

.megaMenu__top {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;

  margin: 0;
  padding: 0;

  list-style: none;
}

.megaMenu__topItem {
  position: static;
  margin: 0;
  padding: 0;
  list-style: none;
}

.megaMenu__trigger,
.megaMenu__topLink {
  display: inline-flex;
  align-items: center;

  padding: 12px 20px;

  background: transparent;
  border: 1px solid transparent;
  border-radius: 0;

  color: #e2eaf7;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;

  text-decoration: none;
  cursor: pointer;

  transition:
    color 0.18s ease,
    border-color 0.18s ease;
}

.megaMenu__trigger:hover,
.megaMenu__topLink:hover,
.megaMenu__trigger:focus-visible,
.megaMenu__topLink:focus-visible,
.megaMenu__trigger[aria-expanded='true'] {
  color: #f07b2f;
  border-color: rgba(240, 123, 47, 0.32);
}

.megaMenu__trigger:focus-visible,
.megaMenu__topLink:focus-visible {
  outline: 2px solid #f07b2f;
  outline-offset: 2px;
}

/* =========================================================
   PANEL
========================================================= */

.megaMenu__panel {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 60;

  width: min(980px, 92vw);

  background: #0d1b3e;
  border: 1px solid rgba(240, 123, 47, 0.18);

  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

.megaMenu__panel[hidden] {
  display: none;
}

.megaMenu__panelHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;

  padding: 14px 24px;
  border-bottom: 1px solid rgba(226, 234, 247, 0.08);

  color: rgba(226, 234, 247, 0.45);
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
   &::before,
  &::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 5px;
    z-index: 2;
    pointer-events: none;
  }

  &::before {
    left: 5px;
    border-top: 1px solid rgba(240,123,47,.55);
    border-left: 1px solid rgba(240,123,47,.55);
  }

  &::after {
    right: 5px;
    border-top: 1px solid rgba(240,123,47,.55);
    border-right: 1px solid rgba(240,123,47,.55);
  }
}

.megaMenu__dwg em {
  color: #f07b2f;
  font-style: normal;
}

.megaMenu__panelBody {
  display: grid;
  grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
  align-items: stretch;
}

/* =========================================================
   LEFT COLUMN — item list
========================================================= */

.megaMenu__list {
  margin: 0;
  padding: 0;

  list-style: none;
  border-right: 1px solid rgba(226, 234, 247, 0.08);
}

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

.megaMenu__listLink {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  padding: 15px 22px;

  border-bottom: 1px solid rgba(226, 234, 247, 0.06);
  border-left: 2px solid transparent;

  color: #e2eaf7;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.35;

  text-decoration: none;

  transition:
    background-color 0.16s ease,
    border-left-color 0.16s ease,
    color 0.16s ease;
}

.megaMenu__listLink:hover,
.megaMenu__listLink.is-active {
  background-color: rgba(226, 234, 247, 0.045);
  border-left-color: #f07b2f;
  color: #ffffff;
}

.megaMenu__listLink:focus-visible {
  outline: 2px solid #f07b2f;
  outline-offset: -2px;
}

.megaMenu__listTitle {
  min-width: 0;
}

.megaMenu__badge {
  flex: 0 0 auto;

  padding: 4px 8px;
  border: 1px solid rgba(226, 234, 247, 0.18);

  color: rgba(226, 234, 247, 0.5);
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.54rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.megaMenu__icon {
  flex: 0 0 auto;
  display: inline-flex;
  color: rgba(226, 234, 247, 0.28);
}

/* =========================================================
   RIGHT COLUMN — detail pane
========================================================= */

.megaMenu__detail {
  padding: 28px 32px;
  min-width: 0;
}

.megaMenu__detailPane[hidden] {
  display: none;
}

.megaMenu__detailTitle {
  margin: 0;

  color: #ffffff;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.megaMenu__detailDesc {
  margin-top: 12px;
}

.megaMenu__detailDesc p {
  margin: 0 0 8px;

  color: rgba(226, 234, 247, 0.62);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 0.9rem;
  line-height: 1.65;
}

.megaMenu__detailDesc p:last-child {
  margin-bottom: 0;
}

/* Third-level links inside the detail pane */

.megaMenu__subList {
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

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

.megaMenu__subLink {
  display: block;
  padding: 6px 0;

  color: rgba(226, 234, 247, 0.6);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 0.85rem;
  line-height: 1.5;

  text-decoration: none;
  transition: color 0.16s ease;
}

.megaMenu__subLink:hover {
  color: #f07b2f;
}

.megaMenu__detailLink {
  display: inline-block;
  margin-top: 24px;

  color: #f07b2f;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.64rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
}

.megaMenu__detailLink:hover {
  text-decoration: underline;
}

/* =========================================================
   TABLET / MOBILE
========================================================= */

@media (max-width: 1023px) {

  .megaMenu__top {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .megaMenu__topItem {
    position: relative;
  }

  .megaMenu__trigger,
  .megaMenu__topLink {
    width: 100%;
    justify-content: space-between;
    padding: 14px 18px;
    border: none;
    border-bottom: 1px solid rgba(226, 234, 247, 0.08);
  }

  .megaMenu__panel {
    position: static;
    width: 100%;
    border: none;
    box-shadow: none;
    background: rgba(255, 255, 255, 0.02);
  }

  .megaMenu__panelHead {
    padding: 12px 18px;
  }

  .megaMenu__panelBody {
    grid-template-columns: 1fr;
  }

  .megaMenu__list {
    border-right: none;
  }

  .megaMenu__listLink {
    padding: 13px 18px;
  }

  /* The hover-swap pane makes no sense on touch */
  .megaMenu__detail {
    display: none;
  }

}

/* Large = Solutions */
.megaMenu__panel--large {
  width: 1080px;
}

/* Company mega menu only */
#block-dbiz-dbizheader .megaMenu__panel--small {
  width: 420px;          /* reduce from 380px */
  min-width: 420px;
}

#block-dbiz-dbizheader .megaMenu__panel--small .megaMenu__panelBody {
  display: block;
}

#block-dbiz-dbizheader .megaMenu__panel--small .megaMenu__list {
  border-right: 0;
}

#block-dbiz-dbizheader .megaMenu__panel--small .megaMenu__detail {
  display: none;
}

.megaMenu__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 7px;
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.45);
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.megaMenu__icon {
  color: rgba(255,255,255,.28);
}

.megaMenu__listLink:hover .megaMenu__icon,
.megaMenu__listLink.is-active .megaMenu__icon {
  color: #F18943;
}


/* =========================================================
   DBIZ MEGA MENU — MOBILE NAVIGATION (<= 991px)
   Paste at the very END of your mega menu stylesheet.
   Everything is inside the media query, so desktop is untouched.
========================================================= */
@media (max-width: 991px) {

  /* ---------- wrapper + top level list ---------- */
  #block-dbiz-dbizheader .megaMenu,
  #block-dbiz-dbizheader .megaMenu__top {
    width: 100%;
  }

  #block-dbiz-dbizheader .megaMenu__top {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  #block-dbiz-dbizheader .megaMenu__topItem {
    position: relative;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  /* ---------- top level buttons / links ---------- */
  #block-dbiz-dbizheader .megaMenu__trigger,
  #block-dbiz-dbizheader .megaMenu__topLink {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    min-height: 0;
    padding: 18px 0;

    border: 0;
    border-radius: 0;

    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0;
    white-space: normal;
    text-align: left;
  }

  #block-dbiz-dbizheader .megaMenu__topItem.has-children .megaMenu__trigger {
    padding-right: 28px;
  }

  #block-dbiz-dbizheader .megaMenu__trigger:hover,
  #block-dbiz-dbizheader .megaMenu__topLink:hover,
  #block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"] {
    color: #f07b2f;
  }

  /* remove desktop corner brackets + chevron */
  #block-dbiz-dbizheader .megaMenu__trigger::before,
  #block-dbiz-dbizheader .megaMenu__topLink::before,
  #block-dbiz-dbizheader .megaMenu__topLink::after,
  #block-dbiz-dbizheader .megaMenu__topItem.has-children::after,
  #block-dbiz-dbizheader .megaMenu__topItem.has-children:hover::after,
  #block-dbiz-dbizheader .megaMenu__topItem.has-children:focus-within::after {
    content: none;
  }

  /* corner-bracket icon (closed = full, open = contracted + orange) */
  #block-dbiz-dbizheader .megaMenu__trigger::after,
  #block-dbiz-dbizheader .megaMenu__trigger:hover::after,
  #block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"]::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 2px;
    bottom: auto;
    left: auto;
    width: 12px;
    height: 12px;
    border: 0;

    background-color: rgba(255, 255, 255, 0.3);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M0 4V0h4M8 0h4v4M12 8v4H8M4 12H0V8' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M0 4V0h4M8 0h4v4M12 8v4H8M4 12H0V8' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
    transform: translateY(-50%);
    transition: transform 0.2s ease, background-color 0.2s ease;
  }

  #block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"]::after {
    background-color: #f07b2f;
    transform: translateY(-50%) scale(0.5);
  }

  /* ---------- panel: inline, no dropdown look ---------- */
  #block-dbiz-dbizheader .megaMenu__panel,
  #block-dbiz-dbizheader .megaMenu__panel--small,
  #block-dbiz-dbizheader .megaMenu__panel--large {
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    min-width: 0;

    background: transparent;
    border: 0;
    box-shadow: none;
  }

  #block-dbiz-dbizheader .megaMenu__panel[hidden] {
    display: none;
  }

  #block-dbiz-dbizheader .megaMenu__panel:not([hidden]) {
    display: block;
  }

  /* hide the desktop-only header strip (and its absolute brackets) */
  #block-dbiz-dbizheader .megaMenu__panelHead,
  #block-dbiz-dbizheader .megaMenu__panelHead::before,
  #block-dbiz-dbizheader .megaMenu__panelHead::after {
    display: none;
    content: none;
  }

  /* hover-swap detail pane is not used on touch */
  #block-dbiz-dbizheader .megaMenu__detail {
    display: none;
  }

  #block-dbiz-dbizheader .megaMenu__panelBody {
    display: block;
    height: auto;
    max-height: none;
    overflow: visible;
    opacity: 1;
    visibility: visible;
    padding: 0 0 8px;
  }

  #block-dbiz-dbizheader .megaMenu__list {
    display: block;
    height: auto;
    max-height: none;
    overflow: visible;
    opacity: 1;
    visibility: visible;
    border: 0;
  }

  #block-dbiz-dbizheader .megaMenu__listItem {
    display: block;
  }

  /* ---------- level 2: direct links ---------- */
  #block-dbiz-dbizheader .megaMenu__listLink {
    padding: 13px 10px;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.88rem;
  }

  /* ---------- level 2: rows with children ---------- */
  #block-dbiz-dbizheader .megaMenu__listRow {
    display: flex;
    align-items: stretch;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(226, 234, 247, 0.06);
  }

  #block-dbiz-dbizheader .megaMenu__listTitleLink {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    padding: 13px 10px;

    color: rgba(255, 255, 255, 0.6);
    font-family: "DM Sans", "DM Sans Fallback", ui-sans-serif, system-ui, sans-serif;
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
    transition: color 0.16s ease;
  }

  #block-dbiz-dbizheader .megaMenu__listItem.is-open > .megaMenu__listRow .megaMenu__listTitleLink {
    color: #f07b2f;
  }

  #block-dbiz-dbizheader .megaMenu__submenuToggle {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    padding: 0;

    background: transparent;
    border: 0;
    color: rgba(255, 255, 255, 0.28);
    cursor: pointer;
  }

  #block-dbiz-dbizheader .megaMenu__submenuToggle .megaMenu__icon {
    display: inline-flex;
    color: inherit;
  }

  #block-dbiz-dbizheader .megaMenu__submenuToggle svg {
    transition: transform 0.2s ease;
  }

  #block-dbiz-dbizheader .megaMenu__submenuToggle[aria-expanded="true"] {
    color: #f07b2f;
  }

  #block-dbiz-dbizheader .megaMenu__submenuToggle[aria-expanded="true"] svg {
    transform: scale(0.5);
  }

  /* ---------- level 3 ---------- */
  #block-dbiz-dbizheader .megaMenu__subList {
    margin: 0 0 0 10px;
    padding: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
  }

  #block-dbiz-dbizheader .megaMenu__subList[hidden] {
    display: none;
  }

  #block-dbiz-dbizheader .megaMenu__subList > li::after {
    content: none;
  }

  #block-dbiz-dbizheader .megaMenu__subLink {
    display: grid;
    grid-template-columns: 46px 1fr;
    align-items: center;
    min-height: 40px;
    padding: 0 10px;
    border-left: 0;
  }

  #block-dbiz-dbizheader .megaMenu__subIndex {
    color: rgba(255, 255, 255, 0.35);
    font-family: var(--font-mono, "DM Mono", monospace);
    font-size: 0.6rem;
    letter-spacing: 0.1em;
  }

  #block-dbiz-dbizheader .megaMenu__subTitle {
    color: inherit;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.35;
  }
}

/* =========================================================
   MOBILE OVERRIDES — beats the legacy `#block-dbiz-dbizheader ul ul`
   rules in layout.css (display:none !important, etc.).

   Paste AFTER mega-menu-mobile.css. Higher specificity
   (#id + 2 classes) wins over the legacy !important rules,
   so load order does not matter.
========================================================= */
@media (max-width: 991px) {

  /* ---------- level 2 list: force visible ---------- */
  #block-dbiz-dbizheader .megaMenu .megaMenu__list {
    display: block !important;
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  /* ---------- level 3 list: visible unless [hidden] ---------- */
  #block-dbiz-dbizheader .megaMenu .megaMenu__subList {
    display: block !important;
    position: static !important;
    width: auto !important;
    margin: 0 0 0 10px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__subList[hidden] {
    display: none !important;
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__subItem {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* ---------- level 3 links: undo legacy orange / 58px padding ---------- */
  #block-dbiz-dbizheader .megaMenu .megaMenu__subLink {
    display: grid !important;
    grid-template-columns: 46px 1fr !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 10px !important;

    color: rgba(255, 255, 255, 0.6) !important;
    background: transparent !important;
    border: 0 !important;

    font-family: "DM Sans", "DM Sans Fallback", ui-sans-serif, system-ui, sans-serif !important;
    font-size: 0.84rem !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__subLink:hover,
  #block-dbiz-dbizheader .megaMenu .megaMenu__subLink:focus-visible {
    color: #f07b2f !important;
    background: rgba(226, 234, 247, 0.045) !important;
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__subIndex {
    color: rgba(255, 255, 255, 0.35) !important;
    font-family: "DM Mono", ui-monospace, monospace !important;
    font-size: 0.6rem !important;
    letter-spacing: 0.1em !important;
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__subTitle {
    color: inherit !important;
  }
}

/* =========================================================
   MOBILE SPACING — left / right breathing room
   (keep at the very end)
========================================================= */
@media (max-width: 991px) {

  /* top level rows */
  #block-dbiz-dbizheader .megaMenu__trigger,
  #block-dbiz-dbizheader .megaMenu__topLink {
    padding-left: 20px;
    padding-right: 20px;
  }

  #block-dbiz-dbizheader .megaMenu__topItem.has-children .megaMenu__trigger {
    padding-left: 20px;
    padding-right: 48px;
  }

  /* corner icon on top level rows */
  #block-dbiz-dbizheader .megaMenu__trigger::after,
  #block-dbiz-dbizheader .megaMenu__trigger:hover::after,
  #block-dbiz-dbizheader .megaMenu__trigger[aria-expanded="true"]::after {
    right: 20px;
  }

  /* level 2 / level 3 block sits inset from both edges */
  #block-dbiz-dbizheader .megaMenu__panelBody {
    padding: 0 20px 8px;
  }
}

/* =========================================================
   LIVE MARKUP SUPPORT — rows are <a class="megaMenu__listLink">
   and sub-lists are JS-built copies (.megaMenu__subList--mobile)
========================================================= */
@media (max-width: 991px) {

  #block-dbiz-dbizheader .megaMenu .megaMenu__icon svg {
    transition: transform 0.2s ease;
  }

  /* open row: orange title, contracted orange icon, no desktop highlight */
  #block-dbiz-dbizheader .megaMenu .megaMenu__listLink.is-active,
  #block-dbiz-dbizheader .megaMenu .megaMenu__listLink[aria-expanded="true"] {
    color: #f07b2f !important;
    background-color: transparent;
    border-left-color: rgba(255, 255, 255, 0.1);
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__listLink.is-active .megaMenu__icon,
  #block-dbiz-dbizheader .megaMenu .megaMenu__listLink[aria-expanded="true"] .megaMenu__icon {
    color: #f07b2f;
  }

  #block-dbiz-dbizheader .megaMenu .megaMenu__listLink.is-active .megaMenu__icon svg,
  #block-dbiz-dbizheader .megaMenu .megaMenu__listLink[aria-expanded="true"] .megaMenu__icon svg {
    transform: scale(0.5);
  }
}

/* JS-built copies exist only for mobile */
@media (min-width: 992px) {
  #block-dbiz-dbizheader .megaMenu .megaMenu__subList--mobile {
    display: none !important;
  }
}

/* =========================================================
   DESKTOP SUPPORT FOR .megaMenu__listRow / __listTitleLink /
   __submenuToggle (the "has-submenu" markup)

   Until now this markup only had mobile styling, so on desktop
   it rendered as bare unstyled text. This gives it the same
   look as .megaMenu__listLink, and reveals the third level
   (.megaMenu__subList) as a hover flyout, since this markup
   has no detail pane to swap into.

   Append this ANYWHERE in the stylesheet, outside any
   max-width media query — it is the base (all-width) styling,
   with one min-width block for the desktop-only flyout.
========================================================= */

#block-dbiz-dbizheader .megaMenu__listItem.has-submenu {
  position: relative;
}

#block-dbiz-dbizheader .megaMenu__listRow {
  display: flex;
  align-items: stretch;

  border-bottom: 1px solid rgba(226, 234, 247, 0.06);
  border-left: 2px solid transparent;

  transition:
    background-color 0.16s ease,
    border-left-color 0.16s ease;
}

#block-dbiz-dbizheader .megaMenu__listRow:hover,
#block-dbiz-dbizheader .megaMenu__listItem.has-submenu:hover > .megaMenu__listRow,
#block-dbiz-dbizheader .megaMenu__listItem.has-submenu.is-open > .megaMenu__listRow {
  background-color: rgba(226, 234, 247, 0.045);
  border-left-color: #f07b2f;
}

#block-dbiz-dbizheader .megaMenu__listTitleLink {
  flex: 1 1 auto;

  display: flex;
  align-items: center;

  padding: 15px 22px;

  color: rgba(255, 255, 255, 0.6);
  font-family: "DM Sans", "DM Sans Fallback", ui-sans-serif, system-ui, sans-serif;
  font-size: 0.94rem;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;

  transition: color 0.16s ease;
}

#block-dbiz-dbizheader .megaMenu__listRow:hover .megaMenu__listTitleLink,
#block-dbiz-dbizheader .megaMenu__listItem.has-submenu:hover > .megaMenu__listRow .megaMenu__listTitleLink,
#block-dbiz-dbizheader .megaMenu__listItem.has-submenu.is-open > .megaMenu__listRow .megaMenu__listTitleLink {
  color: #ffffff;
}

#block-dbiz-dbizheader .megaMenu__submenuToggle {
  flex: 0 0 auto;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 44px;
  padding: 0;

  background: transparent;
  border: 0;
  color: rgba(255, 255, 255, 0.28);
  cursor: pointer;
}

#block-dbiz-dbizheader .megaMenu__submenuToggle .megaMenu__icon {
  display: inline-flex;
  color: inherit;
}

#block-dbiz-dbizheader .megaMenu__listRow:hover .megaMenu__submenuToggle,
#block-dbiz-dbizheader .megaMenu__listItem.has-submenu:hover > .megaMenu__listRow .megaMenu__submenuToggle,
#block-dbiz-dbizheader .megaMenu__listItem.has-submenu.is-open > .megaMenu__listRow .megaMenu__submenuToggle {
  color: #f07b2f;
}

/* ---------- third level: hover flyout on desktop only ---------- */

@media (min-width: 1024px) {

  #block-dbiz-dbizheader .megaMenu__listItem.has-submenu > .megaMenu__subList {
    display: block;
    position: absolute;

    top: 0;
    left: 100%;
    z-index: 1;

    width: 260px;
    min-width: 260px;

    margin: 0;
    padding: 6px;

    background: #070f22;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
      opacity 0.2s ease,
      visibility 0.2s ease;
  }

  /* [hidden] is server-rendered; override it so hover can reveal it */
  #block-dbiz-dbizheader .megaMenu__listItem.has-submenu > .megaMenu__subList[hidden] {
    display: block;
  }

  #block-dbiz-dbizheader .megaMenu__listItem.has-submenu:hover > .megaMenu__subList,
  #block-dbiz-dbizheader .megaMenu__listItem.has-submenu:focus-within > .megaMenu__subList {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  #block-dbiz-dbizheader .megaMenu__listItem.has-submenu > .megaMenu__subList .megaMenu__subLink {
    padding: 0 14px;
    min-height: 40px;
  }

  #block-dbiz-dbizheader .megaMenu__listItem.has-submenu > .megaMenu__subList .megaMenu__subLink:hover {
    background: rgba(226, 234, 247, 0.045);
  }
}

/* =========================================================
   DBIZ MEGA MENU
   DIRECT-ONLY DROPDOWN
   Example: OUR COMPANY
========================================================= */

/* =========================================================
   DBIZ MEGA MENU
   DIRECT-ONLY DROPDOWN
   Example: OUR COMPANY
========================================================= */

@media (min-width: 992px) {


  /* =======================================================
     DIRECT PANEL
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel.megaMenu__panel--direct {

    position: absolute;

    left: 0 !important;
    right: auto !important;

    width: 400px !important;
    min-width: 400px !important;
    max-width: 400px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #070f22 !important;

    border: 1px solid rgba(255, 255, 255, 0.08) !important;

    box-shadow: none !important;

    overflow: hidden !important;

    z-index: 9999;

    box-sizing: border-box;
  }


  /* =======================================================
     PANEL HEADER

     LEFT:
       DWG · COMPANY-01

     RIGHT:
       3 PAGES
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__panelHead {

    position: relative;

    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    width: 100% !important;

    height: 45px !important;

    min-height: 45px !important;

    margin: 0 !important;

    padding: 0 16px !important;

    box-sizing: border-box;

    background: #070f22 !important;

    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }


  /* =======================================================
     DWG LABEL
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__dwg {

    display: inline-flex !important;

    align-items: center;

    flex: 0 0 auto;

    margin: 0 !important;

    padding: 0 !important;

    font-size: 8px !important;

    line-height: 1 !important;

    font-weight: 500 !important;

    letter-spacing: 1.25px !important;

    text-transform: uppercase;

    white-space: nowrap;

    color: rgba(255, 255, 255, 0.38) !important;
  }


  /* =======================================================
     DWG VALUE

     COMPANY-01
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__dwg em {

    display: inline-block;

    margin-left: 4px !important;

    font-style: normal !important;

    font-weight: 600 !important;

    letter-spacing: 1.2px !important;

    color: #f47721 !important;
  }


  /* =======================================================
     COUNT

     3 PAGES
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__count {

    display: inline-flex !important;

    align-items: center;

    flex: 0 0 auto;

    margin: 0 !important;

    padding: 0 !important;

    font-size: 8px !important;

    line-height: 1 !important;

    font-weight: 500 !important;

    letter-spacing: 1.2px !important;

    text-transform: uppercase;

    white-space: nowrap;

    color: rgba(255, 255, 255, 0.42) !important;
  }


  /* =======================================================
     PANEL BODY
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__panelBody {

    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;

    box-sizing: border-box;
  }


  /* =======================================================
     LIST
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__list {

    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;

    list-style: none;

    box-sizing: border-box;
  }


  /* =======================================================
     LIST ITEM
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listItem {

    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    box-sizing: border-box;
  }


  /* =======================================================
     DIRECT LINK
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listLink {

    position: relative;

    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    width: 100% !important;

    min-height: 43px !important;

    margin: 0 !important;

    padding: 0 22px !important;

    box-sizing: border-box;

    background: transparent !important;

    border: 0 !important;

    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;

    text-decoration: none;

    transition:
      background 0.2s ease,
      color 0.2s ease;
  }


  /* =======================================================
     LAST ITEM
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listItem:last-child
  .megaMenu__listLink {

    border-bottom: 0 !important;
  }


  /* =======================================================
     LEFT ORANGE ACTIVE LINE
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listLink::before {

    content: "";

    position: absolute;

    top: 0;
    bottom: 0;
    left: 0;

    width: 2px;

    background: #f47721;

    opacity: 0;

    transition: opacity 0.2s ease;
  }


  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listLink:hover::before,

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listLink.is-active::before {

    opacity: 1;
  }


  /* =======================================================
     DIRECT TITLE
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listTitle {

    display: block;

    min-width: 0;

    padding-right: 12px;

    font-size: 12px !important;

    line-height: 1.35 !important;

    font-weight: 500 !important;

    color: rgba(255, 255, 255, 0.62) !important;

    transition: color 0.2s ease;
  }


  /* HOVER */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listLink:hover
  .megaMenu__listTitle {


    color: #ffffff !important;
  }


  /* ACTIVE */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__listLink.is-active
  .megaMenu__listTitle {

    color: #ffffff !important;
  }


  /* =======================================================
     DIRECT BADGE
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__badge {

    flex: 0 0 auto;

    display: inline-flex !important;

    align-items: center;

    justify-content: center;

    min-width: 44px;

    height: 18px;

    margin-left: auto;

    padding: 0 7px;

    box-sizing: border-box;

    border: 1px solid rgba(255, 255, 255, 0.12) !important;

    background: transparent !important;

    color: rgba(255, 255, 255, 0.38) !important;

    font-size: 7px !important;

    line-height: 1 !important;

    font-weight: 600 !important;

    letter-spacing: 1px !important;

    text-transform: uppercase;
  }


  /* =======================================================
     HIDE RIGHT DETAIL
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__detail {

    display: none !important;
  }


  /* =======================================================
     HIDE ICON
  ======================================================== */

  #block-dbiz-dbizheader
  .megaMenu__panel--direct
  .megaMenu__icon {

    display: none !important;
  }



}

/* =========================================================
   OUR COMPANY — SAME TOP-LEVEL CORNER BRACKETS AS
   SOLUTIONS / INSIGHTS / CAREERS
========================================================= */

@media (min-width: 992px) {

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger {

    position: relative !important;

  }


  /* ---------------------------------------------------------
     TOP LEFT CORNER
  --------------------------------------------------------- */

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger::before {

    content: "" !important;

    position: absolute !important;

    top: -1px !important;
    left: -1px !important;

    width: 4px !important;
    height: 4px !important;

    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-left: 1px solid rgba(255, 255, 255, 0.10) !important;

    border-right: none !important;
    border-bottom: none !important;

    background: transparent !important;

    transition:
      width 0.2s ease,
      height 0.2s ease,
      border-color 0.2s ease;

    pointer-events: none !important;
  }


  /* ---------------------------------------------------------
     BOTTOM RIGHT CORNER
  --------------------------------------------------------- */

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger::after {

    content: "" !important;

    position: absolute !important;

    right: -1px !important;
    bottom: -1px !important;

    width: 4px !important;
    height: 4px !important;

    border-right: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;

    border-left: none !important;
    border-top: none !important;

    background: transparent !important;

    transition:
      width 0.2s ease,
      height 0.2s ease,
      border-color 0.2s ease;

    pointer-events: none !important;
  }


  /* ---------------------------------------------------------
     OUR COMPANY HOVER
  --------------------------------------------------------- */

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger:hover::before,

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger:hover::after,

  /* ---------------------------------------------------------
     OUR COMPANY OPEN / ACTIVE
  --------------------------------------------------------- */

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger[aria-expanded="true"]::before,

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger[aria-expanded="true"]::after {

    width: 10px !important;
    height: 10px !important;

    border-color: #F18943 !important;
  }


  /* ---------------------------------------------------------
     OUR COMPANY TEXT WHEN OPEN
  --------------------------------------------------------- */

  #block-dbiz-dbizheader
  .megaMenu__topItem
  .megaMenu__trigger[aria-expanded="true"] {

    color: #F18943 !important;

    background: transparent !important;

    border-color: transparent !important;
  }

}