/* Demokratie und Haltung */
.reiter.text button { padding-left: .95rem; }
.panel { border-top: 4px solid var(--akzent); padding: 1.2rem 1.3rem 1.5rem; }
.panel h2 { font-size: clamp(1.4rem, 3vw, 1.8rem); margin: 1.4rem 0 .4rem; }
.panel > p, .tab > p, .tab > .leise { max-width: var(--lesebreite); }
.stand { margin: 0 0 1rem; padding: .8rem 1rem; border-left: 4px solid var(--gold); background: var(--gold-hell); border-radius: 6px; max-width: var(--lesebreite); font-size: .95rem; }
.kernsatz { margin: 0 0 1.2rem; padding: 1rem 1.2rem; border-radius: 12px; background: var(--akzent-hell); max-width: var(--lesebreite); }
.ks-text { margin: 0; font-family: var(--titel-schrift); font-size: clamp(1.25rem, 2.6vw, 1.55rem); line-height: 1.3; color: var(--akzent); }
.ks-zusatz { margin: .4rem 0 0; font-size: .95rem; }
.zwischen { font-size: 1.25rem; margin: 1.6rem 0 .5rem; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.marke { font-family: var(--schrift); font-size: .72rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; padding: .15rem .5rem; border-radius: var(--rund-pille); background: var(--ton2-hell); color: var(--tinte-leise); }
.normen { display: grid; gap: .8rem; margin: 1rem 0; max-width: var(--lesebreite); }
.norm { padding: 1rem 1.1rem; border-left: 4px solid var(--akzent); }
.norm h3 { margin: 0 0 .5rem; font-size: 1.15rem; }
.fund { display: block; font-family: var(--schrift); font-size: .8rem; font-weight: 600; color: var(--akzent); letter-spacing: .02em; margin-bottom: .1rem; }
.wortlaut { margin: .5rem 0; padding: .6rem .9rem; border-left: 3px solid var(--linie); background: color-mix(in srgb, var(--akzent-hell) 40%, var(--blatt)); border-radius: 0 8px 8px 0; font-style: italic; }
.wortlaut p { margin: .3rem 0; }
.wortlaut p::before { content: '„'; } .wortlaut p::after { content: '“'; }
.wortlaut cite { display: block; margin-top: .3rem; font-size: .82rem; font-style: normal; color: var(--tinte-leise); }
.wortlaut.gross { font-family: var(--titel-schrift); font-style: normal; font-size: 1.12rem; line-height: 1.4; border-left-color: var(--akzent); max-width: var(--lesebreite); }
.zitate { display: grid; gap: .6rem; margin: 1rem 0; }
.kurz { margin: .5rem 0 0; font-size: .95rem; }
.verweise { padding-left: 1.2rem; max-width: var(--lesebreite); }
.verweise li { margin: .4rem 0; }
.vergleiche { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--spalte); align-items: start; }
@media (max-width: 1000px) { .vergleiche { grid-template-columns: minmax(0, 1fr); max-width: var(--lesebreite); } }
.grundsaetze { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--spalte); margin: 1rem 0 .6rem; }
@media (max-width: 900px) { .grundsaetze { grid-template-columns: minmax(0, 1fr); max-width: var(--lesebreite); } }
.grundsatz { position: relative; padding: 1rem 1.1rem 1.1rem; border-top: 4px solid var(--akzent); }
.grundsatz .nr { display: inline-grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--akzent); color: var(--akzent-text); font-weight: 700; margin-bottom: .4rem; line-height: 1; }
.grundsatz h3 { margin: 0 0 .4rem; font-size: 1.2rem; }
.grundsatz p { margin: .4rem 0; font-size: .95rem; }
.grundsatz .fuer { padding: .5rem .7rem; border-radius: 8px; background: var(--akzent-hell); font-size: .92rem; }
.hinweis-box { margin: 1rem 0; padding: .9rem 1.1rem; border-radius: 10px; border: 1px solid var(--linie); background: var(--ton2-hell); max-width: var(--lesebreite); }
.hinweis-box h3 { margin: 0 0 .3rem; font-size: 1.15rem; }
.hinweis-box p { margin: .4rem 0; }
.liste { display: grid; gap: var(--eng); margin: 1rem 0; }
details.thema { border-left: 4px solid var(--akzent); }
details.thema > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .8rem; align-items: center; padding: .8rem 1rem; cursor: pointer; list-style: none; font-weight: 600; }
details.thema > summary::-webkit-details-marker { display: none; }
details.thema > summary::after { content: '›'; color: var(--akzent); font-size: 1.2rem; transition: transform .15s ease; }
details.thema[open] > summary::after { transform: rotate(90deg); }
details.thema[open] > summary { background: var(--akzent-hell); border-radius: 0 var(--rund) 0 0; }
.inhalt { padding: .8rem 1.1rem 1.1rem; max-width: none; }
.inhalt p { margin: .5rem 0; }
.quelle-zeile { font-size: .9rem; color: var(--tinte-leise); max-width: var(--lesebreite); }
.fragen-zeile { padding: .5rem .8rem; border-radius: 8px; background: color-mix(in srgb, var(--akzent-hell) 60%, var(--blatt)); font-size: .93rem; }
.kc { font-size: .9rem; color: var(--tinte-leise); }
ol.check { padding-left: 1.3rem; }
ol.check li { margin: .4rem 0; }
ol.merkmale { padding-left: 1.4rem; max-width: var(--lesebreite); }
ol.merkmale li { margin: .35rem 0; font-weight: 600; }
ol.merkmale small { font-weight: 400; color: var(--tinte-leise); }
.quellen { padding-left: 1.2rem; font-size: .92rem; max-width: var(--lesebreite); }
.quellen li { margin: .35rem 0; }

/* Erste Schritte kompakt in zwei Spalten */
ol.check { columns: 2; column-gap: calc(var(--spalte) + 1.3rem); max-width: none; }
ol.check li { break-inside: avoid; margin-top: 0; }
@media (max-width: 720px) { ol.check { columns: 1; } }

/* Breite nutzen: Normen zweispaltig, Zitate dreispaltig, Merkmale zweispaltig */
.normen { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--spalte); max-width: none; align-items: start; }
.zitate { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--spalte); align-items: start; }
.zitate .wortlaut.gross { max-width: none; margin: 0; height: 100%; box-sizing: border-box; }
ol.merkmale { columns: 2; column-gap: calc(var(--spalte) + 1.4rem); max-width: none; }
ol.merkmale li { break-inside: avoid; margin-top: 0; }
@media (max-width: 900px) { .normen, .zitate { grid-template-columns: minmax(0, 1fr); } ol.merkmale { columns: 1; } }
