/* Shared contact layout repair. Load after the existing contact/page styles.
   Keep list text in normal flow: a <strong> and its following text node must
   not become separate grid items in the number column. No content is hidden. */
.contact-expect > ol > li {
  display: block;
  position: relative;
  min-inline-size: 0;
  max-inline-size: 100%;
  padding-inline-start: 2.625rem;
  overflow-wrap: anywhere;
  word-break: normal;
}

.contact-expect > ol > li::before {
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0;
  inline-size: 1.75rem;
  padding-block-start: .2em;
}

.contact-expect > ol > li > strong {
  display: block;
  margin-block-end: .25em;
}

/* Let both the shared hub and Contact page shrink without min-content
   widths from an email address, form control, or receipt reference. */
.contact-hub,
.contact-layout {
  overflow-wrap: anywhere;
  word-break: normal;
}

.contact-hub-layout > *,
.contact-layout > *,
.contact-hub-form,
.contact-hub-form form,
.contact-hub-form .form-grid,
.contact-hub-form .field,
.contact-hub-form .contact-success {
  min-inline-size: 0;
  max-inline-size: 100%;
}

.contact-hub-layout {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
}

.contact-layout {
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
}

.contact-hub .contact-call {
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: clamp(.625rem, 2vw, 1.125rem);
}

.contact-hub .contact-call > strong {
  grid-column: 1;
  min-inline-size: 0;
}

.contact-hub .contact-email {
  display: block;
  position: relative;
  max-inline-size: 100%;
  padding-inline-end: 2rem;
  overflow-wrap: anywhere;
}

.contact-hub .contact-email > svg {
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: 50%;
  margin: 0;
  transform: translateY(-50%);
}

.contact-layout .contact-details > a {
  max-inline-size: 100%;
  overflow-wrap: anywhere;
}

.contact-hub .contact-save,
.contact-layout .contact-save {
  max-inline-size: 100%;
}

.contact-hub .contact-save > span,
.contact-layout .contact-save > span {
  flex: 1 1 0%;
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

.contact-hub .contact-save > svg,
.contact-layout .contact-save > svg,
.contact-hub-form .btn > svg,
.contact-hub-form .text-link > svg {
  flex-shrink: 0;
}

/* Respond to available form width, including a narrow desktop column or
   enlarged text. Full-width fields keep their existing grid-column span. */
.contact-hub-form {
  padding: clamp(1rem, 2.5vw, 2.25rem);
}

.contact-hub-form .form-grid {
  grid-template-columns: minmax(0, 1fr);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.contact-hub-form .field input,
.contact-hub-form .field select,
.contact-hub-form .field textarea {
  box-sizing: border-box;
  min-inline-size: 0;
  max-inline-size: 100%;
}

.contact-hub-form .consent > span {
  flex: 1 1 0%;
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

.contact-hub-form .prism-form-progress > div {
  flex-wrap: wrap;
  row-gap: .35rem;
}

.contact-hub-form .prism-form-progress > div > span {
  flex: 1 1 9rem;
  min-inline-size: 0;
}

.contact-hub-form :is(.btn, .text-link),
.contact-layout .contact-copy > .text-link {
  min-inline-size: 0;
  max-inline-size: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.contact-hub-form .contact-reference code {
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  .contact-hub-layout,
  .contact-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 480px) {
  .contact-hub-form .prism-form-progress > div > span:last-child {
    text-align: start;
  }

  .contact-hub .contact-call > strong,
  .contact-layout .contact-details > a:first-child {
    font-size: clamp(1.5rem, 7vw, 1.8125rem);
  }

  .contact-hub-form .btn {
    gap: .75rem;
    padding-inline: 1rem;
  }
}
