/* kg-pagina-contact
   Gegenereerd door tools/genereer_css.py — niet met de hand bewerken.
   Gescopet onder .kg */

.kg .cform {
  background:var(--kg-papier);
  border:1px solid var(--kg-lijn);
  border-radius:var(--kg-radius);
  padding:clamp(24px,3vw,36px);
}
.kg .cform .rij2 {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.kg .cform label {
  display:block;
  font-family:var(--kg-kop);
  font-weight:700;
  font-size:13.5px;
  margin:16px 0 6px;
}
.kg .cform label .opt {
  font-weight:600;
  color:var(--kg-grijs);
  font-size:12px;
}
.kg .cform input,
.kg .cform select,
.kg .cform textarea {
  width:100%;
  padding:14px 16px;
  border:1px solid var(--kg-lijn);
  border-radius:12px;
  font-family:var(--kg-tekst);
  font-size:15px;
  color:var(--kg-donker);
  background:var(--kg-wit);
  transition:border-color .2s,box-shadow .2s;
}
.kg .cform input:hover,
.kg .cform select:hover,
.kg .cform textarea:hover {
  border-color:rgba(13,31,18,.4);
}
.kg .cform select {
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230D1F12' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  background-size:16px;
  padding-right:44px;
  cursor:pointer;
}
.kg .cform div:focus-within>label,
.kg .cform label:has(+input:focus),
.kg .cform label:has(+select:focus),
.kg .cform label:has(+textarea:focus) {
  color:var(--kg-groen);
}
.kg .cform .btn .arrow {
  display:inline-block;
  transition:transform .25s;
}
.kg .cform .btn:hover .arrow {
  transform:translateX(4px);
}
.kg .cform input:focus,
.kg .cform select:focus,
.kg .cform textarea:focus {
  outline:2px solid var(--kg-groen);
  outline-offset:1px;
}
.kg .cform textarea {
  min-height:130px;
  resize:vertical;
}
.kg .cform .verzend {
  margin-top:22px;
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
}
.kg .cform .privacy {
  font-size:12.5px;
  color:var(--kg-grijs);
}

@media(max-width:640px) {
  .kg .cform .rij2 {
    grid-template-columns:1fr;
  }
}