/* Förderschmiede v2, Ratgeber: Artikelseiten, Übersicht /ratgeber und /fragen (Knoten r-rahmen, 01.10.2026).
   Erzeugt werden die Seiten von V2/werkzeug/ratgeber.py. Nur Variablen aus tokens.css, Grundstil aus seite.css. */

/* Kopfsektion: dunkel unter der Navigation, unten die 37,5-Grad-Kante wie auf den Rechtsseiten */
.rg-kopf{padding-top:calc(var(--nav-hoehe) + var(--sat) + clamp(40px,5vw,96px));padding-bottom:calc(clamp(40px,4vw,72px) + var(--ecke))}
.rg-titel{max-width:26ch;font-family:var(--f-marke);font-weight:400;font-size:clamp(2rem,1.3rem + 3vw,4rem);line-height:1.05;
  letter-spacing:-.003em;color:#fff;text-wrap:balance;hyphens:manual;overflow-wrap:break-word}
.rg-stand,.rg-einleitung{margin-top:var(--luft-3);color:var(--silver)}
.rg-einleitung{max-width:62ch;font-size:var(--t-lead);line-height:1.55;color:rgba(255,255,255,.9)}

/* Brotkrumen */
.rg-pfad{margin-bottom:var(--luft-3);font-size:var(--t-klein)}
.rg-pfad ol{display:flex;flex-wrap:wrap;align-items:center;list-style:none;padding:0;color:var(--silver)}
.rg-pfad li{display:flex;align-items:center;min-width:0}
.rg-pfad li + li::before{content:"/";margin-inline:10px;color:var(--signal-hell)}
.rg-pfad a{display:inline-flex;align-items:center;min-height:44px;color:var(--signal-hell);text-decoration:underline;text-underline-offset:3px}
.rg-pfad [aria-current]{overflow-wrap:anywhere}
@media(hover:hover){.rg-pfad a:hover{color:#fff}}

/* Hauptteil: ruhige Lesespalte von höchstens etwa 70 Zeichen; in em statt ch, weil die Ziffer 0 der Montserrat
   breiter ist als ein mittleres Zeichen (68ch wären bei 1440 px rund 85 Zeichen gewesen, gemessen mit ratgeber/pruef/browser.py) */
.rg-haupt{background:var(--weiss);padding-top:clamp(40px,5vw,88px);padding-bottom:calc(var(--sektion) + var(--ecke) * .5)}
.rg-text{max-width:35em;color:var(--grau)}
.rg-text > * + *{margin-top:1em}
.rg-text h2,.rg-quellen h2,.rg-verwandt h2{margin-top:2em;font-family:var(--f-marke);font-weight:400;
  font-size:clamp(1.375rem,1.15rem + 1vw,2rem);line-height:1.15;color:var(--deep);text-wrap:balance;overflow-wrap:break-word}
.rg-text h2:first-child{margin-top:0}
.rg-text h2 + *{margin-top:.6em}
.rg-text [id]{scroll-margin-top:calc(var(--nav-kompakt) + var(--sat) + 24px)}
.rg-text ul{padding-left:1.25em;list-style:disc}
.rg-text ol{padding-left:1.4em;list-style:decimal}
.rg-text li + li{margin-top:.4em}
.rg-text a,.rg-quellen a,.rg-weiter a{color:var(--signal-dunkel);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
@media(hover:hover){.rg-text a:hover,.rg-quellen a:hover,.rg-weiter a:hover{text-decoration-thickness:2px}}

/* Tabelle: bleibt in der Spalte; ist sie breiter, scrollt nur sie, nie die Seite */
.rg-tabelle{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.rg-tabelle table{width:100%;border-collapse:collapse;font-size:var(--t-klein);line-height:1.45}
.rg-tabelle th,.rg-tabelle td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--linie-hell);hyphens:auto}
.rg-tabelle th{background:var(--signal-10);color:var(--deep);font-weight:600}
@media(max-width:479px){.rg-tabelle th,.rg-tabelle td{padding:8px 6px}}

/* Quellen und verwandte Seiten */
.rg-quellen,.rg-verwandt{max-width:35em}
.rg-quellen ul{margin-top:.8em;padding-left:1.25em;list-style:disc}
.rg-quellen li + li{margin-top:.5em}
.rg-verwandt{max-width:none}
.rg-karten{display:grid;gap:var(--luft-3);margin-top:var(--luft-3);padding:0;list-style:none}
@media(min-width:720px){.rg-karten{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}
.rg-karten-gross{margin-top:0}
.rg-karte{display:flex;flex-direction:column;gap:10px;height:100%;padding:24px 24px 26px;background:var(--hell);
  border-left:3px solid var(--signal);color:var(--grau);text-decoration:none;transition:background-color .2s ease}
.rg-karte-titel{font-family:var(--f-marke);font-size:clamp(1.1875rem,1.05rem + .5vw,1.4375rem);line-height:1.2;color:var(--deep);overflow-wrap:break-word}
.rg-karte-text{color:var(--grau-leise)}
@media(hover:hover){.rg-karte:hover{background:var(--signal-10)}.rg-karte:hover .rg-karte-titel{text-decoration:underline;text-underline-offset:4px}}

/* Fragen-Seite */
.rg-frage + .rg-frage{margin-top:var(--luft-5)}
.rg-frage > * + *{margin-top:.8em}
.rg-karte-kopf{font-weight:600;color:var(--deep)}

/* Schluss mit zwei Knöpfen */
.rg-weiter{max-width:35em;margin-top:var(--luft-5)}
.rg-schluss{max-width:35em;margin-top:var(--luft-6);padding-top:var(--luft-4);border-top:1px solid var(--linie-hell)}
.rg-schluss .knoepfe{margin-top:var(--luft-3)}
.knopf-rand-hell{color:var(--deep)}
.knopf-rand-hell::before{background:transparent;box-shadow:inset 0 0 0 2px var(--signal);clip-path:none}
@media(hover:hover){.knopf-rand-hell:hover::before{background:var(--signal-10)}}
@media(max-width:599px){.rg-schluss .knopf{width:100%}}

/* Der Footer schließt an die weiße Fläche an */
.unterseite .fuss{--vor:var(--weiss)}
