.mclf {
  --mclf-bg: #fff;
  --mclf-text: #17324d;
  --mclf-muted: #617386;
  --mclf-required: #d12a2a;
  --mclf-gap: 16px;
  --mclf-field-height: 52px;
  --mclf-field-padding-x: 14px;
  --mclf-field-bg: #fff;
  --mclf-field-color: #17324d;
  --mclf-field-border: #cbd8e5;
  --mclf-field-border-width: 1px;
  --mclf-field-focus-bg: #fff;
  --mclf-field-focus-color: #17324d;
  --mclf-field-focus-border: #0b4a93;
  --mclf-button-bg: #46a311;
  --mclf-button-color: #fff;
  --mclf-button-border: #46a311;
  --mclf-button-hover-bg: #357f0c;
  --mclf-button-hover-color: #fff;
  --mclf-button-hover-border: #357f0c;
  --mclf-success-bg: #edf8e7;
  --mclf-success-color: #2f6f0c;
  --mclf-error-bg: #fdeded;
  --mclf-error-color: #a51f1f;
  width: 100%;
  max-width: 100%;
  background: var(--mclf-bg);
  color: var(--mclf-text);
}

.mclf *, .mclf *::before, .mclf *::after { box-sizing: border-box; }

.mclf__header { margin: 0 0 24px; }
.mclf__title { margin: 0 0 8px; color: var(--mclf-text); font-size: 32px; line-height: 1.08; }
.mclf__description { margin: 0; color: var(--mclf-muted); font-size: 16px; line-height: 1.6; }

.mclf__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--mclf-gap);
}

.mclf__field { min-width: 0; }
.mclf__field--full { grid-column: 1 / -1; }

.mclf__label {
  display: block;
  margin: 0 0 7px;
  color: var(--mclf-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
}

.mclf__required { color: var(--mclf-required); }

.mclf .mclf__control,
.mclf input.mclf__control,
.mclf select.mclf__control,
.mclf textarea.mclf__control {
  appearance: none;
  -webkit-appearance: none;
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: var(--mclf-field-height);
  height: var(--mclf-field-height);
  margin: 0;
  padding: 0 var(--mclf-field-padding-x);
  border-style: solid !important;
  border-width: var(--mclf-field-border-width) !important;
  border-color: var(--mclf-field-border) !important;
  outline: none !important;
  background-color: var(--mclf-field-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--mclf-field-color) !important;
  font-family: inherit;
  line-height: 1.2;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.mclf select.mclf__control {
  cursor: pointer;
  padding-right: 42px;
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%) !important;
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 13px) 50% !important;
  background-size: 5px 5px, 5px 5px !important;
  background-repeat: no-repeat !important;
}

.mclf .mclf__control::placeholder { opacity: 1; }

.mclf .mclf__control:focus,
.mclf .mclf__control:focus-visible {
  border-color: var(--mclf-field-focus-border) !important;
  background-color: var(--mclf-field-focus-bg) !important;
  color: var(--mclf-field-focus-color) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mclf-field-focus-border) 12%, transparent) !important;
}

.mclf__actions { margin-top: var(--mclf-gap); }

.mclf .mclf__submit,
.mclf .mclf__submit:visited {
  appearance: none;
  -webkit-appearance: none;
  min-height: 48px;
  border: 1px solid var(--mclf-button-border) !important;
  background-color: var(--mclf-button-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--mclf-button-color) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
  text-decoration: none !important;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.mclf .mclf__submit:hover,
.mclf .mclf__submit:focus,
.mclf .mclf__submit:focus-visible,
.mclf .mclf__submit:active {
  border-color: var(--mclf-button-hover-border) !important;
  background-color: var(--mclf-button-hover-bg) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--mclf-button-hover-color) !important;
}

.mclf .mclf__submit:hover { transform: translateY(-1px); }
.mclf .mclf__submit:disabled { cursor: wait; opacity: .72; transform: none; }

.mclf__spinner {
  display: none;
  width: 15px;
  height: 15px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: mclfSpin .7s linear infinite;
}
.mclf.is-sending .mclf__spinner { display: inline-block; }
@keyframes mclfSpin { to { transform: rotate(360deg); } }

.mclf__message {
  margin-top: var(--mclf-gap);
  padding: 12px 14px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.45;
}
.mclf__message.is-success { display: block; background: var(--mclf-success-bg); color: var(--mclf-success-color); }
.mclf__message.is-error { display: block; background: var(--mclf-error-bg); color: var(--mclf-error-color); }

.mclf__honeypot {
  position: absolute !important;
  left: -99999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 767px) {
  .mclf__grid { grid-template-columns: 1fr; }
  .mclf__field--full { grid-column: auto; }
}
