/* Oeffentliches Anmeldeformular – t+m Design, Aufbau angelehnt an Google Forms (eine Karte je Frage) */
/* Farben kommen aus dem Design des Formulars (style-Attribut am body); das hier ist der t+m-Standard */
:root { --navy: #0F3750; --dark: #164A6A; --blue: #32AFDC; --green: #78B950; --link: #0070C0; --box: #F2F2F2; --line: #d9dde1; --err: #c0392b; }
* { box-sizing: border-box; }
body.gf { margin: 0; background: #fff; color: #000; font: 16px/1.5 Arial, Helvetica, sans-serif; }
a { color: var(--link); }
[hidden] { display: none !important; }
.gf-top { max-width: 720px; margin: 0 auto; padding: 18px 16px 14px; }
.gf-top img { height: 44px; max-width: 100%; width: auto; display: block; object-fit: contain; }
.gf-brand { display: inline-block; font-weight: bold; font-size: 1.2rem; color: var(--navy); padding: 8px 0; }
.gf-banner, .gf-funding { margin: 0 0 12px; background: #fff; border-radius: 4px; overflow: hidden; }
.gf-banner img, .gf-funding img { display: block; width: 100%; height: auto; }
.gf-btn:hover { background: var(--dark); }
.gf-accent { height: 4px; background: linear-gradient(90deg, var(--blue), var(--green)); }
.gf-wrap { max-width: 720px; margin: 0 auto; padding: 20px 16px 40px; }
.gf-card { background: var(--box); border-radius: 4px; padding: 20px 22px; margin: 0 0 12px; border-left: 4px solid transparent; }
.gf-head { border-top: 6px solid var(--navy); border-left: 0; }
.gf-head h1 { color: var(--navy); font-size: 1.8rem; margin: 0 0 6px; line-height: 1.2; }
.gf-event { margin: 0 0 8px; color: #333; font-weight: bold; }
.gf-rt p { margin: .4em 0; }
.gf-reqnote { color: var(--err); font-size: .85rem; margin: 12px 0 0; }
.gf-preview { background: #fde9cf; padding: 10px 14px; border-left: 4px solid #F59B23; margin: 0 0 12px; }
.gf-alert { background: #f8dcd8; color: var(--err); padding: 10px 14px; margin: 0 0 12px; border-radius: 4px; }
.gf-label { display: block; font-weight: bold; margin: 0 0 8px; color: var(--navy); }
.gf-star { color: var(--err); }
.gf-help { font-size: .9rem; color: #444; margin: -4px 0 10px; }
.gf-input, .gf-select { width: 100%; font: inherit; padding: 9px 10px; border: 1px solid #b9c0c6; border-radius: 3px; background: #fff; }
.gf-input:focus, .gf-select:focus { outline: 2px solid var(--blue); outline-offset: -1px; }
.gf-area { resize: vertical; min-height: 70px; }
.gf-date { max-width: 220px; }
.gf-choices { display: flex; flex-direction: column; gap: 8px; }
.gf-choice strong { color: var(--navy); font-weight: bold; }
.gf-choice { display: flex; align-items: center; gap: 10px; cursor: pointer; position: relative; }
.gf-choice input[type=radio], .gf-choice input[type=checkbox] { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.gf-dot, .gf-box { flex: 0 0 20px; width: 20px; height: 20px; border: 2px solid #6b7680; background: #fff; }
.gf-dot { border-radius: 50%; }
.gf-box { border-radius: 3px; }
.gf-choice input:checked + .gf-dot { border-color: var(--navy); box-shadow: inset 0 0 0 4px #fff; background: var(--navy); }
.gf-choice input:checked + .gf-box { border-color: var(--navy); background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3 3 7-7' stroke='white' stroke-width='2.2' fill='none'/%3E%3C/svg%3E") center/14px no-repeat; }
.gf-choice input:focus-visible + span { outline: 2px solid var(--blue); outline-offset: 2px; }
.gf-other .gf-other-text { flex: 1; padding: 5px 8px; }
.gf-all { margin-top: 10px; background: none; border: 0; padding: 0; color: var(--link); text-decoration: underline; font: inherit; font-size: .9rem; cursor: pointer; }
.gf-err { color: var(--err); font-size: .88rem; margin: 8px 0 0; min-height: 0; }
.gf-err:empty { display: none; }
.gf-q.has-error { border-left-color: var(--err); background: #fbeeec; }
.gf-section { border-left: 0; background: #fff; border: 1px solid var(--line); }
.gf-section-bar { font-size: .8rem; color: #555; margin: 0 0 6px; }
.gf-section h2 { color: var(--navy); margin: 0 0 6px; font-size: 1.3rem; }
.gf-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 16px; }
.gf-buttons { display: flex; gap: 10px; }
.gf-btn { background: var(--navy); color: #fff; border: 1px solid var(--navy); padding: 10px 22px; font: inherit; border-radius: 3px; cursor: pointer; }
.gf-btn.light { background: #fff; color: var(--navy); }
.gf-btn[disabled] { opacity: .5; cursor: default; }
.gf-progress { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 180px; }
.gf-bar { flex: 1; height: 8px; background: var(--box); border-radius: 4px; overflow: hidden; }
.gf-bar span { display: block; height: 100%; background: var(--blue); width: 0; }
.gf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.gf-foot { margin-top: 30px; font-size: .8rem; color: #666; }
/* Mit JavaScript: nur die aktuelle Seite zeigen */
body.gf-js .gf-step { display: none; }
body.gf-js .gf-step.on { display: block; }