/* ==========================================================================
   Contact Form 7 in the 2026 design — the glue only.

   The build in /html has no forms plugin, so this is the one stylesheet that
   is NOT a copy of it: it maps the markup the site's own CF7 forms output
   onto the design's controls. Everything visual is expressed with the
   build's own values, so nothing new is invented here.

   Loaded only on 2026 pages, after assets/css/main.css.
   ========================================================================== */

/* The form templates wrap every control in a column div. They only need to
   share the row's width — the control inside carries the design's height and
   its own bottom margin, so nothing here may add either. */
.hg26 .col,
.hg26 .col-full-width {
  flex: 1 1 0;
  min-width: 0;
}

/* The field's own margin sets the rhythm in the enquiry form; the row must
   not add a second one on top of it. The design also stacks all five fields
   full width, where the form template pairs first and last name on one row. */
.hg26 .enquiry .form-input-wrapp {
  margin-bottom: 0;
  flex-wrap: wrap;
}
.hg26 .enquiry .form-input-wrapp .col { flex: 0 0 100%; }

/* The report form stacks its fields with their own top margin, so the rows
   must not add the newsletter's bottom one on top. */
.hg26 .m2fr-form .form-input-wrapp { margin-bottom: 0; }
.hg26 .m2fr-form .form-input-wrapp .col { flex: 0 0 100%; }

/* In the build every field is a sibling, so only the first takes the wider
   24.91px lead-in. CF7 puts each one in a row of its own, which would make
   them all `:first-of-type` — the first row is what earns it here. */
.hg26 .m2fr-form .m2fr-field { margin-top: 14.16px; }
.hg26 .m2fr-form .form-input-wrapp:first-of-type .m2fr-field { margin-top: 24.91px; }

/* The consent value is carried by a text field the old design hid. */
.hg26 .hidden-attr-field { display: none; }

/* The GDPR widget stands in for the build's <label class="consent">. */
.hg26 .wrapper-gdpr-custom-ui-cst {
  display: flex;
  align-items: flex-start;
  gap: 16.38px;
  max-width: 343px;
  font-size: 10px;
  line-height: 14px;
  color: var(--charcoal);
  cursor: pointer;
}
.hg26 .wrapper-gdpr-custom-ui-cst .input-cntrl-cst {
  display: flex;
  align-items: flex-start;
  gap: 16.38px;
}
.hg26 .wrapper-gdpr-custom-ui-cst .input-sgnal {
  flex: 0 0 auto;
  width: 20.62px;
  height: 20.62px;
  border: 1px solid var(--charcoal);
  background: var(--white);
}
.hg26 .wrapper-gdpr-custom-ui-cst.activated-gdpr-custom-ui-cst .input-sgnal {
  background: var(--magenta);
  border-color: var(--magenta);
}
.hg26 .wrapper-gdpr-custom-ui-cst.errorsending-gdpr-custom-ui-cst .input-sgnal {
  border-color: var(--magenta);
  box-shadow: 0 0 0 2px var(--magenta);
}
.hg26 .wrapper-gdpr-custom-ui-cst a { text-decoration: underline; }

/* The build puts the consent line and the button on one row (.enquiry__foot).
   CF7 emits them as two siblings, so the form itself becomes the row. */
.hg26 .contact__form .form-main-cst-wrapp {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.hg26 .contact__form .form-input-wrapp { flex: 0 0 100%; }

/* The build gets a 29.35px gap here from .enquiry__foot's 29px margin
   collapsing with the message field's 14.16px one. A flex container does not
   collapse margins, so the difference is what is set instead. */
.hg26 .contact__form .wrapper-gdpr-custom-ui-cst { flex: 1 1 auto; margin-top: 14.84px; }
.hg26 .contact__form .form-input-wrapp.btn-cst-wrapp {
  flex: 0 0 auto;
  width: auto;
  margin-top: 14.84px;
  margin-left: auto;
}
.hg26 .form-input-wrapp.btn-cst-wrapp .col-full-width { height: auto; }

/* CF7's own messages, in the design's type. */
.hg26 .wpcf7-not-valid-tip,
.hg26 .wpcf7-response-output {
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 16px;
}
/* Both only take room once CF7 has something to say — otherwise an empty
   bordered box and a blank spinner line sit under every form. */
.hg26 .sent .wpcf7-response-output,
.hg26 .failed .wpcf7-response-output,
.hg26 .aborted .wpcf7-response-output,
.hg26 .invalid .wpcf7-response-output,
.hg26 .unaccepted .wpcf7-response-output,
.hg26 .payment-required .wpcf7-response-output {
  margin: 16px 0 0;
  padding: 10px 14px;
  border: 1px solid currentColor;
}
.hg26 .wpcf7-spinner { display: none; }
.hg26 .submitting .wpcf7-spinner {
  display: inline-block;
  margin-left: 12px;
  vertical-align: middle;
}
