/* ===== 05-footer.css ===== */
/* ===== footer-layout.css ===== */
/* =========================================================
   TERASILICON IQ — FOOTER FINAL BALANCED LAYOUT
   Layout + single-font-family fix only.
   ========================================================= */

.contact-details {
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.contact-details .footer-grid {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  box-sizing: border-box;

  display: grid;
  grid-template-columns:
    minmax(0, 1.18fr)
    minmax(0, 0.95fr)
    minmax(0, 1.18fr)
    minmax(0, 1.05fr)
    minmax(0, 0.95fr)
    minmax(0, 0.82fr);

  column-gap: clamp(28px, 3vw, 58px);
  align-items: start;

  padding-left: clamp(24px, 4vw, 72px);
  padding-right: clamp(24px, 4vw, 72px);
}

/* One font family throughout the footer. */
.contact-details,
.contact-details * {
  font-family: "Space Grotesk", sans-serif;
}

/* Preserve the existing brand treatment. */
.contact-details .contact-intro h2 i {
  font-family: "Space Grotesk", sans-serif;
}

/* Prevent any individual block from forcing the grid wider. */
.contact-details .contact-intro,
.contact-details .footer-column,
.contact-details .footer-directory {
  min-width: 0;
  max-width: 100%;
}

/* Allow long content to wrap instead of causing horizontal overflow. */
.contact-details a,
.contact-details span,
.contact-details p,
.contact-details h3 {
  max-width: 100%;
  overflow-wrap: break-word;
}

/* Keep icons and their text aligned. */
.contact-details .mail-link,
.contact-details .location-link {
  display: inline-flex;
  align-items: flex-start;
  min-width: 0;
}

.contact-details .mail-link span,
.contact-details .location-link span {
  min-width: 0;
}

/* Location should have enough room, but never force the grid wider. */
.contact-details .location-link {
  max-width: 100%;
}

/* Service links should wrap naturally if required. */
.contact-details .footer-directory a {
  white-space: normal;
}

/* Keep the Services column as the right-most grid column,
   without allowing it to overflow the viewport. */
.contact-details .footer-directory:last-child {
  justify-self: stretch;
  min-width: 0;
}

/* Tablet */
@media (max-width: 1150px) {
  .contact-details .footer-grid {
    grid-template-columns:
      minmax(0, 1.1fr)
      minmax(0, 1fr)
      minmax(0, 1.1fr);

    column-gap: 36px;
    row-gap: 48px;

    padding-left: 6vw;
    padding-right: 6vw;
  }

  .contact-details .contact-intro {
    grid-column: 1 / -1;
  }

  .contact-details .footer-directory:last-child {
    justify-self: start;
  }
}

/* Mobile */
@media (max-width: 780px) {
  .contact-details .footer-grid {
    grid-template-columns: 1fr;
    gap: 42px;
    padding-left: 7vw;
    padding-right: 7vw;
  }

  .contact-details .contact-intro {
    grid-column: auto;
  }

  .contact-details .footer-directory:last-child {
    justify-self: stretch;
  }
}

/* =========================================================
   FOOTER — FINAL SPACING / FONT FIX
   ========================================================= */

/* Keep the complete footer on one font family. */
.contact-details,
.contact-details *,
.contact-details a,
.contact-details h2,
.contact-details h3,
.contact-details p,
.contact-details span {
  font-family: "Space Grotesk", sans-serif !important;
}

/* Keep the footer columns separated vertically.
   This fixes links running together such as:
   Formal VerificationSTA & Timing Closure... */
.contact-details .footer-directory {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.contact-details .footer-directory h3 {
  margin-bottom: 26px;
}

.contact-details .footer-directory a {
  display: block !important;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 17px 0 !important;
  line-height: 1.45 !important;
  white-space: normal !important;
}

/* Training should have a clear gap from the service links. */
.contact-details .footer-directory .training-heading {
  margin-top: 18px;
  margin-bottom: 20px;
}

/* Move "Open in Google Maps" slightly to the right,
   while keeping it inside the Location column. */
.contact-details .map-link {
  display: block !important;
  width: fit-content;
  margin-left: 105px !important;
  margin-top: 26px !important;
}

/* Keep the location icon/address alignment unchanged. */
.contact-details .location-link {
  display: flex !important;
  align-items: flex-start;
}

/* Desktop */
@media (min-width: 1151px) {
  .contact-details .footer-directory {
    padding-left: 0;
  }

  .contact-details .map-link {
    margin-left: 105px !important;
  }
}

/* Tablet */
@media (max-width: 1150px) {
  .contact-details .map-link {
    margin-left: 60px !important;
  }
}

/* Mobile */
@media (max-width: 780px) {
  .contact-details .map-link {
    margin-left: 0 !important;
  }
}


/* Exact email icon/text alignment */
.contact-details .mail-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: auto !important;
  margin: 0 0 17px 0 !important;
  line-height: 1.45 !important;
  vertical-align: middle;
}

.contact-details .mail-link img {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 20px !important;
  align-self: center !important;
}

.contact-details .mail-link span {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 20px !important;
  white-space: nowrap;
}

/* =========================================================
   SERVICES / ENGINEERING SERVICES — FINAL TYPOGRAPHY
   Match the "Partner with Terasilicon IQ →" link.
   ========================================================= */

/* Match the Partner link's Space Grotesk typography. */
.contact-details .footer-directory a {
  font-family: "Space Grotesk", sans-serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

/* Tighten the vertical rhythm between service links.
   The previous flex gap + link margin made the lines too far apart. */
.contact-details .footer-directory {
  gap: 0 !important;
}

.contact-details .footer-directory h3 {
  margin-bottom: 22px !important;
}

.contact-details .footer-directory a {
  margin: 0 0 20px 0 !important;
}

/* Keep the last service item from creating unnecessary extra space. */
.contact-details .footer-directory > a:last-of-type {
  margin-bottom: 0 !important;
}

/* Training should have a deliberate but compact separation. */
.contact-details .footer-directory .training-heading {
  margin-top: 28px !important;
  margin-bottom: 20px !important;
}

.contact-details .footer-directory .training-heading + a {
  margin-bottom: 0 !important;
}

/* Keep mobile typography proportional while preserving the same font. */
@media (max-width: 780px) {
  .contact-details .footer-directory a {
    font-size: 16px !important;
    margin-bottom: 16px !important;
  }

  .contact-details .footer-directory h3 {
    margin-bottom: 18px !important;
  }

  .contact-details .footer-directory .training-heading {
    margin-top: 22px !important;
    margin-bottom: 16px !important;
  }
}

/* =========================================================
   FOOTER — COMPACT SERVICE TEXT
   Reduce service text size and vertical spacing.
   ========================================================= */

.contact-details .footer-directory a {
  font-family: "Space Grotesk", sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: normal !important;
  margin: 0 0 12px 0 !important;
}

/* Keep headings slightly larger than their links. */
.contact-details .footer-directory h3 {
  font-size: 16px !important;
  line-height: 1.2 !important;
  margin-bottom: 18px !important;
}

/* Compact the Training separation. */
.contact-details .footer-directory .training-heading {
  margin-top: 20px !important;
  margin-bottom: 12px !important;
}

.contact-details .footer-directory .training-heading + a {
  margin-bottom: 0 !important;
}

/* Keep wrapped items compact. */
.contact-details .footer-directory a {
  overflow-wrap: normal;
  word-break: normal;
}

/* Mobile */
@media (max-width: 780px) {
  .contact-details .footer-directory a {
    font-size: 15px !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
  }

  .contact-details .footer-directory h3 {
    font-size: 16px !important;
    margin-bottom: 16px !important;
  }

  .contact-details .footer-directory .training-heading {
    margin-top: 18px !important;
    margin-bottom: 10px !important;
  }
}

/* =========================================================
   LOCATION — GOOGLE MAPS LINK ALIGNMENT
   Start the Maps link exactly under the address text,
   not under the location icon.
   ========================================================= */

.contact-details .map-link {
  display: block !important;
  width: fit-content !important;
  margin-left: 38px !important;
  margin-top: 22px !important;
}

/* Keep the link aligned with the address text on desktop. */
@media (min-width: 1151px) {
  .contact-details .map-link {
    margin-left: 38px !important;
  }
}

/* Tablet */
@media (max-width: 1150px) and (min-width: 781px) {
  .contact-details .map-link {
    margin-left: 38px !important;
  }
}

/* Mobile: align with the address text as well. */
@media (max-width: 780px) {
  .contact-details .map-link {
    margin-left: 38px !important;
  }
}


/* =========================================================
   FOOTER — TRAINING AS A SEPARATE COLUMN
   ========================================================= */
.contact-details .footer-training {
  justify-self: stretch;
  min-width: 0;
}

.contact-details .footer-training h3 {
  margin-bottom: 22px !important;
}

.contact-details .footer-training a {
  display: block !important;
  width: fit-content;
  max-width: 100%;
  margin: 0 !important;
  font-family: "Space Grotesk", sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
}

@media (max-width: 1150px) {
  .contact-details .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .contact-details .contact-intro {
    grid-column: 1 / -1;
  }

  .contact-details .footer-training {
    justify-self: start;
  }
}

@media (max-width: 780px) {
  .contact-details .footer-grid {
    grid-template-columns: 1fr;
  }

  .contact-details .footer-training {
    justify-self: stretch;
  }
}

/* =========================================================
   HERO — NO VIDEO FALLBACK
   The video asset was intentionally removed. Keep the hero
   visually strong using the Terasilicon IQ brand colors.
   ========================================================= */
.hero {
  background:
    radial-gradient(circle at 78% 35%, rgba(101,53,147,.42), transparent 34%),
    linear-gradient(135deg, #101638 0%, #1a1a49 55%, #372582 100%);
}

.hero-overlay {
  background:
    linear-gradient(90deg, rgba(16,22,56,.96) 0%, rgba(16,22,56,.78) 52%, rgba(55,37,130,.54) 100%) !important;
}

.contact-details .footer-grid{grid-template-columns:minmax(0,1.18fr) minmax(0,.95fr) minmax(0,1.18fr) minmax(0,1.35fr) minmax(0,.82fr)!important}.contact-details .footer-engineering-services a{color:var(--ink);text-decoration:none;position:relative;transition:color .2s ease,padding-left .2s ease}.contact-details .footer-engineering-services a:hover,.contact-details .footer-engineering-services a:focus-visible{color:var(--violet)!important;padding-left:8px}.contact-details .footer-engineering-services a::after{content:" ↗";color:#ef7700;opacity:0;transition:opacity .2s ease}.contact-details .footer-engineering-services a:hover::after,.contact-details .footer-engineering-services a:focus-visible::after{opacity:1}@media(max-width:1150px){.contact-details .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}@media(max-width:780px){.contact-details .footer-grid{grid-template-columns:1fr!important}}


/* =========================================================
   V6.14 DISPLAY FIX — 14" / SCALED DESKTOP
   Keep desktop styling, but compact the grid before it becomes
   cramped on smaller laptop CSS viewports.
   ========================================================= */
@media (max-width: 1240px) and (min-width: 901px) {
  .contact-details .footer-grid {
    grid-template-columns:
      minmax(0, 1.05fr)
      minmax(0, .95fr)
      minmax(0, 1.1fr)
      minmax(0, 1.15fr) !important;
    column-gap: 26px !important;
    row-gap: 34px !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  .contact-details .contact-intro {
    grid-column: 1 / -1;
  }

  .contact-details .footer-careers-training {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 28px !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  .contact-details .footer-careers-training .footer-directory {
    min-width: 0 !important;
    width: 100% !important;
  }

  .contact-details .footer-careers-training h3 {
    margin-bottom: 18px !important;
  }

  .contact-details .footer-careers-training a {
    max-width: 100% !important;
  }

  .contact-details .footer-careers a[href*="careers@terasiliconiq.com"] {
    white-space: nowrap !important;
    font-size: 13px !important;
  }

  .contact-details .footer-training a {
    white-space: nowrap !important;
    font-size: 14px !important;
  }

  .contact-details .location-link {
    gap: 8px !important;
  }

  .contact-details .location-link img {
    width: 24px !important;
    height: 24px !important;
    flex-basis: 24px !important;
  }

  .contact-details .footer-directory a {
    font-size: 13px !important;
    line-height: 1.35 !important;
  }
}

/* Very narrow desktop/scaled viewport: use three balanced columns
   without switching to the mobile header. */
@media (max-width: 1080px) and (min-width: 901px) {
  .site-header {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .site-header nav {
    gap: 17px !important;
  }

  .site-header nav > a:not(.nav-cta),
  .site-header .nav-careers,
  .site-header .nav-contact,
  .site-header .nav-capabilities-main > a {
    font-size: 13px !important;
  }

  .site-header nav .nav-cta {
    padding: 9px 11px !important;
    font-size: 11px !important;
  }

  .contact-details .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 24px !important;
    row-gap: 36px !important;
  }

  .contact-details .contact-intro {
    grid-column: 1 / -1;
  }

  .contact-details .footer-careers-training {
    grid-template-columns: 1fr 1fr;
    grid-column: 1 / -1;
    gap: 40px !important;
  }
}


/* =========================================================
   V6.15 — 14" LAPTOP / DISPLAY-SCALING FOOTER
   The physical screen can be 14" while the CSS viewport is
   around 1250–1350px due to Windows/browser scaling.
   Keep desktop mode, but tighten the footer before it
   becomes cramped.
   ========================================================= */
@media (max-width: 1400px) and (min-width: 901px) {
  .contact-details {
    padding-top: 58px !important;
    padding-bottom: 58px !important;
  }

  .contact-details .footer-grid {
    width: 100% !important;
    max-width: none !important;
    grid-template-columns:
      minmax(185px, 1.18fr)
      minmax(165px, .95fr)
      minmax(205px, 1.18fr)
      minmax(235px, 1.35fr)
      minmax(210px, .9fr) !important;
    column-gap: 22px !important;
    row-gap: 30px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
  }

  .contact-details .contact-intro,
  .contact-details .footer-column,
  .contact-details .footer-careers-training {
    min-width: 0 !important;
  }

  .contact-details .footer-careers-training {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
    align-content: start !important;
    width: 100% !important;
  }

  .contact-details .footer-careers-training .footer-directory {
    width: 100% !important;
    min-width: 0 !important;
  }

  .contact-details .footer-careers-training h3 {
    margin-bottom: 16px !important;
  }

  .contact-details .footer-careers-training a {
    display: block !important;
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  .contact-details .mail-link {
    max-width: 100% !important;
    gap: 9px !important;
  }

  .contact-details .mail-link span {
    white-space: nowrap !important;
    font-size: 14px !important;
  }

  .contact-details .location-link {
    gap: 8px !important;
    line-height: 1.5 !important;
  }

  .contact-details .location-link img {
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
  }

  .contact-details .footer-engineering-services a {
    font-size: 13px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  .contact-details .footer-programs a {
    white-space: nowrap !important;
  }
}

/* Extra-tight 14" / high-scaling desktop */
@media (max-width: 1200px) and (min-width: 901px) {
  .contact-details .footer-grid {
    grid-template-columns:
      minmax(170px, 1.08fr)
      minmax(150px, .9fr)
      minmax(185px, 1.05fr)
      minmax(210px, 1.2fr)
      minmax(190px, .85fr) !important;
    column-gap: 16px !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  .contact-details .contact-intro h2 {
    font-size: 58px !important;
  }

  .contact-details .mail-link span {
    font-size: 13px !important;
  }
}

/* V6.16 — compact desktop email/location separation */
@media (max-width:1400px) and (min-width:901px){
  .contact-details .footer-grid > .footer-column:nth-child(2){padding-right:18px!important;min-width:0!important}
  .contact-details .footer-grid > .footer-column:nth-child(3){padding-left:18px!important;min-width:0!important}
  .contact-details .mail-link{display:flex!important;align-items:flex-start!important;gap:9px!important;min-width:0!important;width:100%!important}
  .contact-details .mail-link img,.contact-details .mail-link svg{flex:0 0 24px!important;width:24px!important;height:24px!important;margin-top:1px!important}
  .contact-details .mail-link span{display:block!important;min-width:0!important;white-space:nowrap!important;font-size:13px!important;letter-spacing:-.1px!important}
  .contact-details .location-link{display:flex!important;align-items:flex-start!important;gap:10px!important;min-width:0!important}
  .contact-details .location-link img,.contact-details .location-link svg{flex:0 0 24px!important;width:24px!important;height:24px!important;margin-top:1px!important}
}
@media (max-width:1200px) and (min-width:901px){
  .contact-details .mail-link span{font-size:12.5px!important}
}

/* =========================================================
   V7.1 — PROFESSIONAL EQUAL-WIDTH FOOTER COLUMNS
   Keep the five footer blocks evenly distributed and align
   section headings to the visual center of each block.
   ========================================================= */
@media (min-width: 1151px) {
  .contact-details .footer-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: clamp(28px, 3vw, 52px) !important;
    padding-left: clamp(40px, 4.2vw, 72px) !important;
    padding-right: clamp(40px, 4.2vw, 72px) !important;
  }

  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    width: 100%;
    text-align: center;
  }

  .contact-details .footer-column,
  .contact-details .footer-directory,
  .contact-details .footer-careers-training {
    min-width: 0 !important;
  }

  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    margin-left: auto;
    margin-right: auto;
  }

  /* Keep content comfortably readable while headings remain centered. */
  .contact-details .footer-column > a,
  .contact-details .footer-directory > a,
  .contact-details .footer-careers-training {
    text-align: left;
  }

  /* Professional, consistent brand-logo sizing. */
  .contact-details .mail-link img,
  .contact-details .location-link img,
  .contact-details .linkedin-link svg {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;
    object-fit: contain !important;
  }

  .contact-details .linkedin-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
  }
}

@media (max-width: 1150px) and (min-width: 781px) {
  .contact-details .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 36px !important;
  }

  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    width: 100%;
    text-align: center;
  }

  .contact-details .mail-link img,
  .contact-details .location-link img,
  .contact-details .linkedin-link svg {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;
    object-fit: contain !important;
  }
}

/* =========================================================
   V7.2 — FINAL PROFESSIONAL FOOTER ARRANGEMENT
   Five equal visual blocks, centered headings, clean internal
   alignment, and stable 14-inch laptop behavior.
   ========================================================= */
@media (min-width: 1151px) {
  .contact-details .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: clamp(24px, 2.4vw, 42px) !important;
    row-gap: 32px !important;
    width: 100% !important;
    max-width: 1600px !important;
    padding-left: clamp(32px, 4vw, 64px) !important;
    padding-right: clamp(32px, 4vw, 64px) !important;
    box-sizing: border-box !important;
  }

  /* Every heading occupies the same visual position in its block. */
  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 0 22px !important;
  }

  /* Content stays left-aligned for easy scanning. */
  .contact-details .footer-column > a,
  .contact-details .footer-directory > a,
  .contact-details .footer-careers-training {
    text-align: left !important;
  }

  /* Keep the final block balanced instead of creating a sixth column. */
  .contact-details .footer-careers-training {
    display: flex !important;
    flex-direction: column !important;
    gap: 28px !important;
    width: 100% !important;
    min-width: 0 !important;
    align-self: start !important;
  }

  .contact-details .footer-careers-training .footer-directory {
    width: 100% !important;
    min-width: 0 !important;
  }

  .contact-details .footer-careers-training .footer-directory h3 {
    text-align: center !important;
  }

  /* Consistent professional icon pack sizing. */
  .contact-details .mail-link img,
  .contact-details .location-link img,
  .contact-details .linkedin-link svg {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;
    object-fit: contain !important;
  }

  .contact-details .linkedin-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
  }

  .contact-details .mail-link {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
  }

  .contact-details .mail-link span {
    white-space: normal !important;
    font-size: 14px !important;
  }

  .contact-details .location-link {
    display: flex !important;
    align-items: flex-start !important;
    gap: 9px !important;
  }

  .contact-details .location-link span {
    font-size: 14px !important;
    line-height: 1.55 !important;
  }

  .contact-details .map-link {
    margin-left: 31px !important;
    margin-top: 20px !important;
  }
}

/* 14-inch / scaled desktop: retain the same five-block hierarchy,
   but tighten the spacing and typography rather than rearranging it. */
@media (min-width: 1151px) and (max-width: 1400px) {
  .contact-details .footer-grid {
    column-gap: 18px !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  .contact-details .contact-intro h2 {
    font-size: clamp(52px, 4.2vw, 64px) !important;
    line-height: .92 !important;
  }

  .contact-details .footer-directory a {
    font-size: 13.5px !important;
    line-height: 1.38 !important;
    margin-bottom: 12px !important;
  }

  .contact-details .footer-directory h3 {
    font-size: 15px !important;
    margin-bottom: 18px !important;
  }

  .contact-details .mail-link span,
  .contact-details .location-link span {
    font-size: 13px !important;
  }

  .contact-details .footer-careers-training {
    gap: 22px !important;
  }
}

@media (max-width: 1150px) and (min-width: 781px) {
  .contact-details .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 30px !important;
    row-gap: 42px !important;
  }

  .contact-details .contact-intro {
    grid-column: 1 / -1 !important;
  }

  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    width: 100% !important;
    text-align: center !important;
    margin-bottom: 20px !important;
  }

  .contact-details .footer-careers-training {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-column: 1 / -1 !important;
    gap: 30px !important;
  }
}

@media (max-width: 780px) {
  .contact-details .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 38px !important;
  }

  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    width: 100% !important;
    text-align: left !important;
  }

  .contact-details .footer-careers-training {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px !important;
  }
}

/* V8.52 — Contact/footer desktop consistency.
   Keep the five footer blocks on one row at 14-inch desktop and
   use one consistent type system for like content. */
@media (min-width: 1151px) {
  .contact-details .footer-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 22px !important;
    row-gap: 0 !important;
    align-items: start !important;
    padding-left: 36px !important;
    padding-right: 36px !important;
  }

  .contact-details .footer-column,
  .contact-details .footer-careers-training,
  .contact-details .footer-careers-training .footer-directory {
    min-width: 0 !important;
    width: 100% !important;
  }

  /* Same family + size for all ordinary footer links/content. */
  .contact-details .footer-column > a,
  .contact-details .footer-directory > a,
  .contact-details .mail-link span,
  .contact-details .location-link span,
  .contact-details .map-link,
  .contact-details .contact-intro > p {
    font-family: "Space Grotesk", sans-serif !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
  }

  /* Same heading treatment across all footer blocks. */
  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    font-family: "Space Grotesk", sans-serif !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 600 !important;
    margin: 0 0 20px !important;
  }

  .contact-details .footer-directory a {
    margin-bottom: 13px !important;
  }

  .contact-details .mail-link,
  .contact-details .location-link {
    gap: 9px !important;
  }

  .contact-details .mail-link span,
  .contact-details .location-link span {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  .contact-details .map-link {
    margin-left: 31px !important;
    margin-top: 18px !important;
  }

  .contact-details .footer-careers-training {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  .contact-details .footer-careers-training .footer-directory h3 {
    margin-bottom: 20px !important;
  }
}

/* 14-inch desktop: compress spacing only; do not change the 15-inch layout. */
@media (min-width: 1151px) and (max-width: 1400px) {
  .contact-details .footer-grid {
    column-gap: 14px !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  .contact-details .footer-column > a,
  .contact-details .footer-directory > a,
  .contact-details .mail-link span,
  .contact-details .location-link span,
  .contact-details .map-link,
  .contact-details .contact-intro > p {
    font-size: 14px !important;
  }

  .contact-details .footer-column > h3,
  .contact-details .footer-directory > h3 {
    font-size: 15px !important;
    margin-bottom: 17px !important;
  }

  .contact-details .footer-directory a {
    margin-bottom: 10px !important;
  }

  .contact-details .footer-careers-training {
    gap: 20px !important;
  }
}