/* First Choice Realty Group - native form styling (static build)
   Card-style forms in the same design language as Sid's other static
   sites (WSH Repair, Lawrence Staffing, Clivus): the form sits in a clean
   white card (rounded corners, soft shadow, comfortable padding), tidy
   labels above full-width inputs with light borders and a clear focus
   state, and a solid submit button.
   Accent: the Vantage theme's dark tone #3b3b3b, the site's own palette.
   Styling only: no field, label, or action is affected. */

/* --- The card --- */
.mf-wrap {
  max-width: 640px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow: 0 10px 34px rgba(0, 0, 0, .10);
  padding: 30px 32px;
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .mf-wrap { padding: 24px 18px; }
}

/* --- Fields & labels --- */
.mf-form .mf-field { margin: 0 0 18px; }
.mf-form .mf-label {
  display: block; font-weight: 600; font-size: 14.5px;
  color: #1f2937; margin: 0 0 7px;
}
.mf-form .mf-req { color: #b00; }

/* --- Inputs --- */
.mf-form input[type="text"], .mf-form input[type="email"], .mf-form input[type="tel"],
.mf-form input[type="number"], .mf-form textarea {
  display: block; width: 100%; box-sizing: border-box;
  padding: 11px 13px; margin: 0;
  border: 1px solid #cbd5e1; border-radius: 9px;
  font: inherit; font-size: 16px; color: #111827; background: #fff;
}
.mf-form input[type="text"]:focus, .mf-form input[type="email"]:focus,
.mf-form input[type="tel"]:focus, .mf-form input[type="number"]:focus,
.mf-form textarea:focus {
  outline: none; border-color: #3b3b3b;
  box-shadow: 0 0 0 3px rgba(59, 59, 59, .16);
}
.mf-form textarea { min-height: 110px; resize: vertical; }

/* --- Submit --- */
.mf-form .mf-submit { margin-top: 22px; }
.mf-form .mf-button {
  display: inline-block; cursor: pointer;
  background: #3b3b3b; color: #fff; border: 0; border-radius: 9px;
  padding: 12px 30px; font: inherit; font-size: 15.5px; font-weight: 700;
  letter-spacing: .04em;
}
.mf-form .mf-button:hover { background: #242424; }

/* --- Result banners (shown by forms.js for ?sent=1 / ?error=1) --- */
.mf-success {
  border: 1px solid #2e7d32; background: #e8f5e9; color: #1b5e20;
  border-radius: 9px; padding: 14px 16px; font-size: 15.5px;
  margin: 0 0 18px;
}
.mf-error {
  border: 1px solid #b00; background: #fdeeee; color: #7a1010;
  border-radius: 9px; padding: 14px 16px; font-size: 15.5px;
  margin: 0 0 18px;
}
