/* KH STAY CONNECTED PANEL START */

.kh-v2-connect {
  position: relative;
  display: flex;
  align-items: safe center;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  padding: 48px 32px;
  overflow: hidden;
  background:
    radial-gradient(
      ellipse at 4% 50%,
      rgba(23, 55, 38, 0.14) 0%,
      rgba(23, 55, 38, 0.075) 18%,
      rgba(23, 55, 38, 0) 46%
    ),
    radial-gradient(
      ellipse at 96% 50%,
      rgba(211, 168, 78, 0.17) 0%,
      rgba(211, 168, 78, 0.085) 20%,
      rgba(211, 168, 78, 0) 47%
    ),
    linear-gradient(
      180deg,
      #f7f4ed 0%,
      #fffdf8 55%,
      #eee7d7 100%
    );
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

.kh-v2-connect::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: min(160px, 28vw);
  height: 3px;
  background: #d3a84e;
  content: "";
  transform: translateX(-50%);
}

.kh-v2-connect__inner {
  width: min(900px, 100%);
  margin: 0 auto;
  text-align: center;
}

.kh-v2-connect__heading {
  margin: 0 auto 20px;
}

.kh-v2-connect__heading .kh-v2-section-label {
  margin: 0;
  color: #8b6827;
}
.kh-v2-connect__form {
  width: min(720px, 100%);
  margin: 0 auto;
}

@media (min-width: 901px) and (max-height: 800px) {
  .kh-v2-connect {
    padding: 32px;
  }
}

@media (max-width: 900px) {
  .kh-v2-connect {
    min-height: auto;
    padding: 72px 20px;
  }
}

@media (max-width: 520px) {
  .kh-v2-connect {
    padding: 58px 16px;
  }

  .kh-v2-connect__heading {
    margin-bottom: 26px;
  }
}

/* KH STAY CONNECTED PANEL END */

/* Complete-form landings opt in through the shared page-layout classes.
   Keep provider floats inside their measured containers, including consent,
   reCAPTCHA and the action. No fixed form height or clipping. */
.kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedBody,
.kh-layout-document .kh-v2-connect.kh-layout-landing .ml-block-form {
  display: flow-root;
}

.kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-fieldRow input,
.kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedSubmit button {
  min-height: 44px;
}

@media (min-width: 1000px) {
  .kh-layout-document.kh-layout-measured .kh-v2-connect.kh-layout-landing {
    min-height: var(--kh-layout-usable);
    padding-block: 24px;
    overflow: visible;
    align-items: safe center;
    --kh-connect-card-padding: 24px;
    --kh-connect-form-gap: 16px;
  }

  /* The live provider injects ID-qualified CSS after page load. These scoped
     overrides must win that cascade without depending on a provider form ID. */
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedWrapper.embedForm {
    max-width: 520px !important;
  }
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedBody {
    padding: var(--kh-connect-card-padding) !important;
  }
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedContent,
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-formContent,
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-checkboxRow,
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-recaptcha {
    margin-bottom: var(--kh-connect-form-gap) !important;
  }
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedContent h4 {
    line-height: 1.2 !important;
    margin-bottom: 8px !important;
  }
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-checkboxRow .label-description,
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-checkboxRow .label-description p {
    font-size: 14px !important;
    line-height: 20px !important;
  }
  .kh-layout-document .kh-v2-connect.kh-layout-landing .ml-form-embedSubmit {
    margin-bottom: 0 !important;
  }
}

@media (min-width: 1000px) and (max-height: 800px) {
  .kh-layout-document.kh-layout-measured .kh-v2-connect.kh-layout-landing {
    padding-block: 16px;
    --kh-connect-card-padding: 20px;
    --kh-connect-form-gap: 12px;
  }
}
