:root{--seite:#f6f5f3;--karte:#fff;--text:#1a1a1a;--text-leise:#6f6c66;--rot:#af0612;--rot-tint:#fbe9ea;--schwarz:#111;--rand:#e6e3de;--rand-stark:#cbc7c0;--radius:16px;--radius-knopf:8px}*{box-sizing:border-box}html,body{background:var(--seite);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-family:Helvetica Neue,Helvetica,Segoe UI,Arial,sans-serif;line-height:1.55}.seite{background-image:linear-gradient(#14121073,#1412108c),url(/marke/hintergrund.jpg);background-position:50%;background-size:cover;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.karte{background:var(--karte);border:1px solid var(--rand);border-radius:var(--radius);width:100%;max-width:580px;padding:40px;box-shadow:0 24px 70px #00000047}.marke{text-align:center;margin-bottom:30px}.marke-logo{width:auto;max-width:80%;height:30px}.fortschritt{background:var(--rand);border-radius:999px;height:4px;margin-bottom:28px;overflow:hidden}.fortschritt-balken{background:var(--rot);height:100%;transition:width .35s}.schritt-nr{letter-spacing:.16em;text-transform:uppercase;color:var(--text-leise);margin-bottom:12px;font-size:12px;font-weight:600}h1{letter-spacing:-.02em;margin:0 0 14px;font-size:30px;font-weight:800;line-height:1.15}h2{letter-spacing:-.01em;margin:0 0 22px;font-size:23px;font-weight:700;line-height:1.25}p{margin:0 0 16px}.leise{color:var(--text-leise)}.optionen{flex-direction:column;gap:10px;margin:22px 0;display:flex}.option{border:1.5px solid var(--rand);cursor:pointer;border-radius:10px;align-items:center;gap:12px;padding:15px 18px;font-size:16px;transition:border-color .15s,background .15s;display:flex}.option:hover{border-color:var(--rand-stark)}.option.gewaehlt{border-color:var(--rot);background:var(--rot-tint)}.option input{accent-color:var(--rot);width:18px;height:18px}.skala{gap:8px;margin:22px 0 10px;display:flex}.skala button{border:1.5px solid var(--rand);background:var(--karte);color:var(--text);cursor:pointer;border-radius:10px;flex:1;padding:15px 0;font-size:17px;font-weight:600;transition:border-color .15s,background .15s,color .15s}.skala button:hover{border-color:var(--rand-stark)}.skala button.gewaehlt{border-color:var(--rot);background:var(--rot);color:#fff}.skala-legende{letter-spacing:.04em;color:var(--text-leise);justify-content:space-between;font-size:12px;display:flex}label.feld{letter-spacing:.04em;text-transform:uppercase;color:var(--text-leise);margin:0 0 18px;font-size:13px;font-weight:600;display:block}label.feld span{margin-bottom:7px;display:block}input[type=text],input[type=email]{border:1.5px solid var(--rand);width:100%;color:var(--text);text-transform:none;letter-spacing:normal;border-radius:10px;padding:14px 15px;font-family:inherit;font-size:16px;font-weight:400}input[type=text]:focus,input[type=email]:focus{border-color:var(--text);outline:none}input[type=file]{width:100%;color:var(--text-leise);margin:6px 0 18px;font-size:15px}input[type=file]::file-selector-button{border:1.5px solid var(--text);border-radius:var(--radius-knopf);background:var(--karte);color:var(--text);letter-spacing:.04em;cursor:pointer;margin-right:14px;padding:11px 18px;font-size:14px;font-weight:600}input[type=file]::file-selector-button:hover{background:#f2f0ed}.vorschau{object-fit:contain;border:1px solid var(--rand);background:#fafafa;border-radius:12px;width:100%;max-height:280px;margin:6px 0 18px}.einwilligung{border:1px solid var(--rand);background:#faf9f7;border-radius:12px;align-items:center;gap:12px;margin:18px 0;padding:16px 18px;font-size:15px;line-height:1.5;display:flex}.einwilligung input{width:18px;height:18px;accent-color:var(--rot);flex-shrink:0;margin-top:3px}.hinweis-icon{background:var(--rot);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;font-size:15px;font-weight:800;line-height:1;display:inline-flex}.feinhinweis{color:var(--text-leise);margin:10px 2px 0;font-size:13px;line-height:1.5}.feinhinweis a{color:var(--rot);text-underline-offset:2px;text-decoration:underline}.zustimmung{letter-spacing:normal;text-transform:none;color:var(--text);cursor:pointer;align-items:flex-start;gap:12px;margin:6px 0 4px;font-size:14px;font-weight:400;line-height:1.45;display:flex}.zustimmung input[type=checkbox]{appearance:none;border:2px solid var(--rot);background:var(--karte);cursor:pointer;border-radius:6px;flex-shrink:0;width:22px;height:22px;margin:1px 0 0;position:relative}.zustimmung input[type=checkbox]:checked{background:var(--rot)}.zustimmung input[type=checkbox]:checked:after{content:"";border:2px solid #fff;border-width:0 2px 2px 0;width:6px;height:11px;position:absolute;top:2px;left:6px;transform:rotate(45deg)}.knopf-reihe{gap:12px;margin-top:28px;display:flex}button.primaer{border-radius:var(--radius-knopf);background:var(--schwarz);color:#fff;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border:none;flex:1;padding:16px 22px;font-size:14px;font-weight:700;transition:opacity .15s}button.primaer:hover{opacity:.86}button.primaer:disabled{opacity:.28;cursor:not-allowed}button.zurueck{border:1.5px solid var(--rand-stark);border-radius:var(--radius-knopf);background:var(--karte);color:var(--text);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:16px 22px;font-size:14px;font-weight:700}button.zurueck:hover{border-color:var(--text)}.fehler{color:var(--rot);margin-top:14px;font-size:15px}.link-knopf{color:var(--text-leise);text-underline-offset:3px;cursor:pointer;background:0 0;border:none;margin:20px auto 0;padding:6px 4px;font-size:15px;text-decoration:underline;display:block}.link-knopf:hover{color:var(--rot)}.zentrum{text-align:center}.gross-emoji{margin-bottom:10px;font-size:46px}a.umsehen-knopf{border-radius:var(--radius-knopf);background:var(--rot);color:#fff;white-space:pre-line;cursor:pointer;border:none;margin:28px auto 0;padding:16px 28px;font-size:17px;font-weight:700;line-height:1.4;text-decoration:none;transition:background .15s,box-shadow .15s,transform 50ms;display:inline-block;box-shadow:0 4px 14px #af061247}a.umsehen-knopf:hover{background:#8f050f;box-shadow:0 6px 18px #af061261}a.umsehen-knopf:active{transform:translateY(1px)}@media (max-width:560px){.karte{border-radius:14px;padding:26px 20px}h1{font-size:25px}h2{font-size:20px}.knopf-reihe{flex-direction:column-reverse}button.zurueck{width:100%}}
