/* Contact page (legacy "Say hello" page; form styled after the original Caldera Forms + Essential Addons widget) */

.contact-hero .container,
.contact-body .container { padding: 10px; }
.contact-hero__spacer { height: 50px; margin-bottom: 24px; }
.contact-hero__title {
  margin-top: -49px; text-align: center;
  /* "Open Sans Condensed" was never served by the original site, so browsers render the sans-serif fallback. */
  font-family: "Open Sans Condensed", sans-serif; font-size: 56px; font-weight: 700; line-height: 1.2;
  text-transform: uppercase; color: #3fb3ff;
}

/* Short page: keep the footer at the bottom of the viewport instead of leaving a blank band under it. */
body:has(.contact-hero) { display: flex; flex-direction: column; min-height: 100vh; }
body:has(.contact-hero) > main { flex: 1 0 auto; }

/* Tablet/mobile: the header shows the menu toggle + Contact button across the full width, so start the
   heading below it instead of overlapping them (as the original did). */
@media (max-width: 1024px) {
  .contact-hero__spacer { height: 80px; margin-bottom: 0; }
  .contact-hero__title { margin-top: 0; }
}
@media (max-width: 767px) {
  .contact-hero__spacer { height: 76px; }
  .contact-hero__title { font-size: min(56px, 14vw); }
}

/* ---------- Form ---------- */
.contact-form { font-size: 14px; line-height: 1.2; color: var(--c-navy); }
.contact-form__row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.contact-form__col { flex: 0 0 100%; padding: 0 15px; }
.contact-form__group { margin-bottom: 15px; }
.contact-form label {
  display: inline-block; max-width: 100%; margin-bottom: 5px;
  font-family: "Karla", sans-serif; font-weight: 700;
}
.contact-form__req { color: #e00; }
.contact-form__control {
  display: block; width: 100%; height: 34px; padding: 6px 12px; margin: 0;
  font: inherit; font-size: 14px; line-height: 1.42857143; color: #555;
  background: #fff; border: 1px solid #ccc; border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
textarea.contact-form__control { height: auto; resize: vertical; }
.contact-form__control:focus {
  outline: 0; border-color: #66afe9;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}
.contact-form__control:user-invalid { border-color: #a94442; }
.contact-form__submit {
  display: block; margin: 0 auto; padding: 16px 24px;
  font-family: "Open Sans Condensed", sans-serif; font-size: 14px; font-weight: 700; line-height: 1.2;
  letter-spacing: 1px; text-transform: uppercase;
  color: #fff; background: #3fb3ff; border: 1px solid #3fb3ff; border-radius: 100px;
  cursor: pointer; transition: all .2s linear;
}
.contact-form__submit:hover, .contact-form__submit:focus-visible { color: #3fb3ff; background: #fff; border-color: #3fb3ff; }

.contact-form__success {
  margin-bottom: 20px; padding: 15px; font-family: "Karla", sans-serif; font-size: 14px;
  color: #3c763d; background: #dff0d8; border: 1px solid #d6e9c6; border-radius: 4px;
}
.contact-form__success p { margin-bottom: 8px; }
.contact-form__success p:last-child { margin-bottom: 0; }
.contact-form__note a { font-size: inherit; }

@media (min-width: 768px) {
  .contact-form__col--half { flex-basis: 50%; }
}