/* Required contact email, shared by every regional form and the landing. */
form[data-lead-email] .lead-email-field {
  min-width: 0;
  text-align: left;
}

form[data-lead-email] .lead-email-field .field__input {
  width: 100%;
  min-width: 0;
  font-size: 16px;
}

.lead-email-note,
.lead-email-error {
  display: block;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.lead-email-note { color: #65576c; }
.lead-email-error { color: #a22614; }
.lead-email-error[hidden] { display: none; }
form[data-lead-email] input[name="email"][aria-invalid="true"] {
  border-color: #a22614;
  box-shadow: 0 0 0 1px #a22614;
}

/* Three contact fields occupy one row; the request and button follow. */
.service-quote .service-quote-form[data-lead-email] > .field:not(.field--checkbox) {
  order: 1;
  grid-column: span 4;
  align-self: start;
}
.service-quote .service-quote-form[data-lead-email] > .field:not(.field--checkbox):nth-of-type(n+4) {
  order: 2;
  grid-column: 1 / -1;
}
.service-quote .service-quote-form[data-lead-email] > button[type="submit"] {
  order: 5;
  grid-column: 1 / -1;
  justify-self: start;
  max-width: 100%;
  white-space: normal;
}

/* Keep the final call to action wide enough for a complete email address. */
.lead-form--cta[data-lead-email] { max-width: 760px; }
.lead-form--cta[data-lead-email] .lead-form--cta__row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  text-align: left;
}
.lead-form--cta[data-lead-email] .field:not(.field--checkbox) { max-width: none; }
.lead-form--cta[data-lead-email] .lead-form--cta__row .field__label.visually-hidden {
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}
.lead-form--cta[data-lead-email] .lead-form--cta__row > button {
  grid-column: 1 / -1;
  width: 100%;
  white-space: normal;
}

form[data-lead-email] .form-fields > .lead-email-field { grid-column: 1 / -1; }

@media (max-width: 900px) {
  .service-quote .service-quote-form[data-lead-email] > .field:not(.field--checkbox) { grid-column: span 6; }
  .service-quote .service-quote-form[data-lead-email] > .field.lead-email-field:not(.field--checkbox) { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .service-quote .service-quote-form[data-lead-email] > .field:not(.field--checkbox),
  .service-quote .service-quote-form[data-lead-email] > .field:not(.field--checkbox):nth-of-type(n+4),
  .service-quote .service-quote-form[data-lead-email] > button[type="submit"] {
    grid-column: 1;
    order: initial;
  }
  .service-quote .service-quote-form[data-lead-email] > button[type="submit"] { width: 100%; }
  .lead-form--cta[data-lead-email] .lead-form--cta__row { grid-template-columns: minmax(0, 1fr); }
}