/* Klarent Contact — form UI */
.kc-form{
  --kc-paper:#F7F8F4;
  --kc-ink:#15211C;
  --kc-muted:#4B5A52;
  --kc-line:#D3D8CE;
  --kc-pine:#102620;
  --kc-brass:#B0894A;
  --kc-positive:#2E7D5B;
  --kc-danger:#A33B2C;
  --kc-r:14px;
  --kc-rs:10px;
  --kc-ease:cubic-bezier(.22,.61,.36,1);
  position:relative;
  display:grid;
  gap:18px;
  padding:clamp(22px,3vw,32px);
  background:var(--kc-paper);
  border:1px solid var(--kc-line);
  border-radius:var(--kc-r);
  box-shadow:0 24px 60px -40px rgba(16,38,32,.35);
  font-family:"Hanken Grotesk",system-ui,sans-serif;
  color:var(--kc-ink);
}
.kc-form__eyebrow{
  margin:0;
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:11.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--kc-brass);
}
.kc-form__title{
  margin:6px 0 8px;
  font-family:Fraunces,Georgia,serif;
  font-weight:500;
  font-size:clamp(22px,2.4vw,28px);
  line-height:1.15;
  letter-spacing:-.015em;
}
.kc-form__sub{
  margin:0;
  color:var(--kc-muted);
  font-size:14.5px;
  line-height:1.5;
  max-width:42ch;
}
.kc-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:4px;
  background:#E8EBE4;
  border-radius:12px;
}
.kc-tab{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  border:0;
  border-radius:10px;
  padding:12px 14px;
  background:transparent;
  color:var(--kc-muted);
  cursor:pointer;
  text-align:left;
  font:inherit;
  transition:background .2s, color .2s, box-shadow .2s;
}
.kc-tab__label{font-weight:600;font-size:14.5px;color:inherit}
.kc-tab__hint{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:11px;
  opacity:.85;
}
.kc-tab.is-active{
  background:#fff;
  color:var(--kc-ink);
  box-shadow:0 6px 18px -12px rgba(16,38,32,.45);
}
.kc-tab:hover:not(.is-active){color:var(--kc-ink)}
.kc-panel{display:contents}
.kc-panel[hidden]{display:none!important}
.kc-panel.is-active{display:contents}
.kc-optional{font-weight:400;color:var(--kc-muted)}
.kc-field__help{
  margin:0;
  font-size:12.5px;
  color:var(--kc-muted);
  line-height:1.4;
}
.kc-units{
  display:grid;
  grid-template-columns:44px 1fr 44px;
  align-items:stretch;
  border:1px solid var(--kc-line);
  border-radius:var(--kc-rs);
  overflow:hidden;
  background:#fff;
  max-width:220px;
}
.kc-units input{
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  text-align:center;
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:18px;
  font-weight:500;
}
.kc-units__btn{
  border:0;
  background:#EEF1EB;
  color:var(--kc-ink);
  font-size:20px;
  line-height:1;
  cursor:pointer;
  transition:background .2s;
}
.kc-units__btn:hover{background:#e2e7e0}
.kc-form__progress{
  height:3px;
  background:var(--kc-line);
  border-radius:100px;
  overflow:hidden;
}
.kc-form__progress-bar{
  display:block;
  height:100%;
  width:0%;
  background:linear-gradient(90deg,var(--kc-brass),var(--kc-positive));
  border-radius:100px;
  transition:width .45s var(--kc-ease);
}
.kc-form__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px 16px;
}
.kc-field{display:grid;gap:7px;grid-column:span 4}
.kc-field--half{grid-column:span 2}
.kc-field--quarter{grid-column:span 2}
@media(min-width:720px){
  .kc-field--quarter{grid-column:span 1}
}
.kc-field label{
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.01em;
}
.kc-field label abbr{color:var(--kc-brass);text-decoration:none}
.kc-field input,
.kc-field select,
.kc-field textarea{
  width:100%;
  box-sizing:border-box;
  font:inherit;
  font-size:15.5px;
  color:var(--kc-ink);
  background:#fff;
  border:1px solid var(--kc-line);
  border-radius:var(--kc-rs);
  padding:12px 14px;
  transition:border-color .2s, box-shadow .2s, transform .2s;
  outline:none;
  appearance:none;
}
.kc-field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%234B5A52' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:36px;
}
.kc-field textarea{resize:vertical;min-height:110px;line-height:1.45}
.kc-field input:hover,
.kc-field select:hover,
.kc-field textarea:hover{border-color:#b7c0b6}
.kc-field input:focus,
.kc-field select:focus,
.kc-field textarea:focus{
  border-color:var(--kc-pine);
  box-shadow:0 0 0 3px rgba(16,38,32,.12);
}
.kc-field.is-invalid input,
.kc-field.is-invalid select,
.kc-field.is-invalid textarea,
.kc-consent.is-invalid input{
  border-color:var(--kc-danger);
  box-shadow:0 0 0 3px rgba(163,59,44,.12);
}
.kc-field.is-valid input,
.kc-field.is-valid select,
.kc-field.is-valid textarea{
  border-color:var(--kc-positive);
}
.kc-field__error{
  min-height:0;
  font-size:12px;
  color:var(--kc-danger);
  opacity:0;
  transform:translateY(-2px);
  transition:.2s var(--kc-ease);
}
.kc-field.is-invalid .kc-field__error,
.kc-consent.is-invalid .kc-field__error{
  opacity:1;
  transform:none;
}
.kc-field__hint{
  justify-self:end;
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:11px;
  color:var(--kc-muted);
}
.kc-input-affix{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:stretch;
  border:1px solid var(--kc-line);
  border-radius:var(--kc-rs);
  background:#fff;
  overflow:hidden;
  transition:border-color .2s, box-shadow .2s;
}
.kc-input-affix:focus-within{
  border-color:var(--kc-pine);
  box-shadow:0 0 0 3px rgba(16,38,32,.12);
}
.kc-input-affix input{
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
}
.kc-input-affix span{
  display:inline-flex;
  align-items:center;
  padding:0 12px;
  background:#EEF1EB;
  color:var(--kc-muted);
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:12px;
  border-left:1px solid var(--kc-line);
}
.kc-consent{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:10px 12px;
  align-items:start;
  font-size:13px;
  color:var(--kc-muted);
  line-height:1.45;
  cursor:pointer;
}
.kc-consent input{
  margin-top:3px;
  width:18px;height:18px;
  accent-color:var(--kc-pine);
}
.kc-consent .kc-field__error{grid-column:2}
.kc-form__actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px 18px;
  margin-top:4px;
}
.kc-submit{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:50px;
  padding:13px 26px;
  border:0;
  border-radius:100px;
  background:var(--kc-pine);
  color:#F3F5F0;
  font:inherit;
  font-weight:600;
  font-size:15px;
  cursor:pointer;
  transition:transform .25s var(--kc-ease), background .25s, box-shadow .25s;
  box-shadow:0 14px 30px -18px rgba(16,38,32,.7);
}
.kc-submit:hover{background:#0a1a15;transform:translateY(-1px)}
.kc-submit:disabled{opacity:.72;cursor:wait;transform:none}
.kc-submit__arrow{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  transition:transform .25s var(--kc-ease);
}
.kc-submit:hover .kc-submit__arrow{transform:translateX(3px)}
.kc-submit.is-loading .kc-submit__label,
.kc-submit.is-loading .kc-submit__arrow{opacity:0}
.kc-submit__spinner{
  position:absolute;
  width:18px;height:18px;
  border:2px solid rgba(243,245,240,.25);
  border-top-color:#fff;
  border-radius:50%;
  opacity:0;
  animation:kc-spin .7s linear infinite;
}
.kc-submit.is-loading .kc-submit__spinner{opacity:1}
@keyframes kc-spin{to{transform:rotate(360deg)}}
.kc-form__note{
  margin:0;
  font-size:12px;
  color:var(--kc-muted);
  font-family:"IBM Plex Mono",ui-monospace,monospace;
}
.kc-hp{
  position:absolute!important;
  left:-9999px!important;
  width:1px;height:1px;
  overflow:hidden;
}
.kc-banner{
  padding:12px 14px;
  border-radius:var(--kc-rs);
  font-size:14px;
  font-weight:600;
}
.kc-banner--error{background:#F8E8E5;color:var(--kc-danger)}
.kc-success{
  display:none;
  justify-items:center;
  text-align:center;
  gap:8px;
  padding:28px 12px 12px;
}
.kc-success[hidden]{display:none!important}
.kc-form.is-success .kc-success:not([hidden]){
  display:grid;
  animation:kc-pop .55s var(--kc-ease);
}
.kc-form.is-success .kc-form__head,
.kc-form.is-success .kc-tabs,
.kc-form.is-success .kc-form__progress,
.kc-form.is-success .kc-form__grid,
.kc-form.is-success .kc-consent,
.kc-form.is-success .kc-form__actions,
.kc-form.is-success .kc-banner{display:none}
.kc-success__icon{
  width:54px;height:54px;
  border-radius:50%;
  display:grid;place-items:center;
  background:var(--kc-positive);
  color:#fff;
  font-size:24px;
  font-weight:700;
  box-shadow:0 16px 30px -16px rgba(46,125,91,.8);
}
.kc-success__title{
  margin:8px 0 0;
  font-family:Fraunces,Georgia,serif;
  font-size:24px;
  font-weight:500;
}
.kc-success__text{margin:0;color:var(--kc-muted);max-width:36ch}
@keyframes kc-pop{
  from{opacity:0;transform:translateY(10px) scale(.98)}
  to{opacity:1;transform:none}
}
@media(max-width:640px){
  .kc-field--half,
  .kc-field--quarter{grid-column:span 4}
  .kc-form__actions{flex-direction:column;align-items:stretch}
  .kc-submit{width:100%}
}
