.portable-mobile-nav {
  display: none;
}

/* Match the breakpoint and 72px mobile header in the base stylesheet. */
@media (max-width: 800px) {
  .portable-mobile-nav:not([hidden]) {
    display: grid;
    max-height: calc(100vh - 72px);
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }
}

/* Keep the mobile consultation label and its icon together on one line. */
.portable-mobile-nav .nav-contact {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  white-space: nowrap;
}

.portable-mobile-nav .nav-contact > svg {
  flex: 0 0 auto;
}

/* Keep the hero copy on the same 1440px grid as the sections below it.
   The bundled stylesheet previously moved it only above 1700px, causing a
   visible horizontal jump at that breakpoint. */
.reset-intelligence .reset-copy {
  margin-left: max(0px, calc((100vw - 1440px) / 2 - 56px));
}

@media (max-width: 1100px) {
  .reset-intelligence .reset-copy {
    padding-inline: 36px;
  }
}

@media (max-width: 800px) {
  .reset-intelligence .reset-copy {
    padding-inline: 20px;
  }
}

/* Keep the link reading order while placing the first and last three in columns. */
.footer-main > div {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(3, auto);
  grid-template-columns: max-content max-content;
  column-gap: 56px;
  row-gap: 9px;
  align-content: start;
}

@media (max-width: 760px) {
  .footer-main > div {
    column-gap: 40px;
    row-gap: 12px;
  }
}