:root{--color-bg:#101820;--color-bg-elevated:#1a212e;--color-accent:#ffe833;--color-text:#fff;--color-text-muted:#d9d9d9;--color-light:#e6e6e6;--color-on-accent:#101820;--color-ghost:rgba(255,255,255,.04);--font-family:'Alexandria',sans-serif;--radius-card:16px;--radius-button:50px;--content-max-width:1140px;--section-padding-y:100px}
*{box-sizing:border-box}body{margin:0;background:var(--color-bg);color:var(--color-text);font:16px/1.6 var(--font-family);min-height:100svh}button,input,textarea{font:inherit}button,a,input,textarea{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-underline-offset:4px}button:disabled{cursor:wait;opacity:.6}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--color-accent);outline-offset:5px}h1:focus{outline:none}.skip{position:fixed;left:12px;top:-100px;z-index:5;background:var(--color-accent);color:var(--color-bg);padding:12px}.skip:focus{top:12px}.progress-track{height:6px;position:absolute;top:0;left:0;right:0;background:#394047}#fortschritt{background:var(--color-accent);height:100%;width:11.111%;transition:width .18s ease}.header{max-width:1060px;margin:0 auto;padding:30px 30px;display:flex;justify-content:space-between;align-items:center;gap:16px}.header img{display:block;width:215px;height:auto}.secondary{background:var(--color-bg-elevated);color:#fff;border:1px solid #58616a;padding:9px 16px;border-radius:6px;font-size:14px;min-height:44px}.window{max-width:1000px;margin:56px auto 0;padding:0 30px}.step-heading{text-align:center;margin-bottom:30px}.step-label{font-size:14px;color:var(--color-accent);margin:0 0 10px}h1{font-size:30px;line-height:1.3;font-weight:500;margin:0 auto;max-width:900px;text-wrap:balance}.subtitle{color:var(--color-text-muted);font-size:15px;max-width:850px;margin:18px auto 0;line-height:1.65}.subtitle:empty{display:none}.choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.choice{border:2px solid transparent;border-radius:6px;background:var(--color-accent);color:var(--color-on-accent);min-height:178px;padding:26px 12px 20px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:26px;font-size:15px;line-height:1.4;font-weight:500}.choice:hover{background:#fff16b}.choice[aria-pressed=true]{outline:2px solid white;outline-offset:4px}.choice svg{width:38px;height:38px;display:block}.choice:focus-visible{outline:3px solid white}.option-description{color:var(--color-text-muted);font-size:14px;line-height:1.65}.descriptions{margin:0 0 30px;padding:0;list-style:none}.descriptions li+li{margin-top:8px}.field{margin-bottom:18px}.field label{display:block;font-size:14px;margin-bottom:8px}.field input:not([type=checkbox]),.field textarea{display:block;width:100%;background:#fff;color:#101820;border:2px solid #cbd0d4;border-radius:6px;padding:16px 18px;font-size:16px;min-height:58px;line-height:1.5}.field textarea{resize:vertical;min-height:145px}.field input::placeholder,.field textarea::placeholder{color:#656b71}.field input[aria-invalid=true],.field textarea[aria-invalid=true]{border-color:#d94235}.field-note{font-size:14px;color:var(--color-text-muted);margin:8px 0 0}.field input[type=file]{padding:12px}.field input[type=file]::file-selector-button{padding:8px 12px;margin-right:16px;background:#e6e6e6;color:#101820;border:1px solid #999;border-radius:3px;cursor:pointer}.file-info{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:14px;overflow-wrap:anywhere}.text-button,.back{color:inherit;border:0;background:none;font-size:14px;padding:10px 0;text-decoration:underline;text-underline-offset:4px;min-height:44px}.actions{display:flex;gap:20px;align-items:center;margin-top:22px}.primary{display:flex;justify-content:center;align-items:center;gap:20px;background:var(--color-accent);border:0;color:var(--color-on-accent);border-radius:var(--radius-button);padding:17px 24px;min-height:58px;font-weight:500;text-decoration:none;text-align:center;line-height:1.4;flex:1}.primary:hover{background:#fff16b}.primary span{margin-left:auto}.actions .back{flex:none;padding-right:8px}.actions.selection{justify-content:flex-start}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.contact-grid .field:first-child{grid-column:1/-1}.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;margin:10px 0 20px}.consent input{accent-color:var(--color-accent);width:20px;height:20px;flex-shrink:0;margin-top:3px}.delivery-note{font-size:14px;color:var(--color-text-muted);margin-top:24px}.error{border-left:3px solid #ff7468;padding:10px 14px;background:var(--color-bg-elevated);margin-top:18px}.titlebar,.statusbar{display:none}footer{max-width:1000px;margin:70px auto 32px;padding:0 30px;display:flex;justify-content:space-between;gap:18px;font-size:14px;color:var(--color-text-muted)}.notification{font-size:14px;text-align:center;min-height:24px;margin:0 20px 24px}.complete{max-width:760px;margin:auto}.complete p{color:var(--color-text-muted)}.complete .primary{margin:26px 0 12px}.summary{width:100%;min-height:220px;background:#fff;color:#101820;font:14px/1.6 var(--font-family);border:1px solid #999;border-radius:6px;padding:16px;resize:vertical}.success-icon{display:block;color:var(--color-accent);font-size:44px;text-align:center;margin-bottom:20px}.noscript{margin:40px auto;max-width:700px;padding:24px}
html[data-theme=paint] body{font-family:Arial,Helvetica,sans-serif;background-color:#c0c0c0;background-image:radial-gradient(#eee .7px,transparent .7px);background-size:4px 4px}html[data-theme=paint] .header{max-width:1060px;background:#101820;margin-top:22px;padding:20px 26px}html[data-theme=paint] .window{background:#c0c0c0;color:#101010;border:3px solid;border-color:#fff #404040 #404040 #fff;box-shadow:1px 1px 0 1px #101010;padding:3px;margin-top:40px}html[data-theme=paint] .titlebar{display:flex;justify-content:space-between;align-items:center;background:#000080;color:#fff;padding:5px 9px;font-weight:700;font-size:15px;line-height:1.4}html[data-theme=paint] .window-icon{background:#c0c0c0;color:#101010;border:2px outset #fff;font-size:14px;line-height:17px;width:21px;text-align:center}html[data-theme=paint] .window-body{padding:34px 30px 0}html[data-theme=paint] h1{font-family:Arial,Helvetica,sans-serif;font-weight:700}html[data-theme=paint] .step-label{display:inline-block;background:#fff;color:#101010;border:2px inset #eee;padding:2px 10px;font:14px/1.4 Arial,sans-serif}html[data-theme=paint] :is(.subtitle,.option-description,.field-note,.delivery-note,.complete p){color:#333}html[data-theme=paint] .choice{border:3px outset #fff598;border-radius:0;font-family:Arial,sans-serif;font-weight:700}html[data-theme=paint] .choice[aria-pressed=true]{outline:2px dotted #101010;outline-offset:-8px;border-style:inset}html[data-theme=paint] .choice:focus-visible{outline:2px dotted #101010;outline-offset:-8px}html[data-theme=paint] .primary{border-radius:0;border:3px outset #fff598;font-family:Arial,sans-serif;font-weight:700}html[data-theme=paint] .primary:active{border-style:inset}html[data-theme=paint] .field input:not([type=checkbox]),html[data-theme=paint] .field textarea,html[data-theme=paint] .summary{border:2px inset #eee;border-radius:0;font-family:Arial,sans-serif}html[data-theme=paint] .statusbar{display:flex;justify-content:space-between;gap:16px;border:2px inset #eee;color:#333;font-size:12px;padding:3px 8px;margin:30px -26px 4px}html[data-theme=paint] footer{color:#101010;margin-top:32px}html[data-theme=paint] .notification{color:#101010}html[data-theme=paint] .error{background:#fff;color:#101010}html[data-theme=paint] .success-icon{color:#101010}html[data-theme=paint] :focus-visible{outline-color:#000080}html[data-theme=paint] .primary:focus-visible{outline-offset:-8px;outline:2px dotted #101010}
@media(max-width:700px){.choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.choice{min-height:148px;padding:20px 12px 16px;gap:20px}.header{padding:24px 20px}.header img{width:175px}.window{margin-top:34px;padding:0 20px}h1{font-size:25px}.subtitle{font-size:14px}.contact-grid{display:block}.actions{gap:14px}.primary{padding:16px;font-size:15px}.descriptions{margin-bottom:22px}.option-description{font-size:14px}footer{margin-top:44px;padding:0 20px;flex-wrap:wrap}.secondary{padding:8px 10px;font-size:12px}html[data-theme=paint] .header{margin-top:10px;padding:18px 16px}html[data-theme=paint] .window{margin:26px 12px 0}html[data-theme=paint] .window-body{padding:26px 16px 0}html[data-theme=paint] .statusbar{margin:24px -12px 4px;gap:8px}html[data-theme=paint] h1{font-size:25px}.summary{min-height:250px}}
@media(max-width:360px){.header img{width:145px}.choice{font-size:14px}.actions{align-items:stretch;flex-wrap:wrap}.primary{min-width:180px}html[data-theme=paint] .window-body{padding:24px 12px 0}html[data-theme=paint] .statusbar{margin-left:-8px;margin-right:-8px;font-size:11px}.titlebar{font-size:13px!important}}
@media(prefers-reduced-motion:reduce){#fortschritt{transition:none}}
/* Weiße Formularfläche hebt sich wie die Inhaltsfenster der V5 vom Desktop ab. */
html[data-theme=paint] .window-body{background:#fff;padding-bottom:4px}
html[data-theme=paint] .statusbar{background:#c0c0c0}
/* Designwechsel ohne Neuladen oder Verlust der Formulareingaben. */
.header #logo-link{margin-right:auto}
.design-switch{display:flex;gap:3px;padding:3px;border:1px solid #58616a;border-radius:8px}
.design-switch button{min-height:38px;padding:7px 15px;border:0;border-radius:5px;background:transparent;color:#fff;font-size:14px}
.design-switch button[aria-pressed=true]{background:var(--color-accent);color:var(--color-on-accent)}
html[data-theme=paint] .design-switch{background:#c0c0c0;border:2px inset #eee;border-radius:0}
html[data-theme=paint] .design-switch button{color:#101010;border:2px outset #eee;border-radius:0;font-family:Arial,sans-serif}
html[data-theme=paint] .design-switch button[aria-pressed=true]{border-style:inset}
html[data-theme=paint] .header :focus-visible{outline-color:var(--color-accent)}
@media(max-width:700px){.header{display:grid;grid-template-columns:1fr auto;gap:14px}.header #logo-link{grid-column:1;grid-row:1}.header .design-switch{grid-column:1/-1;grid-row:2;justify-self:end}.design-switch button{min-height:40px;padding:7px 18px}}
/* Derselbe Retro-Header und dieselbe Wortmarke wie in Recruiting-Variante 5. */
.retro-brand{display:none}
html[data-theme=paint] .header{background:#c0c0c0;color:#101010;border:2px solid;border-color:#fff #777 #777 #fff;padding:12px 22px}
html[data-theme=paint] #logo-link{padding:3px;background:#c0c0c0;border:2px solid;border-color:#fff #555 #555 #fff;text-decoration:none;flex-shrink:0}
html[data-theme=paint] #logo-link>.brand-original{display:none}
html[data-theme=paint] .retro-brand{display:block;width:184px}
.retro-brand-label{display:flex;align-items:center;gap:5px;color:#101010;font:10px/1.2 Arial,sans-serif;padding:1px 3px 4px;white-space:nowrap}
.retro-brand-dot{width:7px;height:7px;background:#ffe833;border:1px solid #555}
.retro-brand-face{display:flex;align-items:center;gap:10px;padding:7px 10px;background:#101820;border:2px solid;border-color:#666 #fff #fff #666}
.retro-brand-symbol{display:block;width:34px;height:35px;overflow:hidden;flex-shrink:0}
html[data-theme=paint] .header .retro-brand-symbol img{width:168px;height:auto;max-width:none}
.retro-brand-name{font:400 15px/1.15 'Silkscreen',monospace;letter-spacing:-.5px;color:#fff}
html[data-theme=paint] .design-switch{background:#c0c0c0;border:0;padding:0;gap:4px}
html[data-theme=paint] .design-switch button{font:700 13px/1.2 Arial,sans-serif;color:#101010;background:#c0c0c0;min-height:40px;border:2px solid;border-color:#fff #555 #555 #fff;padding:8px 12px}
html[data-theme=paint] .design-switch button[aria-pressed=true]{background:#000080;color:#fff;border-color:#555 #fff #fff #555}
html[data-theme=paint] .header :focus-visible{outline:2px dashed #101010;outline-offset:3px}
@media(max-width:700px){html[data-theme=paint] .header{display:flex;gap:10px;padding:12px}html[data-theme=paint] #logo-link{padding:2px}html[data-theme=paint] .retro-brand{width:144px}.retro-brand-label{font-size:8px;padding-bottom:3px}.retro-brand-face{padding:5px 7px;gap:6px}.retro-brand-name{font-size:12px}.retro-brand-symbol{width:27px;height:28px}html[data-theme=paint] .header .retro-brand-symbol img{width:134px}.retro-brand-dot{width:6px;height:6px}html[data-theme=paint] .design-switch button{font-size:12px;padding:8px 10px}}
@media(max-width:360px){html[data-theme=paint] .retro-brand{width:130px}.retro-brand-face{padding:5px;gap:5px}.retro-brand-name{font-size:11px}html[data-theme=paint] .design-switch button{padding:8px}}