/* ── Produktfinder, Welle 2 (12.10.2026) – Claus' Seitenabnahme 05.10.2026, Teilplan 05 Teil A ──
   Wird nach temana.css geladen und überschreibt dort nur die genannten Stellen. */

/* A6 – Antwortfelder (SA S.1 §2, S.2 §4/§5): längere Bezeichnungen zweizeilig, alle Felder einer Frage
   gleich hoch; ab 600 px fest zwei Spalten (Frage 3 und 4 = 3 × 2), darunter eine Spalte.
   Zwei Zeilen à 16,5 px × 1,35 + 2 × 12 px Polster + Rand ≈ 72 px. Ungerade Anzahl (Frage 5: 7,
   Alter: 5) lässt rechts unten ein Feld frei – so auch in Claus' Abbildungen. */
.temana-finder__form--schritte .temana-finder__optionen{grid-template-columns:minmax(0,1fr); grid-auto-rows:1fr}
@media(min-width:600px){
	.temana-finder__form--schritte .temana-finder__optionen{grid-template-columns:repeat(2,minmax(0,1fr))}
	.temana-finder__form--schritte .temana-finder__option{min-height:72px}
}

/* A19 – Knopf „Zurück“ (SA S.6 §14): normal weißer Grund, grüne Schrift und grüner Pfeil; Hover grüner
   Grund, weiße Schrift und weißer Pfeil (der Pfeil ist ::before und erbt die Farbe). Bisher setzte
   Kadences `button:hover` den grünen Grund, unsere Regel ließ die Schrift grün (temana.css:838-840).
   Dünner grüner Rand, sonst verschwindet der weiße Knopf auf der weißen Formularfläche.
   Tastatur: wie Hover plus 3-px-Ring. Kontrast Grün #2B723D zu Weiß 5,9 : 1 (AA). */
.temana-finder__nav .temana-finder__zurueck{
	display:inline-flex; align-items:center; gap:.35em; min-height:52px; padding:0 20px; /* gap: im Flex fiele das Leerzeichen nach „←“ weg */
	border:1.5px solid var(--gruen); border-radius:8px; background:#fff; color:var(--gruen); box-shadow:none;
}
.temana-finder__nav .temana-finder__zurueck:hover,
.temana-finder__nav .temana-finder__zurueck:focus-visible{background:var(--gruen); border-color:var(--gruen); color:#fff}
.temana-finder__nav .temana-finder__zurueck:focus-visible{outline:3px solid var(--gruen); outline-offset:2px}
/* Mobil brach „Zurück“ mitten im Wort um (390 px: „Zurüc|k“, auch in Claus' Vorschau): der Knopf schrumpfte im Flex
   unter seine Wortbreite. Er behält jetzt seine Breite; umbrechen darf nur „Ergebnis zeigen“ – am Leerzeichen. */
.temana-finder__nav .temana-finder__zurueck{flex-shrink:0; white-space:nowrap}
@media (max-width:480px){
	.temana-finder__nav .temana-finder__zurueck{padding:0 14px}
	.temana-finder__nav .temana-finder__weiter, .temana-finder__nav button[type="submit"]{padding:0 20px}
}

/* A4 – Knopf im Beratungsblock mittig (SA S.5 §11). temana.css:520 zentriert schon, live stand er links;
   die Ursache ist nur am Testshop messbar. Abgefangen: eine höher gewichtete Ausrichtungsregel
   (Kern-Layout oder Kadence) und ein Container, der schmaler ist als die Fläche. */
.entry-content .temana-abschluss .wp-block-buttons{justify-content:center; width:100%; margin-inline:auto}

/* A12 – Sicherheitsblock in Frage 6 (SA S.3 §7, Nachtrag 12.10. Claus 1:1): unter der Altersgruppe, eigene
   kleinere Überschrift, Felder einspaltig über die volle Breite wie in Claus' Abbildung (auch ab 600 px). */
.temana-finder__zusatz{border:0; padding:0; margin:28px 0 0; min-width:0}
.temana-finder__form--schritte .temana-finder__frage .temana-finder__zusatz legend{margin:0 0 14px; font-size:clamp(18px,2vw,21px)}
.temana-finder__form--schritte .temana-finder__zusatz .temana-finder__optionen{grid-template-columns:minmax(0,1fr); grid-auto-rows:auto}
.temana-finder__form--schritte .temana-finder__zusatz .temana-finder__option{min-height:58px}

/* ── Runde 3 (19.10.2026) – Umsetzungsauftrag Produktfinder ── */

/* Hinweis direkt am Feld (A01/A02): Alter und Sicherheitsblock sind Pflicht. */
.temana-finder__feldfehler{margin:12px 0 0; color:#8A1C1C; font-weight:600; font-size:15px}

/* Sicherheitsbildschirm (Auftrag §01 B): ruhig, ohne Warnfarbe, mit zwei Aktionen. */
.temana-finder__sicherheit{background:var(--weiss); border:1px solid var(--linie); border-left:4px solid var(--gruen);
	border-radius:var(--radius); padding:clamp(20px,3vw,32px)}
.temana-finder__sicherheit[hidden]{display:none}
.temana-finder__sicherheit:focus{outline:none}
.temana-finder__sicherheit h2{margin-top:0}
.temana-finder__sicherheit-aktionen{display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; margin-top:20px}
.temana-finder__sicherheit-aktionen .temana-finder__neu{padding:8px 0}

/* Ergebniskarte: fünf Elemente (Kennzeichnung, Warum, Produkt, Das Wichtigste, Sicherheitsangaben). */
.temana-finder__karte h4{margin:0 0 4px; font-size:13px; font-weight:600; letter-spacing:.02em; color:var(--gruen)}
.temana-finder__warum{margin:2px 0 6px}
.temana-finder__warum[hidden]{display:none}
.temana-finder__warum .temana-finder__grund{margin:0; font-size:14.5px; line-height:1.5; color:var(--temana-text)}
.temana-finder__wichtig,
.temana-finder__sicherheitsangaben{margin-top:6px}
.temana-finder__wichtig ul,
.temana-finder__sicherheitsangaben ul{margin:0; padding-left:18px; font-size:14px; line-height:1.45; color:var(--text-sek)}
.temana-finder__wichtig li + li,
.temana-finder__sicherheitsangaben li + li{margin-top:3px}
.temana-finder__sicherheitsangaben{border-left:3px solid var(--akzent); padding-left:10px}
.temana-finder__sicherheitsangaben h4{color:var(--temana-text)}
.temana-finder__vergleich{margin:6px 0 0; font-size:14px; line-height:1.45; color:var(--text-sek)}
.temana-finder__vergleich[hidden]{display:none}
.temana-finder__nem-hinweis{margin:0 0 12px; padding:10px 14px; border-left:3px solid var(--akzent); background:var(--temana-warmweiss); font-size:15px}
.temana-finder__nem-hinweis[hidden]{display:none}

/* Abschlusshinweis (Auftrag §02): normale Schrift, ca. 15–16 px, Zeilenhöhe 1,5, 28–32 px über, 24 px unter dem Satz. */
.temana-finder__abschluss{font-size:15.5px; font-weight:400; line-height:1.5; margin:30px 0 24px}
