.ki-form {
max-width: 720px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: 15px;
color: #1a1a2e;
} .ki-notice {
padding: 14px 18px;
border-radius: 6px;
margin-bottom: 24px;
font-size: 15px;
line-height: 1.5;
}
.ki-success {
background: #e8f5e9;
border-left: 4px solid #2e7d32;
color: #1b5e20;
}
.ki-error {
background: #fdecea;
border-left: 4px solid #c62828;
color: #7f0000;
}
.ki-error ul {
margin: 6px 0 0 18px;
padding: 0;
}
.ki-error li { margin-bottom: 4px; } .ki-fieldset {
border: 1px solid #d0d7e2;
border-radius: 10px;
padding: 24px;
margin-bottom: 24px;
background: #f9fafb;
}
.ki-fieldset legend {
font-weight: 700;
font-size: 16px;
color: #2a4080;
padding: 0 8px;
letter-spacing: .01em;
} .ki-row {
display: grid;
gap: 16px;
margin-bottom: 16px;
}
.ki-row:last-child { margin-bottom: 0; }
.ki-row--2 { grid-template-columns: 1fr 1fr; }
.ki-row--3 { grid-template-columns: 1fr auto 1fr; } .ki-field { display: flex; flex-direction: column; gap: 5px; }
.ki-field--small { max-width: 160px; }
.ki-field label {
font-weight: 600;
font-size: 13px;
color: #374151;
text-transform: uppercase;
letter-spacing: .04em;
}
.ki-field label span { color: #c62828; margin-left: 2px; }
.ki-field input[type="text"],
.ki-field input[type="email"],
.ki-field input[type="tel"],
.ki-field input[type="number"],
.ki-field input[type="date"],
.ki-field textarea {
border: 1px solid #c5cdd8;
border-radius: 6px;
padding: 10px 12px;
font-size: 15px;
color: #1a1a2e;
background: #fff;
transition: border-color .15s, box-shadow .15s;
width: 100%;
box-sizing: border-box;
font-family: inherit;
}
.ki-field input:focus,
.ki-field textarea:focus {
outline: none;
border-color: #2a4080;
box-shadow: 0 0 0 3px rgba(42, 64, 128, .15);
} .ki-radio-group {
display: flex;
flex-wrap: wrap;
gap: 10px;
padding-top: 4px;
}
.ki-radio {
display: flex;
align-items: center;
gap: 6px;
cursor: pointer;
font-weight: 400;
font-size: 15px;
text-transform: none;
letter-spacing: 0;
color: #1a1a2e;
padding: 8px 14px;
border: 1px solid #c5cdd8;
border-radius: 6px;
background: #fff;
transition: border-color .15s, background .15s;
}
.ki-radio:has(input:checked) {
border-color: #2a4080;
background: #eef1fb;
color: #2a4080;
font-weight: 600;
}
.ki-radio input[type="radio"] { accent-color: #2a4080; } .ki-readonly {
background: #f0f3fa !important;
color: #4b5563 !important;
cursor: default;
} .ki-postcode-status {
font-size: 13px;
min-height: 18px;
margin-top: -8px;
margin-bottom: 8px;
}
.ki-postcode-bezig { color: #2a4080; }
.ki-postcode-fout  { color: #c62828; } .ki-required-note {
font-size: 13px;
color: #6b7280;
margin-bottom: 20px;
}
.ki-required-note span { color: #c62828; }
.ki-btn {
display: inline-block;
background: #2a4080;
color: #fff;
border: none;
border-radius: 8px;
padding: 14px 32px;
font-size: 16px;
font-weight: 700;
cursor: pointer;
letter-spacing: .02em;
transition: background .2s, transform .1s;
}
.ki-btn:hover  { background: #1d2d5c; }
.ki-btn:active { transform: scale(.98); } @media (max-width: 600px) {
.ki-row--2,
.ki-row--3 { grid-template-columns: 1fr; }
.ki-field--small { max-width: 100%; }
.ki-fieldset { padding: 16px; }
}