/* Use horizontal space to keep comfortable leading inside a compact banner. */
.contact-section {
  display: flex;
  align-items: center;
  min-height: 400px;
  padding: 36px 0;
}
.contact-section .contact-layout {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr);
  align-items: center;
  gap: 48px;
}
.contact-copy { min-width: 0; }
.contact-section .contact-copy .eyebrow.light { margin: 0 0 18px; line-height: 1.7; }
.contact-section .contact-copy h2 { margin: 0; line-height: 1.7; }
.contact-section .contact-copy .cta-pill { margin-top: 22px; }
.contact-section .contact-details {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  padding: 0 0 0 32px;
}
.contact-section .contact-details > div { margin: 0; min-width: 0; }
.contact-channels {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr);
  align-items: start;
  gap: 24px;
}
.contact-locations {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 24px;
  border-top: 1px solid #ffffff26;
  padding-top: 18px;
}
.contact-channel, .contact-location { min-width: 0; margin: 0; grid-column: auto; }
.contact-channel > span, .contact-location > span {
  display: block;
  margin-bottom: 7px;
  color: #bfd1ed;
  font: 400 14px/1.6 var(--sans);
  letter-spacing: .02em;
}
.contact-section .contact-details a { font-size: 26px; line-height: 1.5; letter-spacing: 0; }
.contact-section .contact-details a.phone { font-size: 26px; }
.contact-section .contact-details #copy-email { margin-top: 6px; font-size: 13px; line-height: 1.5; }
.contact-section .contact-location p { margin: 0; color: #bfd1ed; font: 400 16px/1.9 var(--sans); }

@media (min-width: 901px) and (max-width: 1350px) {
  .contact-section { padding-block: 32px; }
  .contact-section .contact-layout { gap: 32px; }
  .contact-section .contact-details { padding-left: 24px; gap: 20px; }
  .contact-channels, .contact-locations { gap: 18px; }
  .contact-section .contact-details a, .contact-section .contact-details a.phone { font-size: 24px; }
}
@media (min-width: 901px) and (max-width: 1179px) {
  .contact-section .contact-copy h2 { font-size: 36px; }
  .contact-section .contact-details a, .contact-section .contact-details a.phone { font-size: 22px; }
  .contact-section .contact-location p { font-size: 15px; line-height: 1.9; }
}
@media (max-width: 900px) {
  .contact-section { min-height: 0; padding-block: 28px; }
  .contact-section .contact-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .contact-section .contact-copy .eyebrow.light { margin-bottom: 14px; }
  .contact-section .contact-copy .cta-pill { margin-top: 18px; }
  .contact-section .contact-details { border-left: 0; border-top: 1px solid #ffffff30; padding: 22px 0 0; gap: 18px; }
  .contact-section .contact-details > div { grid-column: auto; }
  .contact-channels, .contact-locations { gap: 20px; }
  .contact-section .contact-details a, .contact-section .contact-details a.phone { font-size: 23px; }
  .contact-section .contact-location p { font-size: 15px; line-height: 1.9; }
}
@media (max-width: 540px) {
  .contact-section .contact-copy h2 { font-size: clamp(28px, 6.5vw, 34px); line-height: 1.65; }
  .contact-section .contact-details a, .contact-section .contact-details a.phone { font-size: clamp(20px, 4.8vw, 23px); }
  .contact-channels, .contact-locations { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}
