.kconv-form {
  --kconv-ink: #162d33;
  --kconv-accent: #155c48;
  box-sizing: border-box;
  max-width: 700px;
  margin: 1.5rem 0;
  color: var(--kconv-ink);
  overflow-wrap: anywhere;
  font-family: inherit
}

.kconv-form * {
  box-sizing: border-box
}

.kconv-form .kconv-field {
  margin: 0 0 1.25rem
}

.kconv-form label,
.kconv-form legend {
  display: block;
  font-weight: 600;
  margin-bottom: .45rem
}

.kconv-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.kconv-form textarea,
.kconv-form select {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  border: 1px solid #6f848b;
  border-radius: 8px;
  padding: .8rem .9rem;
  font: inherit;
  background: #fff;
  color: #162d33;
  min-height: 48px
}

.kconv-form input:focus-visible,
.kconv-form textarea:focus-visible,
.kconv-form select:focus-visible,
.kconv-form button:focus-visible,
.kconv-form a:focus-visible {
  outline: 3px solid #2372b5;
  outline-offset: 3px
}

.kconv-form input[type=checkbox],
.kconv-form input[type=radio] {
  width: 20px;
  height: 20px;
  accent-color: var(--kconv-accent);
  flex-shrink: 0
}

.kconv-form .kconv-choice {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-weight: 400;
  min-height: 32px
}

.kconv-form fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0
}

.kconv-form legend {
  padding: 0
}

.kconv-form .kconv-help {
  display: block;
  color: #48616a;
  margin-top: .4rem;
  font-size: .875em
}

.kconv-form .kconv-error {
  display: block;
  color: #a51c27;
  font-size: .9em;
  margin-top: .35rem
}

.kconv-form [aria-invalid=true] {
  border-color: #a51c27 !important
}

.kconv-form .kconv-submit {
  max-width: 100%;
  border: 0;
  border-radius: 8px;
  padding: .85rem 1.4rem;
  background: var(--kconv-accent);
  color: white;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  min-height: 48px
}

.kconv-form .kconv-submit:disabled {
  opacity: .65;
  cursor: wait
}

.kconv-form .kconv-status:empty {
  display: none
}

.kconv-form .kconv-status {
  padding: 1rem;
  margin: 0 0 1rem;
  border-radius: 8px;
  background: #edf4f1
}

.kconv-form .kconv-status.kconv-failure {
  background: #fff0ef;
  color: #812027
}

.kconv-form .kconv-status.kconv-success {
  background: #e7f5e9;
  color: #20532b
}

.kconv-form .kconv-trap {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0
}

.kconv-form [hidden] {
  display: none !important
}

@media(prefers-reduced-motion:reduce) {
  .kconv-form * {
    scroll-behavior: auto !important;
    transition: none !important
  }
}

/* Opt-in presets. The original classic / forest / comfortable rules above stay intact. */
.kconv-form[data-kconv-accent=forest] {
  --kconv-accent-soft: #edf4f1;
  --kconv-accent-line: #cfdfd5
}

.kconv-form[data-kconv-accent=indigo] {
  --kconv-accent: #4338ca;
  --kconv-accent-soft: #eef2ff;
  --kconv-accent-line: #c7d2fe
}

.kconv-form[data-kconv-accent=ink] {
  --kconv-accent: #18212f;
  --kconv-accent-soft: #f3f4f6;
  --kconv-accent-line: #d1d5db
}

.kconv-form[data-kconv-style=studio] {
  padding: clamp(20px, 4vw, 36px);
  border: 1px solid #dbe5dc;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 32px #1735260a
}

.kconv-form[data-kconv-style=studio] .kconv-field {
  margin-bottom: 1.5rem
}

.kconv-form[data-kconv-style=studio] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.kconv-form[data-kconv-style=studio] textarea,
.kconv-form[data-kconv-style=studio] select {
  border-color: #7c8e7f;
  border-radius: 10px;
  background: #f7faf7;
  padding: .9rem 1rem
}

.kconv-form[data-kconv-style=studio] .kconv-choice {
  padding: .45rem .65rem;
  border-radius: 8px;
  background: var(--kconv-accent-soft, #edf4f1);
  margin-bottom: .5rem
}

.kconv-form[data-kconv-style=studio] .kconv-submit {
  width: 100%;
  border-radius: 10px;
  padding: 1rem 1.5rem;
  min-height: 50px
}

.kconv-form[data-kconv-style=minimal] {
  padding: 4px 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none
}

.kconv-form[data-kconv-style=minimal] .kconv-field {
  margin-bottom: 1.75rem
}

.kconv-form[data-kconv-style=minimal] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.kconv-form[data-kconv-style=minimal] textarea,
.kconv-form[data-kconv-style=minimal] select {
  border: 0;
  border-bottom: 1px solid #7c8e7f;
  border-radius: 0;
  background: transparent;
  padding: .8rem .1rem;
  box-shadow: none
}

.kconv-form[data-kconv-style=minimal] .kconv-submit {
  border-radius: 2px;
  padding: .9rem 1.65rem
}

.kconv-form[data-kconv-style=studio] .kconv-step-next,
.kconv-form[data-kconv-style=minimal] .kconv-step-next,
.kconv-form[data-kconv-accent=indigo] .kconv-step-next,
.kconv-form[data-kconv-accent=ink] .kconv-step-next {
  background: var(--kconv-accent);
  border-color: var(--kconv-accent);
  color: #fff
}

.kconv-form[data-kconv-style=minimal] .kconv-step-navigation button {
  border-radius: 2px
}

.kconv-form[data-kconv-style=studio] :is(input, textarea, select, button, a):focus-visible,
.kconv-form[data-kconv-style=minimal] :is(input, textarea, select, button, a):focus-visible,
.kconv-form[data-kconv-accent=indigo] :is(input, textarea, select, button, a):focus-visible,
.kconv-form[data-kconv-accent=ink] :is(input, textarea, select, button, a):focus-visible {
  outline-color: var(--kconv-accent)
}

.kconv-form[data-kconv-style=studio] .kconv-step-navigation button:focus-visible,
.kconv-form[data-kconv-style=minimal] .kconv-step-navigation button:focus-visible,
.kconv-form[data-kconv-accent=indigo] .kconv-step-navigation button:focus-visible,
.kconv-form[data-kconv-accent=ink] .kconv-step-navigation button:focus-visible {
  outline-color: var(--kconv-accent)
}

.kconv-form[data-kconv-density=compact] .kconv-field {
  margin-bottom: .85rem
}

.kconv-form[data-kconv-density=compact] label,
.kconv-form[data-kconv-density=compact] legend {
  margin-bottom: .3rem
}

.kconv-form[data-kconv-density=compact] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.kconv-form[data-kconv-density=compact] textarea,
.kconv-form[data-kconv-density=compact] select {
  padding: .55rem .75rem;
  min-height: 44px
}

.kconv-form[data-kconv-density=compact] textarea {
  min-height: 100px
}

.kconv-form[data-kconv-density=compact] .kconv-submit {
  padding: .65rem 1.15rem;
  min-height: 44px
}

.kconv-form[data-kconv-style=minimal][data-kconv-density=compact] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.kconv-form[data-kconv-style=minimal][data-kconv-density=compact] textarea,
.kconv-form[data-kconv-style=minimal][data-kconv-density=compact] select {
  padding-left: .1rem;
  padding-right: .1rem
}

.kconv-form[data-kconv-style=studio][data-kconv-density=compact] {
  padding: clamp(18px, 3vw, 26px)
}

/* Layout and branding choices use bounded tokens; no user-authored CSS is accepted. */
.kconv-form[data-kconv-font=system] {
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif
}

.kconv-form[data-kconv-font=serif] {
  font-family: Georgia, "Times New Roman", serif
}

.kconv-form[data-kconv-width=wide] {
  max-width: 960px
}

.kconv-form[data-kconv-width=full] {
  max-width: none;
  width: 100%
}

.kconv-form[data-kconv-layout=columns] .kconv-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.25rem;
  container: kconv-fields / inline-size
}

.kconv-form[data-kconv-layout=columns] .kconv-fields>.kconv-field {
  grid-column: 1 / -1;
  min-width: 0
}

@container kconv-fields (min-width:520px) {
  .kconv-form[data-kconv-layout=columns] .kconv-fields>.kconv-field[data-kconv-width=half] {
    grid-column: auto / span 1
  }
}

.kconv-form .kconv-form-intro {
  margin: 0 0 1.75rem;
  padding: 0;
  border: 0;
  background: transparent
}

.kconv-form .kconv-form-intro h2 {
  margin: 0 0 .55rem;
  padding: 0;
  color: var(--kconv-ink);
  font: inherit;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.025em;
  overflow-wrap: anywhere
}

.kconv-form .kconv-form-intro p {
  margin: 0;
  padding: 0;
  color: #48616a;
  font: inherit;
  line-height: 1.6;
  overflow-wrap: anywhere
}

.kconv-form[data-kconv-radius=square],
.kconv-form[data-kconv-radius=square] :is(input:not([type=radio]),
  textarea,
  select,
  .kconv-submit,
  .kconv-step-navigation button,
  .kconv-choice) {
  border-radius: 0
}

.kconv-form[data-kconv-radius=rounded] {
  border-radius: 24px
}

.kconv-form[data-kconv-radius=rounded] :is(input:not([type=radio]):not([type=checkbox]), textarea, select, .kconv-choice) {
  border-radius: 14px
}

.kconv-form[data-kconv-radius=rounded] :is(.kconv-submit, .kconv-step-navigation button) {
  border-radius: 999px
}

.kconv-form[data-kconv-custom-accent] .kconv-submit,
.kconv-form[data-kconv-custom-accent] .kconv-step-next {
  background: var(--kconv-accent);
  border-color: var(--kconv-accent);
  color: var(--kconv-accent-ink)
}

/* Keep a contrasting focus ring even when an owner chooses a very pale brand color. */
.kconv-form[data-kconv-custom-accent] :is(input, textarea, select, button, a):focus-visible,
.kconv-form[data-kconv-custom-accent] .kconv-step-navigation button:focus-visible {
  outline-color: #2372b5
}

/* Keep long enquiries comfortable on phones without reducing control targets. */
@media(max-width:520px) {
  .kconv-form {
    font-size: 1rem;
    line-height: 1.5;
    margin: 1rem 0
  }

  .kconv-form[data-kconv-style=studio] {
    padding: 18px;
    border-radius: 18px
  }

  .kconv-form .kconv-form-intro {
    margin-bottom: 1.25rem
  }

  .kconv-form .kconv-form-intro h2 {
    font-size: clamp(1.25rem, 5.8vw, 1.55rem);
    line-height: 1.25
  }

  .kconv-form .kconv-form-intro p {
    line-height: 1.5
  }

  .kconv-form .kconv-field,
  .kconv-form[data-kconv-style=studio] .kconv-field,
  .kconv-form[data-kconv-style=minimal] .kconv-field {
    margin-bottom: 1.15rem
  }

  .kconv-form label,
  .kconv-form legend {
    line-height: 1.4;
    margin-bottom: .4rem
  }

  .kconv-form .kconv-help {
    font-size: .875em;
    line-height: 1.5;
    margin-top: .35rem
  }

  .kconv-form .kconv-choice {
    min-height: 44px;
    margin-bottom: .35rem
  }

  .kconv-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  .kconv-form select {
    min-height: 48px
  }

  .kconv-form textarea {
    height: 132px;
    min-height: 112px;
    resize: vertical
  }

  .kconv-form[data-kconv-density=compact] .kconv-field {
    margin-bottom: .9rem
  }
}

.kconv-form .kconv-error-summary {
  border: 2px solid #b32d2e;
  border-radius: 6px;
  padding: 1rem;
  margin: 0 0 1rem;
  background: #fff;
  color: #641818
}

.kconv-form .kconv-error-summary[hidden] {
  display: none
}

.kconv-form .kconv-error-summary p {
  margin: 0 0 .5rem;
  font-weight: 600
}

.kconv-form .kconv-error-summary ul {
  margin: .5rem 0 0;
  padding-inline-start: 1.5rem
}

.kconv-form .kconv-error-summary a {
  color: #8a1718;
  text-decoration: underline
}

.kconv-form .kconv-error-summary a:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px
}
