/* Startseite, Teil 2: Drei-Fragen-Einstieg als Stepper, Wege-Kacheln, Werkzeuge, Länder, Zehn Fragen, Beratende.
   Aus start.css herausgelöst (Zeilenobergrenze); SVG-Kacheln aus _bausteine.FORMEN laufen über --wf/--wf-soft. */
.einstieg{padding:56px 0 64px;border-top:1px solid var(--kies);margin:0;max-width:none;background:none;border-radius:0;box-shadow:none}
.einstieg h2{text-align:left;margin:0 0 32px}
.fragen{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.frage{display:block;border:0;margin:0;padding:22px 24px;background:var(--karte);border-radius:var(--eck-klein);box-shadow:var(--schatten);opacity:.45;transition:opacity .25s;min-width:0}
.frage.offen{opacity:1;animation:none;margin:0}
.frage:not(.offen) .antworten{display:none}
.frage legend{float:left;width:100%;font-family:var(--serif);font-weight:500;font-size:20px;margin:0 0 14px;display:flex;align-items:center;gap:10px}
.frage .nr{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--ai);color:var(--auf-ai);font-family:var(--sans);font-size:13px;align-items:center;justify-content:center;flex:none}
.antworten{display:flex;flex-wrap:wrap;gap:8px;clear:both}
.antworten label{position:relative;cursor:pointer}
.antworten input{position:absolute;opacity:0;width:1px;height:1px}
.antworten span{display:inline-block;padding:7px 15px;border-radius:999px;border:1px solid var(--kies);background:var(--sand);font-family:var(--sans);font-size:13px;color:var(--stein);transition:border-color .15s,background .15s,color .15s}
.antworten label:hover span{border-color:var(--ai);color:var(--ai)}
.antworten input:checked+span{border-color:var(--ai);background:var(--ai);color:var(--auf-ai)}
.antworten input:focus-visible+span{outline:3px solid var(--matcha);outline-offset:2px}
.ergebnis{grid-column:1/-1;margin:8px 0 0;padding:28px 30px;border-radius:var(--eck);background:var(--ai);color:var(--auf-ai);animation:auftauchen .4s both}
.ergebnis h3{margin:0 0 10px;font-size:24px;color:var(--auf-ai)}
.ergebnis .hinweis{margin:0 0 12px;font-size:14px;color:var(--auf-ai-weich)}
.ergebnis ol{margin:0;padding-left:22px}.ergebnis li{margin:6px 0;font-size:16px}
.ergebnis a{color:var(--auf-ai);text-decoration:underline;text-decoration-color:rgba(255,255,255,.4)}
.ergebnis .weiter{margin:18px 0 0;font-size:14px;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.ergebnis .knopf{background:var(--auf-ai);color:var(--ai) !important;text-decoration:none}.ergebnis .knopf:hover{background:var(--sand)}
.zuruecksetzen{grid-column:1/-1;margin:4px 0 0;text-align:right}
.zuruecksetzen button{background:none;border:0;padding:0;color:var(--stein2);font-family:var(--sans);font-size:13px;cursor:pointer;text-decoration:underline}
@keyframes auftauchen{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Nachlesen: Zehn Fragen, Wege-Kacheln, Werkzeuge, Länder */
.zehn-fragen{display:flex;align-items:center;gap:20px;margin:0 0 24px;padding:22px 26px;border-radius:var(--eck-klein);background:var(--sand2);text-decoration:none;color:var(--tinte);transition:background .2s}
.zehn-fragen:hover,.zehn-fragen:focus-visible{background:var(--karte);box-shadow:var(--schatten)}
.zehn-fragen .zahl{flex:none;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:26px;color:var(--auf-ai);background:var(--ai)}
.zehn-fragen .text{display:flex;flex-direction:column;gap:4px}
.zehn-fragen strong{font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.3}
.zehn-fragen .text span{color:var(--stein);font-size:14px;line-height:1.45}
.wege{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:0}
.weg{--wf:var(--w1);--wf-soft:var(--w1-soft);display:flex;align-items:center;gap:16px;text-align:left;text-decoration:none;color:var(--tinte);padding:18px 20px;border-radius:var(--eck-klein);background:var(--karte);box-shadow:var(--schatten);transition:background .2s,transform .2s}
.weg.w2{--wf:var(--w2);--wf-soft:var(--w2-soft)}.weg.w3{--wf:var(--w3);--wf-soft:var(--w3-soft)}
.weg.gross{flex-direction:column;align-items:flex-start;padding:26px 24px 28px}
.weg:hover,.weg:focus-visible{transform:translateY(-3px);background:var(--wf-soft)}
.weg:focus-visible{outline:3px solid var(--wf);outline-offset:3px}
.weg .form{height:56px;width:56px;flex:none;display:flex}.weg.gross .form{height:96px;width:auto;margin-bottom:12px}
.weg .form svg{height:100%;width:auto;overflow:visible}
.weg .flaeche{fill:var(--karte);stroke:var(--wf);stroke-opacity:.7;stroke-width:2;vector-effect:non-scaling-stroke}
.weg:hover .flaeche{fill:var(--wf);stroke-opacity:1}
.weg .segmente,.weg .striche{fill:none;stroke:var(--wf);stroke-width:2.4;stroke-linecap:round;vector-effect:non-scaling-stroke}
.weg .nadel{fill:var(--wf);stroke:var(--wf);stroke-width:1.2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.weg .nadel-sued{fill:var(--karte);stroke:var(--wf);stroke-width:1.6;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.weg:hover .segmente,.weg:hover .striche{stroke:var(--karte)}.weg:hover .nadel{fill:var(--karte);stroke:var(--karte)}.weg:hover .nadel-sued{fill:var(--wf);stroke:var(--karte)}
.weg h2{font-size:20px;line-height:1.3;margin:0 0 6px;color:var(--tinte)}
.weg p{margin:0;font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--stein)}
.werkzeuge{margin:40px 0 0}
.werkzeuge h2{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--stein2);font-family:var(--sans);font-weight:400;margin:0 0 14px}
.werkzeuge .reihe{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 32px;background:repeating-linear-gradient(to bottom,transparent 0 23px,var(--kies) 23px 24px);padding:12px 0}
.werkzeuge a{display:flex;flex-direction:column;gap:4px;padding:12px 0;background:var(--sand);text-decoration:none;color:var(--tinte);font-family:var(--sans)}
.werkzeuge a strong{font-family:var(--serif);font-weight:500;font-size:19px}.werkzeuge a span{font-size:13px;color:var(--stein);line-height:1.45}
.werkzeuge a:hover strong{color:var(--ai)}
.laender{margin:36px 0 0;border-top:1px solid var(--kies);padding:0}
.laender summary{cursor:pointer;padding:20px 0;list-style:none;display:flex;flex-direction:column;gap:4px}
.laender summary::-webkit-details-marker{display:none}
.laender summary .t{font-family:var(--serif);font-weight:500;font-size:22px;color:var(--tinte)}
.laender summary .t::after{content:" ▾";color:var(--stein2)}.laender[open] summary .t::after{content:" ▴"}
.laender summary .u{font-size:14px;color:var(--stein)}
.laender .wege{margin:6px 0 24px}
.laender .weg h2{font-size:17px}.laender .weg .form{height:44px;width:44px}
.fuer-beratende{margin:28px 0 0;font-family:var(--sans);font-size:13px;color:var(--stein2)}
.fuer-beratende a{color:var(--stein);border-bottom:1px solid var(--kies)}
.nachlesen .schmal{margin:28px 0 0;max-width:none}
@media (max-width:860px){.fragen{grid-template-columns:1fr}.frage:not(.offen){padding:14px 24px}.einstieg{padding:40px 0 48px}}
@media (prefers-reduced-motion:reduce){.ergebnis,.weg,.frage{animation:none;transition:none}}
html{overflow-x:clip}

/* Aufhänger oben (_starthook.py, 05.11.2026): Neu-Band, drei Haupt-Wege im Hero, Workshop-Abstimmung, Community */
.hk-neu{max-width:var(--breite);margin:20px auto 0;padding:16px 22px;background:var(--karte);border-radius:var(--eck-klein);box-shadow:var(--schatten);border-left:3px solid var(--matcha)}
.hk-neu-titel{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;margin:0 0 8px;font-size:14px}
.hk-neu-titel strong{font-family:var(--serif);font-size:18px;font-weight:500}.hk-neu-titel span{font-size:12px;color:var(--stein2)}
.hk-neu ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:6px 24px}
.hk-neu li{margin:0;font-size:14px;line-height:1.45}.hk-neu a{color:var(--tinte) !important}.hk-neu a:hover{color:var(--ai) !important}
.hk-datum{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ai)}
.hk-top10{padding:40px 0}.hk-top10 .zehn-fragen{margin:0}
.hk-form{display:grid;gap:18px;max-width:760px}.hk-form fieldset{border:0;margin:0;padding:0}
.hk-form legend{font-family:var(--serif);font-size:20px;margin:0 0 12px}
.hk-zeile{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.hk-zeile label{display:grid;gap:4px;font-size:13px;color:var(--stein);flex:1 1 220px}
.hk-zeile input{padding:11px 14px;border:1px solid var(--kies);border-radius:12px;background:var(--karte);color:var(--tinte);font:inherit}
.hk-form .hinweis,.hk-status{font-size:13px;color:var(--stein2);margin:0}
.hk-community{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;justify-content:space-between}.hk-community p{color:var(--stein);max-width:60ch}
html[dir="rtl"] .hk-neu{border-left:0;border-right:3px solid var(--matcha)}
@media (max-width:640px){.hk-neu{margin-top:14px}.hk-zeile .knopf{width:100%}}
/* Selbstinformation zuerst (05.11. abends): Themensuche im Hero, Workshop-Formular eingeklappt */
.hk-suche{display:grid;gap:6px;margin:26px 0 0;position:relative}.hk-suche[hidden]{display:none}
.hk-suche label{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ai);font-weight:500}
.hk-suche input{padding:14px 18px;border:1px solid var(--kies);border-radius:14px;background:var(--karte);color:var(--tinte);font:inherit;font-size:17px;box-shadow:var(--schatten);width:100%;box-sizing:border-box}
.hk-suche input:focus{outline:3px solid var(--matcha);outline-offset:2px}
.hk-treffer{display:grid;gap:6px}.hk-treffer:empty{display:none}
.hk-treffer a{display:block;padding:10px 16px;background:var(--karte);border-radius:var(--eck-klein);color:var(--tinte) !important;text-decoration:none;border-left:3px solid var(--ai)}
.hk-treffer a:hover{background:var(--sand2)}.hk-treffer .k{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--stein2)}
.hk-treffer strong{font-weight:500;font-size:15px}.hk-treffer .leer{margin:0;font-size:14px;color:var(--stein)}
html[dir="rtl"] .hk-treffer a{border-left:0;border-right:3px solid var(--ai)}
.hk-ws-auf>summary{list-style:none;display:inline-block;cursor:pointer}.hk-ws-auf>summary::-webkit-details-marker{display:none}
.hk-ws-auf[open]>summary{display:none}.nachlesen .zehn-fragen{margin:0 0 24px}
/* Lebenslagen (06.11.): Karten mit Themenlinks; Suche: alle Themen zur Auswahl; Frage als Rückfall */
.hk-alle{justify-self:start;margin-top:4px;padding:8px 16px;border:1px solid var(--ai);border-radius:999px;background:transparent;color:var(--ai);font:inherit;font-size:14px;cursor:pointer}
.hk-alle:hover,.hk-alle[aria-expanded="true"]{background:var(--gelb-blass)}.hk-treffer details{background:var(--karte);border-radius:var(--eck-klein)}
.hk-treffer summary{padding:10px 16px;cursor:pointer;font-weight:500}.hk-treffer details a{border-left:0;padding:6px 16px 6px 28px}
.hero-frage{margin:14px 0 0;font-size:14px;color:var(--stein)}.hero-frage a{color:var(--ai) !important}
.ll-gitter{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.ll-karte{background:var(--karte);border-radius:var(--eck-klein);padding:20px 22px;box-shadow:var(--schatten);margin:0}
.ll-karte h3{font-size:20px;margin:0}.ll-karte p{margin:4px 0 10px;font-size:13px;color:var(--stein2)}
.ll-karte ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.ll-karte li{margin:0;font-size:14px;line-height:1.4}
.ll-karte a{color:var(--tinte) !important}.ll-karte a:hover{color:var(--ai) !important}
.ll-frage{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;margin:28px 0 0}.ll-frage p{margin:0;color:var(--stein)}