/* ==========================================================================
   Contact form module (.module_contact)
   ========================================================================== */

.module_contact {
  max-width: var(--detWidth);
  margin-top: 60px;
}

/* Contact form when used as a landing-page section */
.contactSection {
  margin-bottom: 60px;
}

.contactTitle {
  font-family: "Garamond-reg", sans-serif;
  font-size: var(--mediumFont);
  line-height: 1.1;
  margin-bottom: var(--genPadding);
}

.contactContent {
  font-family: "HK-reg", sans-serif;
  font-size: var(--textFont);
  line-height: 1.35;
  margin-bottom: var(--genPadding);
}

.contactForm {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Honeypot — kept off-screen (not display:none, which some bots skip) */
.hpField {
  position: absolute !important;
  left: -9999px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.contactForm select,
.contactForm input,
.contactForm textarea {
  width: 100%;
  border: none;
  border-bottom: 1px solid black;
  background-color: transparent;
  font-family: inherit;
  font-size: 18px;
  padding: 5px 0;
  margin-bottom: var(--genPadding);
  color: inherit;
  border-radius: 0;
  -webkit-appearance: none;
  appearance: none;
}

.contactForm textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.35;
}

.contactForm select {
  cursor: pointer;
}

.contactForm ::placeholder {
  color: black;
  opacity: 1;
}

.contactForm input:focus,
.contactForm select:focus,
.contactForm textarea:focus {
  outline: none;
  border-bottom-width: 2px;
}

/* Submit button reuses the site's subscribe button style
   (.basicButton + .subscribeButton2); only spacing + disabled state here. */
.contactSubmit {
  margin-top: 10px;
}

.contactSubmit[disabled] {
  opacity: 0.5;
  cursor: default;
}

.form_response {
  font-family: "HK-reg", sans-serif;
  font-size: 18px;
  margin-top: var(--genPadding);
  min-height: 1em;
}

.form_response.is-success {
  color: var(--color3);
}

.form_response.is-error {
  color: var(--color4);
}

/* Mobile */
@media (max-width: 767px) {
  .contactTitle {
    font-size: var(--mediumFontMob);
  }
  .contactContent {
    font-size: var(--textFontMob);
  }
}