/* Omit the optional title and give the remaining fields balanced columns. */
html body .tt-contact-page .tt-contact-form .tt-field-title { display: none !important; }
html body .tt-contact-page .tt-contact-form .tt-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
@media (max-width: 767px) {
  html body .tt-contact-page .tt-contact-form .tt-form-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Home verification controls share one height and have no inherited form margins. */
@layer tt-card-layout {
  html body #tt-home-contact form.tt-home-contact-form .tt-captcha-row > img,
  html body #tt-home-contact form.tt-home-contact-form .tt-captcha-row > label > input[name="captcha"],
  html body #tt-home-contact form.tt-home-contact-form .tt-captcha-row > button {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    align-self: center !important;
  }
  @media (min-width: 768px) {
    html body #tt-home-contact form.tt-home-contact-form .tt-captcha-row {
      align-items: center !important;
    }
    html body #tt-home-contact form.tt-home-contact-form .tt-captcha-row > label {
      height: 48px !important;
      min-height: 48px !important;
      margin: 0 !important;
      padding: 0 !important;
      align-items: center !important;
      box-sizing: border-box !important;
    }
  }
}

/* Keep the verification image as tall as the complete captcha field. */
html body .tt-contact-page .tt-captcha-panel > img {
  align-self: stretch !important;
  justify-self: stretch !important;
  width: 180px !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 74px !important;
  box-sizing: border-box;
  object-fit: fill;
  border-radius: 7px;
}

/* A visible teal outline stays present in resting and hover states. */
@layer tt-teal-buttons {
  html body :is(.tt-contact-submit, #tt-home-contact button[type="submit"]) {
    border: 2px solid #0b4a50 !important;
    box-sizing: border-box;
  }
  html body :is(.tt-contact-submit, #tt-home-contact button[type="submit"]):is(:hover, :focus-visible) {
    border-color: #12646c !important;
  }
}

@media (max-width: 767px) {
  html body .tt-contact-page .tt-captcha-panel > img {
    height: 74px !important;
  }
}