/* Contact, sales enquiry and customer support forms (contact.html, contact/sales-calendar.html,
   contact/customer-support.html). Typed text matches the 18px field labels and sits just above
   the underline, instead of 14px text floating high in the field (Webflow's 8px top / 3px
   bottom padding). Rows align their label and input at the bottom, so the baselines line up. */
#email-form .w-input,
#wf-form-Sales-Form .w-input,
#wf-form-Service-Form .w-input {
  height: auto;
  min-height: 0;
  font-size: 18px;
  line-height: 24px;
  padding-top: 2px;
  padding-bottom: 6px;
  color: #111;
}

/* Line the typed text up with its label's text (Webflow aligned their boxes' bottoms, which
   left the text higher than the label). Each form uses different row classes, hence :has. */
#email-form :has(> .w-input),
#wf-form-Sales-Form :has(> .w-input),
#wf-form-Service-Form :has(> .w-input) {
  align-items: baseline;
}

/* Phones: Webflow shrinks the labels to ~14px. 16px is the smallest size that stops iOS
   zooming the page when a field is tapped. */
@media (max-width: 767px) {
  #email-form .w-input,
  #wf-form-Sales-Form .w-input,
  #wf-form-Service-Form .w-input {
    font-size: 16px;
    line-height: 22px;
  }
}

/* Only the support form had no left padding on its inputs; keep the gap after the label. */
#wf-form-Service-Form .w-input {
  padding-left: 12px;
}