/* ============================================================
   Forms — replicates the Formidable look: labels above fields,
   red required asterisk, full-width inputs, dark-red submit.
   ============================================================ */

.site-form { max-width: 760px; margin: 30px 0 10px; }

.site-form form .form-group,
.site-form form [class*="form-group"] {
  margin-bottom: 18px;
}

.site-form label {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--dark-red);
  margin-bottom: 6px;
}
.site-form label .required {
  color: var(--red);
  margin-left: 2px;
}

.site-form input[type=text],
.site-form input[type=email],
.site-form input[type=tel],
.site-form input[type=number],
.site-form select,
.site-form textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: 16px;
  color: var(--heading-color);
  background: var(--white);
  border: 1px solid #d2d2d2;
  border-radius: 4px;
  padding: 10px 12px;
}
.site-form input:focus,
.site-form select:focus,
.site-form textarea:focus {
  outline: 2px solid var(--gold);
  outline-offset: 0;
  border-color: var(--gold);
}

.site-form .form-input-wrapper { width: 100%; }

/* captcha */
.site-form .basic-captcha-image,
.site-form img[alt="Basic Captcha"] {
  border-radius: 4px;
  margin-bottom: 8px;
  display: block;
}
.site-form input[name*="basic-captcha"] { max-width: 220px; }

/* buttons */
.site-form button[type=submit],
.site-form input[type=submit] {
  display: inline-block;
  background: var(--btn-bg);
  color: var(--btn-color);
  font-size: var(--btn-font-size);
  text-transform: uppercase;
  padding: 13px 32px;
  border: 0;
  border-radius: 2px;
  cursor: pointer;
  transition: background .2s ease;
}
.site-form button[type=submit]:hover { background: var(--btn-bg-hover); }

/* validation + status messages */
.form-message,
.site-form .alert {
  padding: 14px 18px;
  border-radius: 6px;
  margin-bottom: 20px;
  background: var(--beige);
  color: var(--dark-red);
  font-weight: 700;
}
.form-message.error, .site-form .alert.error { background: #fbe9e9; color: var(--red); }

/* two-column rows on wide screens for name fields (visual nicety, harmless) */
@media (min-width: 700px) {
  .site-form form { display: block; }
}