/* Footer - nav strip + footer menu + info-block divider (Thistle).
   Moved from typography.css per the CSS file-map (footer chrome -> footer.css).
   Loads after typography (uses .body-sm / .subheading-sm utilities), before style.css. */

/* ── Footer nav strip (.footer-nav) ──────────────────────────
   Desktop: FULL-WIDTH light-purple band behind the nav only (not the logo), .75rem top/bottom,
   dark-navy centred items. Band = a ::before spanning 100vw (the nav wrapper is shrink-to-fit,
   so widening it directly doesn't work). ≤980: band off; nav stacks vertical + centred. */
/* nav-item typography = body-sm (all sizes); clip the 100vw band so it can't push a page h-scroll */
.footer-nav .et_pb_menu__menu nav > ul > li a {
  font-family: var(--font-wavehaus) !important;
  font-size: var(--text-body-sm) !important;
  font-weight: 500 !important;
  line-height: normal !important;
}
.et-l--footer {
  overflow-x: clip;
}
@media (min-width: 981px) {
  .footer-nav .et_pb_menu__wrap {
    position: relative;
    padding: 0.75rem 0 !important;
  }
  .footer-nav .et_pb_menu__menu li a {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  } /* so the .75rem gap is exact, not stacked on Divi's item padding */
  .footer-nav .et_pb_menu__wrap::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    background: var(--light-purple);
  }
  .footer-nav .et_pb_menu__menu {
    position: relative;
    z-index: 1;
    justify-content: center;
  }
  .footer-nav .et_pb_menu__menu a {
    color: var(--dark-navy) !important;
  }
}
@media (max-width: 980px) {
  /* footer menu → vertical, centred, tight (no gap + no link padding) */
  .footer-nav .et_pb_menu__menu nav > ul {
    flex-direction: column !important;
    align-items: center;
    gap: 1rem;
  }
  .footer-nav .et_pb_menu__menu nav > ul > li {
    margin: 0 !important;
  }
  .footer-nav .et_pb_menu__menu nav > ul > li a {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .footer-nav .et_pb_menu__menu a {
    color: var(--background) !important;
  } /* cream on tablet/mobile */
  /* standalone divider → full width on tablet/mobile.
     Higher specificity to beat Divi's base row width (70/80%); the visible line is a ::before. */
  .et-l--footer .et_pb_section .et_pb_row_2_tb_footer {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .et-l--footer .et_pb_row_2_tb_footer .et_pb_column {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .et-l--footer .et_pb_divider_0_tb_footer {
    width: 100% !important;
    max-width: 100% !important;
  }
  .et-l--footer .et_pb_divider_0_tb_footer::before {
    width: 100% !important;
    left: 0 !important;
    right: auto !important;
  }
}

/* ── Footer info block — aligned columns + one continuous divider (desktop) ──
   The info column becomes a grid; the 4 groups are display:contents so their header +
   body flatten into the grid as individual items → headers in row 1, bodies in row 3,
   a single full-width divider (::after) in row 2 between them. Standalone divider (§3)
   hidden here; it returns at ≤980 where the groups stack normally. */
@media (min-width: 981px) {
  .et_pb_column_3_tb_footer {
    display: grid !important;
    grid-template-columns: repeat(4, auto);
    justify-content: space-between;
    align-items: start;
    row-gap: 1.125rem;
  }
  .et_pb_column_3_tb_footer > .et_pb_group {
    display: contents;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(1) > :first-child {
    grid-column: 1;
    grid-row: 1;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(1) > :last-child {
    grid-column: 1;
    grid-row: 3;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(2) > :first-child {
    grid-column: 2;
    grid-row: 1;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(2) > :last-child {
    grid-column: 2;
    grid-row: 3;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(3) > :first-child {
    grid-column: 3;
    grid-row: 1;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(3) > :last-child {
    grid-column: 3;
    grid-row: 3;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(4) > :first-child {
    grid-column: 4;
    grid-row: 1;
  }
  .et_pb_column_3_tb_footer > .et_pb_group:nth-child(4) > :last-child {
    grid-column: 4;
    grid-row: 3;
  }
  .et_pb_column_3_tb_footer::after {
    content: "";
    grid-row: 2;
    grid-column: 1 / -1;
    border-top: 1px solid #ffffff;
  }
  .et_pb_divider_0_tb_footer {
    display: none !important;
  } /* standalone divider moves into the block above */
}