/* Hauptfarben lassen sich hier einfach an die Website anpassen. */
.csrs-wrap {
    --csrs-primary: #012b51;
    --csrs-accent: #71b4da;
    --csrs-border: #d7e1ea;
    --csrs-bg: #f7f9fc;
    --csrs-text: #273849;
    color: var(--csrs-text);
    width: 100%;
    max-width: 820px;
    font: inherit;
}
.csrs-wrap *, .csrs-wrap *::before, .csrs-wrap *::after { box-sizing: border-box; }
.csrs-wrap .csrs-heading h3 { color: var(--csrs-primary); font-size: 1.3rem; line-height: 1.35; margin: 0 0 6px; font-weight: 700; }
.csrs-wrap .csrs-heading p { margin: 0 0 22px; color: #52687b; }
.csrs-wrap fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
.csrs-wrap legend { width: 100%; padding: 0 0 12px; color: var(--csrs-primary); font-size: 1.08rem; font-weight: 700; }
.csrs-wrap .csrs-product-group { margin: 0 0 22px; }
.csrs-wrap .csrs-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 16px; }
.csrs-wrap .csrs-option { display: flex; align-items: flex-start; gap: 11px; border: 1px solid var(--csrs-border); background: #fff; border-radius: 9px; padding: 12px 14px; margin: 0; cursor: pointer; line-height: 1.4; font-size: 15px; font-weight: 400; transition: border-color 140ms, background-color 140ms; }
.csrs-wrap .csrs-option:hover { border-color: var(--csrs-accent); background: var(--csrs-bg); }
.csrs-wrap input[type="checkbox"] { flex: 0 0 auto; appearance: auto; accent-color: var(--csrs-primary); width: 18px; height: 18px; margin: 1px 0 0; cursor: pointer; }
.csrs-wrap .csrs-option:has(input:checked) { border-color: var(--csrs-primary); background: #edf5fb; }
.csrs-wrap .csrs-contact-group { padding-top: 9px; margin-top: 15px; border-top: 1px solid var(--csrs-border); }
.csrs-wrap .csrs-contact-group legend { padding-top: 24px; }
.csrs-wrap .csrs-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.csrs-wrap .csrs-field { display: flex; flex-direction: column; gap: 7px; }
.csrs-wrap .csrs-field-full { grid-column: 1 / -1; }
.csrs-wrap .csrs-field label { font-size: 14px; font-weight: 600; color: var(--csrs-primary); }
.csrs-wrap .csrs-field input, .csrs-wrap .csrs-field textarea { width: 100%; max-width: 100%; margin: 0; padding: 12px 14px; color: var(--csrs-text); font: inherit; font-size: 15px; line-height: 1.4; background: #fff; border: 1px solid #bfcdda; border-radius: 8px; box-shadow: none; }
.csrs-wrap .csrs-field input:focus, .csrs-wrap .csrs-field textarea:focus { outline: 2px solid var(--csrs-accent); outline-offset: 1px; border-color: var(--csrs-primary); }
.csrs-wrap .csrs-privacy { display: flex; align-items: flex-start; gap: 10px; margin: 23px 0 8px; font-size: 14px; line-height: 1.5; cursor: pointer; }
.csrs-wrap .csrs-privacy a { color: var(--csrs-primary); text-decoration: underline; }
.csrs-wrap .csrs-mandatory { color: #627185; font-size: 13px; margin: 8px 0 16px; }
.csrs-wrap .csrs-submit { display: inline-flex; justify-content: center; align-items: center; gap: 8px; padding: 14px 24px; min-height: 48px; background: var(--csrs-primary); color: #fff; border: 1px solid var(--csrs-primary); border-radius: 8px; cursor: pointer; font: inherit; font-size: 15px; font-weight: 700; transition: background-color 140ms; }
.csrs-wrap .csrs-submit:hover, .csrs-wrap .csrs-submit:focus { color: #fff; background: #17466f; }
.csrs-wrap .csrs-notice { padding: 14px 17px; border-radius: 8px; margin: 0 0 20px; line-height: 1.5; }
.csrs-wrap .csrs-success { color: #155b37; background: #eaf6ee; border: 1px solid #aadac0; }
.csrs-wrap .csrs-error, .csrs-wrap .csrs-selection-error { color: #9f2525; background: #fff1f1; border: 1px solid #efbbbb; }
.csrs-wrap .csrs-selection-error { padding: 10px 12px; margin: 0 0 14px; border-radius: 7px; }
.csrs-wrap .csrs-selection-error[hidden] { display: none; }
.csrs-wrap .csrs-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
@media (max-width: 620px) { .csrs-wrap .csrs-options, .csrs-wrap .csrs-fields { grid-template-columns: minmax(0, 1fr); } .csrs-wrap .csrs-option { padding: 12px; } .csrs-wrap .csrs-submit { width: 100%; } }
