/* ---------- Contact Form 7 visual overrides ----------
   Contact Form 7 wraps each field in its own <span>, and adds its own
   validation/response markup. The .fld / .cbox rules in page-contact.css
   already style the inputs themselves (they're descendant selectors), so
   this file only needs to cover what CF7 adds on top of that. */

.wpcf7-form-control-wrap {
  display: block;
}
.wpcf7 form .fld {
  margin-bottom: 18px;
}
.wpcf7-not-valid-tip {
  display: block;
  font-size: 12px;
  color: #C0392B;
  font-weight: 500;
  margin-top: 6px;
}
.wpcf7-response-output {
  margin: 18px 0 0;
  padding: 14px 16px;
  border-radius: 10px;
  font-size: 13.5px;
  line-height: 1.6;
  border: 1px solid var(--line);
}
.wpcf7-mail-sent-ok {
  border-color: var(--grn);
  color: var(--grn);
  background: rgba(31, 138, 91, 0.08);
}
.wpcf7-validation-errors,
.wpcf7-mail-sent-ng,
.wpcf7-spam-blocked {
  border-color: #C0392B;
  color: #C0392B;
  background: rgba(192, 57, 43, 0.06);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output {
  display: block;
}
.wpcf7-spinner {
  margin-left: 10px;
}