/* Ratgeber-Artikel: Inhalte aus dem Editor in der Typografie der Abschnitte (Ratgeber.dc.html, sections),
 * Hülle der E-Bikes des Reichweitenrechners (nimmt am Raster teil, lässt sich ausblenden). */

.eb-rr-rad { display: contents; }

.eb-artikel-prosa { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.eb-artikel-prosa > * { margin: 0; }
.eb-artikel-prosa p { font-size: 18px; line-height: 1.7; color: #2b2b29; max-width: 68ch; text-wrap: pretty; }
.eb-artikel-prosa a { color: #141414; text-decoration: underline; text-underline-offset: 3px; }
.eb-artikel-prosa a:hover { color: #0a7a08; }
.eb-artikel-prosa strong, .eb-artikel-prosa b { font-weight: 800; }
.eb-artikel-prosa h3, .eb-artikel-prosa h4 { font-size: 22px; line-height: 1.1; font-weight: 900; font-style: italic; text-transform: uppercase; }
.eb-artikel-prosa ul, .eb-artikel-prosa ol { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.eb-artikel-prosa li { position: relative; padding: 12px 16px 12px 48px; border-radius: 8px; background: #f2f2f0; font-size: 16px; line-height: 1.5; }
.eb-artikel-prosa ul > li::before {
	content: ''; position: absolute; left: 16px; top: 14px; width: 20px; height: 20px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a7a08' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") no-repeat center / 20px 20px;
}
.eb-artikel-prosa ol { counter-reset: eb-liste; }
.eb-artikel-prosa ol > li { counter-increment: eb-liste; }
.eb-artikel-prosa ol > li::before { content: counter(eb-liste); position: absolute; left: 16px; top: 12px; width: 20px; text-align: center; font-weight: 900; font-style: italic; color: #0a7a08; }
.eb-artikel-prosa li ul, .eb-artikel-prosa li ol { margin-top: 8px; }
.eb-artikel-prosa figure { margin: 0; }
.eb-artikel-prosa img { max-width: 100%; height: auto; border-radius: 10px; }
.eb-artikel-prosa figcaption { margin-top: 8px; font-size: 13px; line-height: 1.5; color: #5a5a57; }
.eb-artikel-prosa blockquote { padding: 16px 20px; border-left: 4px solid #0ee90b; border-radius: 0 8px 8px 0; background: #f5f5f3; }
.eb-artikel-prosa blockquote p { font-weight: 600; }
.eb-artikel-prosa .wp-block-table, .eb-artikel-prosa .eb-tabelle { margin: 0; max-width: 100%; overflow-x: auto; border: 1px solid #e2e2df; border-radius: 10px; -webkit-overflow-scrolling: touch; }
.eb-artikel-prosa table { width: 100%; min-width: 440px; border-collapse: collapse; }
.eb-artikel-prosa table thead, .eb-artikel-prosa table tfoot, .eb-artikel-prosa table th, .eb-artikel-prosa table td { border: 0; }
.eb-artikel-prosa table th { padding: 12px 16px; background: #141414; color: #fff; font-size: 12px; font-weight: 800; font-style: italic; text-transform: uppercase; text-align: left; }
.eb-artikel-prosa table td { padding: 14px 16px; border-top: 1px solid #e2e2df; font-size: 15px; vertical-align: top; }
.eb-artikel-prosa table td:first-child { font-weight: 800; }
.eb-artikel-prosa hr { width: 100%; border: 0; border-top: 1px solid #e2e2df; }

/* Handy (unter 640 px): Vergleichstabellen als Karten (Kopf der Spalte über jedem Wert), Link-Knöpfe dürfen umbrechen. */
@media (max-width: 639.98px) {
	.eb-tab { overflow: visible; border: 0; border-radius: 0; }
	.eb-tab > div { min-width: 0; gap: 10px; }
	.eb-tab [role="row"]:first-child { display: none; }
	.eb-tab [role="row"] { flex-direction: column; gap: 8px; padding: 14px 16px; border: 1px solid var(--eb-line); border-radius: 10px; }
	.eb-tab [role="row"] > span { flex: none; padding: 0; }
	.eb-tab [role="rowheader"] { font-size: 18px; font-style: italic; text-transform: uppercase; }
	.eb-tab [role="cell"]::before { content: attr(data-kopf); display: block; margin-bottom: 1px; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--eb-muted); }
	.eb-artikel-link { height: auto; min-height: 44px; padding-top: 10px; padding-bottom: 10px; }
	.eb-m-karten > .eb-rr-rad > * { flex: 0 0 82%; scroll-snap-align: start; }
}

/* GEO (Briefing Runde 2, 13.1): Inhaltsverzeichnis auf dem Handy (die Seitenspalte ist dort ausgeblendet), Redaktion */
.eb-toc-mobil { display: none; }
.eb-toc-mobil:not([open]) > nav { display: none; }
/* Lange Wörter (übernommene Artikel, z. B. „Straßenverkehrsordnung“ in Versalien) trennen statt überstehen. */
main h1, main article h2, main article h3, .eb-artikel-prosa p, .eb-artikel-prosa li, .eb-artikel-prosa td { -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
.eb-toc-mobil summary::-webkit-details-marker { display: none; }
.eb-toc-mobil summary { list-style: none; }
.eb-artikel-autor { object-fit: cover; }
.p-0-0-0-20 { padding: 0 0 0 20px; }
@media (max-width: 639.98px) {
	.eb-toc-mobil { display: block; }
}
