/* Demo-Auswahl (demo.vermoegensakte.de), ergänzt start.css. */
.demo-seite { padding: 40px 0 56px; }
.demo-kopf h1 { margin: 6px 0 10px; }
.demo-raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; margin-top: 28px; }
.demo-karte { display: flex; flex-direction: column; gap: 12px; }
.demo-karte h2 { margin: 0; }
.demo-faelle { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.demo-faelle label { display: flex; gap: 10px; align-items: flex-start; border: 1px solid #dde3ea; border-radius: 10px; padding: 10px 12px; cursor: pointer; }
.demo-faelle input { margin-top: 4px; }
.demo-faelle strong { display: block; }
.demo-faelle span { color: #5b6675; font-size: 14px; }
.demo-formular { display: grid; gap: 10px; margin-top: auto; }
.demo-formular label { display: grid; gap: 4px; font-size: 14px; font-weight: 600; }
.demo-formular input:not([type=checkbox]):not([type=radio]) { font: inherit; padding: 10px 12px; border: 1px solid #c9d2dc; border-radius: 8px; font-weight: 400; }
.demo-formular .demo-haken { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.demo-link { background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; font: inherit; cursor: pointer; }
.demo-meldung { margin: 0; font-size: 14px; }
.demo-meldung.fehler { color: #b4433a; }
.demo-hinweis { margin-top: 28px; color: #5b6675; }
.demo-dialog { max-width: min(720px, calc(100vw - 32px)); max-height: calc(100vh - 64px); border: 0; border-radius: 12px; padding: 24px; }
.demo-dialog::backdrop { background: rgba(15, 42, 68, 0.45); }
.demo-bedingungen-text { white-space: pre-wrap; font-size: 14px; margin-bottom: 16px; }
.demo-formular[hidden] { display: none; }