/* ---------- Generic page (page.php / index.php) ---------- */
body .wrapper .page-section { padding: 44px 0 56px; background-color: #FFFFFF; }
body .wrapper .page-section .page-narrow { max-width: 1240px; }
body .wrapper .table-scroll { overflow-x: auto; }
body .wrapper .page-section .page-title { font-size: 28px; line-height: 1.2; margin-bottom: 20px; }
body .wrapper .page-section .page-content { font-size: 17px; line-height: 1.65; color: #20292A; }
body .wrapper .page-section .page-content h2 { font-size: 24px; margin: 30px 0 12px; }
body .wrapper .page-section .page-content h3 { font-size: 20px; margin: 24px 0 10px; }
body .wrapper .page-section .page-content p { margin-bottom: 16px; }
body .wrapper .page-section .page-content ul { list-style: disc; padding-left: 22px; margin-bottom: 16px; }
body .wrapper .page-section .page-content li { margin-bottom: 8px; }
body .wrapper .page-section .page-content a { color: #A5302C; text-decoration: underline; }

/* ---------- Steckbrief (Einzeltest-Faktenbox) ---------- */
body .wrapper .page-content .steckbrief { border: 2px solid #E6252C; border-radius: 10px; padding: 20px; margin: 0 0 24px; background-color: #FFFFFF; box-shadow: 0 8px 22px rgba(230, 37, 44, 0.1); }
body .wrapper .page-content .steckbrief .steckbrief-shot { display: block; width: 100%; height: auto; border: 1px solid #E2E2E2; border-radius: 8px; margin-bottom: 16px; }
body .wrapper .page-content .steckbrief .steckbrief-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
body .wrapper .page-content .steckbrief .steckbrief-title { display: flex; flex-direction: column; gap: 4px; }
body .wrapper .page-content .steckbrief .steckbrief-name { font-size: 20px; font-weight: 800; color: #20292A; }
body .wrapper .page-content .steckbrief .steckbrief-score { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; }
body .wrapper .page-content .steckbrief .steckbrief-score .score-star { display: inline-flex; color: #F2A900; }
body .wrapper .page-content .steckbrief .steckbrief-score .score-num { font-weight: 800; font-size: 20px; color: #20292A; }
body .wrapper .page-content .steckbrief .steckbrief-score .score-max { font-size: 13px; color: #4A545B; }
body .wrapper .page-content .steckbrief .steckbrief-facts { display: flex; flex-direction: column; gap: 0; margin: 0 0 16px; border-top: 1px solid #EEEEEE; list-style: none; padding: 0; }
body .wrapper .page-content .steckbrief .steckbrief-facts .fact-item { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #EEEEEE; font-size: 14px; margin: 0; }
body .wrapper .page-content .steckbrief .steckbrief-facts .fact-key { color: #4A545B; font-weight: 600; }
body .wrapper .page-content .steckbrief .steckbrief-facts .fact-val { color: #20292A; font-weight: 700; text-align: right; }
body .wrapper .page-content .steckbrief .steckbrief-ad { font-size: 11px; letter-spacing: 0.4px; text-transform: uppercase; color: #6E6E6E; margin: 10px 0 0; text-align: center; }

@media (min-width: 768px) {
  body .wrapper .page-content .steckbrief { float: right; width: 340px; margin: 0 0 20px 28px; }
}

/* ---------- Antwort-Highlight (erste Direktantwort nach jeder H2) ---------- */
body .wrapper .page-section .page-content h2 + p {
  background-color: #FDF0EE;
  border-left: 4px solid #E6252C;
  border-radius: 0 8px 8px 0;
  padding: 14px 18px;
  margin: 0 0 18px;
  font-size: 17px;
  color: #20292A;
}
/* nicht highlighten, wenn direkt nach H2 eine Box folgt */
body .wrapper .page-section .page-content h2 + .info-box,
body .wrapper .page-section .page-content h2 + .check-list,
body .wrapper .page-section .page-content h2 + .kurz-box { }

/* ---------- "Das Wichtigste in Kürze"-Box ---------- */
body .wrapper .page-content .kurz-box { background-color: #EEF2F5; border: 1px solid #E2E2E2; border-radius: 10px; padding: 20px 22px; margin: 0 0 28px; }
body .wrapper .page-content .kurz-box .kurz-head { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 800; letter-spacing: 0.6px; text-transform: uppercase; color: #A5302C; margin: 0 0 14px; }
body .wrapper .page-content .kurz-box .kurz-head svg { width: 18px; height: 18px; flex-shrink: 0; }
body .wrapper .page-content .kurz-box ul { list-style: none; padding: 0; margin: 0; }
body .wrapper .page-content .kurz-box li { position: relative; padding-left: 30px; margin-bottom: 10px; font-size: 15px; line-height: 1.5; color: #20292A; }
body .wrapper .page-content .kurz-box li:last-child { margin-bottom: 0; }
body .wrapper .page-content .kurz-box li::before { content: ''; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%232E7D46' d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1.3 14.3l-3.5-3.5 1.4-1.4 2.1 2.1 4.9-4.9 1.4 1.4z'/%3E%3C/svg%3E"); }

/* ---------- Häkchen-/Icon-Liste (.check-list) ---------- */
body .wrapper .page-content ul.check-list { list-style: none; padding-left: 0; margin-bottom: 22px; }
body .wrapper .page-content ul.check-list li { position: relative; padding-left: 32px; margin-bottom: 11px; line-height: 1.55; }
body .wrapper .page-content ul.check-list li::before { content: ''; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; background-repeat: no-repeat; background-size: contain; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%232E7D46' d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1.3 14.3l-3.5-3.5 1.4-1.4 2.1 2.1 4.9-4.9 1.4 1.4z'/%3E%3C/svg%3E"); }

/* ---------- Info-/Callout-Box ---------- */
body .wrapper .page-content .info-box { display: flex; gap: 14px; align-items: flex-start; background-color: #EEF2F5; border: 1px solid #E2E2E2; border-left: 4px solid #4A545B; border-radius: 0 10px 10px 0; padding: 16px 18px; margin: 0 0 22px; }
body .wrapper .page-content .info-box .info-icon { flex-shrink: 0; width: 26px; height: 26px; color: #4A545B; margin-top: 1px; }
body .wrapper .page-content .info-box .info-icon svg { width: 26px; height: 26px; display: block; }
body .wrapper .page-content .info-box .info-body { font-size: 15px; line-height: 1.55; color: #20292A; }
body .wrapper .page-content .info-box .info-body p { margin: 0 0 8px; }
body .wrapper .page-content .info-box .info-body p:last-child { margin-bottom: 0; }
body .wrapper .page-content .info-box .info-title { display: block; font-weight: 800; color: #20292A; margin-bottom: 4px; }
body .wrapper .page-content .info-box.is-warn { background-color: #FDF0EE; border-left-color: #E6252C; }
body .wrapper .page-content .info-box.is-warn .info-icon { color: #E6252C; }
body .wrapper .page-content .info-box.is-help { background-color: #EAF5EE; border-left-color: #2E7D46; }
body .wrapper .page-content .info-box.is-help .info-icon { color: #2E7D46; }
body .wrapper .page-content .info-box.is-tip { background-color: #FFF8EA; border-left-color: #F2A900; }
body .wrapper .page-content .info-box.is-tip .info-icon { color: #C8890A; }

/* ---------- Ratgeber-Hub (Kategorie-Karten) ---------- */
body .wrapper .page-content .rat-hub { display: flex; flex-direction: column; gap: 36px; margin: 6px 0 8px; }
body .wrapper .page-content .rat-cat .rat-cat-head { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; padding-bottom: 12px; border-bottom: 2px solid #EEEEEE; }
body .wrapper .page-content .rat-cat .rat-cat-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 8px; background-color: #FDF0EE; color: #E6252C; flex-shrink: 0; }
body .wrapper .page-content .rat-cat .rat-cat-icon svg { width: 24px; height: 24px; }
body .wrapper .page-content .rat-cat .rat-cat-title { font-size: 20px; font-weight: 800; color: #20292A; margin: 0; }
body .wrapper .page-content .rat-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
body .wrapper .page-content .rat-card { display: block; padding: 18px; background-color: #FFFFFF; border: 1px solid #E2E2E2; border-left: 3px solid #E6252C; border-radius: 8px; text-decoration: none; transition: box-shadow 0.15s ease, transform 0.15s ease; }
body .wrapper .page-content .rat-card:hover { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.09); transform: translateY(-2px); }
body .wrapper .page-content .rat-card .rat-card-title { display: block; font-size: 16px; font-weight: 800; color: #20292A; margin-bottom: 5px; text-decoration: none; }
body .wrapper .page-content .rat-card .rat-card-desc { display: block; font-size: 14px; line-height: 1.45; color: #4A545B; text-decoration: none; }

@media (min-width: 768px) {
  body .wrapper .page-content .rat-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  body .wrapper .page-content .rat-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Werbe-Hinweis am Anfang werblicher Inhalte (DE-Compliance) ---------- */
body .wrapper .ad-lead { font-size: 13px; line-height: 1.5; color: #4A545B; margin: 0 0 18px; padding: 11px 14px; background-color: #FFF8EA; border: 1px solid #F2D98A; border-radius: 6px; }
body .wrapper .ad-lead .ad-tag { display: inline-block; background-color: #20292A; color: #FFFFFF; font-size: 11px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; padding: 2px 7px; border-radius: 3px; margin-right: 6px; }
/* Footer-Legal: Pflicht-Links lesbar machen */
body .wrapper .footer-legal .legal-text a { color: inherit; text-decoration: underline; }
/* Pflicht-Fußnote unter Anbieter-Tabellen */
body .wrapper .table-note { font-size: 13px; line-height: 1.6; color: #4A545B; margin: 12px 0 0; }
/* Defensiv: leere <p>, die wpautop teils erzeugt, nicht als Antwort-Highlight rendern */
body .wrapper .page-content p:empty { display: none; }

/* Verlinkter Anbietername in Tabellen + sekundäre "Zum Test"-Links */
body .wrapper .op-name { text-decoration: none; }
body .wrapper .op-name:hover { color: #A5302C; text-decoration: underline; }
body .wrapper .table-test-link { display: inline-block; margin-top: 6px; font-size: 12px; font-weight: 700; color: #A5302C; text-decoration: underline; }
body .wrapper .page-content .steckbrief .steckbrief-test-link { display: block; text-align: center; margin-top: 10px; font-size: 13px; font-weight: 700; color: #A5302C; text-decoration: underline; }

/* Test-Übersicht (Karten-Grid auf /casino/) */
body .wrapper .page-content .test-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0 0 18px; }
body .wrapper .page-content .test-card { border: 1px solid #E2E2E2; border-radius: 10px; padding: 18px; background-color: #FFFFFF; }
body .wrapper .page-content .test-card-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
body .wrapper .page-content .test-card-meta { display: flex; flex-direction: column; gap: 4px; }
body .wrapper .page-content .test-card-name { font-size: 17px; font-weight: 800; color: #20292A; text-decoration: none; }
body .wrapper .page-content .test-card-name:hover { color: #A5302C; }
body .wrapper .page-content .test-card .score { margin-left: auto; }
body .wrapper .page-content .test-card-verdict { font-size: 14px; line-height: 1.5; color: #4A545B; margin: 0 0 14px; }
body .wrapper .page-content .test-card-actions { display: flex; gap: 10px; }
body .wrapper .page-content .test-card-actions .btn { flex: 1; text-align: center; text-decoration: none; }

/* FIX: generische .page-content-a-Regel überschrieb die Button-Textfarbe (rot auf rot). */
body .wrapper .page-section .page-content a.btn-primary,
body .wrapper .page-section .page-content a.btn-primary:hover,
body .wrapper .page-section .page-content a.btn-table,
body .wrapper .page-section .page-content a.btn-table:hover { color: #FFFFFF; text-decoration: none; }
/* Hell-Sekundärbutton (für weiße Flächen, statt btn-ghost): roter Rahmen + rote Schrift */
body .wrapper .btn-outline { background-color: #FFFFFF; color: #A5302C; border-color: #E6252C; }
body .wrapper .btn-outline:hover { background-color: #E6252C; color: #FFFFFF; border-color: #E6252C; }
body .wrapper .page-section .page-content a.btn-outline { color: #A5302C; text-decoration: none; }
body .wrapper .page-section .page-content a.btn-outline:hover { color: #FFFFFF; }

@media (min-width: 768px) {
  body .wrapper .page-content .test-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  body .wrapper .page-content .test-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Comparison ---------- */
body .wrapper .comparison { background-color: #F9F9F9; padding: 48px 0; border-top: 1px solid #E2E2E2; border-bottom: 1px solid #E2E2E2; }
body .wrapper .comparison .table-scroll { width: 100%; }

body .wrapper .op { display: flex; align-items: center; gap: 11px; }
body .wrapper .op-logo { display: inline-flex; align-items: center; justify-content: center; width: 96px; height: 42px; border-radius: 6px; background-color: #FFFFFF; border: 1px solid #E2E2E2; padding: 5px 8px; flex-shrink: 0; }
body .wrapper .op-logo .op-logo-img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
body .wrapper .op-logo.op-logo-lg { width: 124px; height: 52px; }
body .wrapper .op-logo.op-logo-fallback { width: 42px; height: 42px; background-color: #20292A; border: none; color: #FFFFFF; font-weight: 800; font-size: 15px; padding: 0; }
body .wrapper .op-logo.op-logo-lg.op-logo-fallback { width: 54px; height: 54px; font-size: 18px; }
body .wrapper .op-meta { display: flex; flex-direction: column; gap: 3px; }
body .wrapper .op-name { font-weight: 700; font-size: 16px; color: #20292A; }
body .wrapper .op-badge { display: inline-block; align-self: flex-start; background-color: #FFC847; color: #20292A; font-size: 10px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; padding: 2px 7px; border-radius: 3px; }

body .wrapper .score { display: inline-flex; align-items: center; gap: 5px; }
body .wrapper .score .score-star { display: inline-flex; color: #F2A900; }
body .wrapper .score .score-num { font-weight: 800; font-size: 17px; color: #20292A; }
body .wrapper .score .score-max { font-size: 12px; color: #4A545B; }

body .wrapper .comparison-table { width: 100%; }
body .wrapper .comparison-table thead { display: none; }
body .wrapper .comparison-table tbody { display: block; }
body .wrapper .comparison-table tbody tr { display: block; background-color: #FFFFFF; border: 1px solid #E2E2E2; border-radius: 8px; padding: 16px; margin-bottom: 16px; }
body .wrapper .comparison-table tbody tr.is-winner { border-color: #E6252C; border-width: 2px; box-shadow: 0 6px 18px rgba(230, 37, 44, 0.12); }
body .wrapper .comparison-table tbody td { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 7px 0; border-bottom: 1px solid #EEEEEE; font-size: 15px; color: #20292A; }
body .wrapper .comparison-table tbody td:last-child { border-bottom: none; }
body .wrapper .comparison-table tbody td::before { content: attr(data-label); font-size: 12px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: #4A545B; flex-shrink: 0; }
body .wrapper .comparison-table tbody td.col-rank { display: none; }
body .wrapper .comparison-table tbody td.col-name::before { display: none; }
body .wrapper .comparison-table tbody td.col-name { justify-content: flex-start; padding-top: 0; }
body .wrapper .comparison-table tbody td.col-cta::before { display: none; }
body .wrapper .comparison-table tbody td.col-cta { padding-top: 12px; }
body .wrapper .comparison-table tbody td.col-cta .btn-table { width: 100%; }

body .wrapper .ad-note { font-size: 13px; line-height: 1.6; color: #4A545B; margin-top: 18px; max-width: 900px; }
body .wrapper .ad-note .ad-tag { display: inline-block; background-color: #EEEEEE; color: #20292A; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; padding: 2px 7px; border-radius: 3px; margin-right: 6px; }

/* ---------- Recommendations ---------- */
body .wrapper .recommendations { background-color: #FFFFFF; padding: 52px 0; }
body .wrapper .recommendations .card-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
body .wrapper .rec-card { background-color: #FFFFFF; border: 1px solid #E2E2E2; border-radius: 10px; padding: 24px; display: flex; flex-direction: column; }
body .wrapper .rec-card.is-featured { border-color: #E6252C; border-width: 2px; box-shadow: 0 10px 26px rgba(230, 37, 44, 0.12); }
body .wrapper .rec-card .card-eyebrow { display: inline-block; align-self: flex-start; background-color: #FFC847; color: #20292A; font-size: 11px; font-weight: 800; letter-spacing: 0.8px; text-transform: uppercase; padding: 4px 10px; border-radius: 3px; margin-bottom: 16px; }
body .wrapper .rec-card .card-head { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; }
body .wrapper .rec-card .card-title { font-size: 22px; }
body .wrapper .rec-card .card-rating { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
body .wrapper .rec-card .stars { display: inline-flex; gap: 2px; }
body .wrapper .rec-card .stars .star { display: inline-flex; color: #E2E2E2; }
body .wrapper .rec-card .stars .star.filled { color: #F2A900; }
body .wrapper .rec-card .stars .star.half { color: #F2A900; opacity: 0.55; }
body .wrapper .rec-card .rating-num { font-weight: 800; font-size: 18px; color: #20292A; }
body .wrapper .rec-card .fact-list { display: flex; flex-direction: column; gap: 0; margin-bottom: 16px; border-top: 1px solid #EEEEEE; }
body .wrapper .rec-card .fact-item { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #EEEEEE; font-size: 14px; }
body .wrapper .rec-card .fact-key { color: #4A545B; font-weight: 600; }
body .wrapper .rec-card .fact-val { color: #20292A; font-weight: 700; text-align: right; }
body .wrapper .rec-card .card-verdict { font-size: 14px; line-height: 1.55; color: #4A545B; margin-bottom: 18px; flex-grow: 1; }
body .wrapper .rec-card .card-ad { font-size: 11px; letter-spacing: 0.5px; text-transform: uppercase; color: #6E6E6E; margin-top: 8px; text-align: center; }

/* ---------- Testverfahren ---------- */
body .wrapper .testverfahren { background-color: #EEF2F5; padding: 52px 0; }
body .wrapper .testverfahren .test-inner { display: flex; flex-direction: column; gap: 32px; }
body .wrapper .test-media .test-image { position: relative; width: 100%; height: 240px; border-radius: 12px; background-color: #EEF2F5; border: 1px solid #E2E2E2; overflow: hidden; }
body .wrapper .test-media .test-image-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
body .wrapper .test-media .test-image-badge { position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 8px; background-color: #E6252C; border: none; padding: 8px 14px; border-radius: 999px; color: #FFFFFF; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18); }
body .wrapper .test-media .test-image-text { color: #FFFFFF; font-weight: 700; font-size: 14px; }
body .wrapper .testverfahren .criteria-list { display: flex; flex-direction: column; gap: 18px; margin-top: 6px; }
body .wrapper .testverfahren .criteria-item { display: flex; gap: 14px; align-items: flex-start; }
body .wrapper .testverfahren .criteria-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 8px; background-color: #FFFFFF; color: #E6252C; flex-shrink: 0; border: 1px solid #E2E2E2; }
body .wrapper .testverfahren .criteria-body { display: flex; flex-direction: column; gap: 4px; }
body .wrapper .testverfahren .criteria-title { font-weight: 700; font-size: 17px; color: #20292A; }
body .wrapper .testverfahren .criteria-text { font-size: 15px; line-height: 1.55; color: #4A545B; }

/* ---------- Startseite: Themen-Tiles ---------- */
body .wrapper .topics { background-color: #F9F9F9; padding: 52px 0; border-top: 1px solid #E2E2E2; }
body .wrapper .topic-tiles { display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
body .wrapper .topic-tile { display: block; background-color: #FFFFFF; border: 1px solid #E2E2E2; border-radius: 10px; padding: 22px; text-decoration: none; transition: box-shadow 0.15s ease, transform 0.15s ease; }
body .wrapper .topic-tile:hover { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); transform: translateY(-2px); }
body .wrapper .topic-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 8px; background-color: #FDF0EE; color: #E6252C; margin-bottom: 12px; }
body .wrapper .topic-title { display: block; font-size: 17px; font-weight: 800; color: #20292A; margin-bottom: 4px; }
body .wrapper .topic-desc { display: block; font-size: 14px; line-height: 1.45; color: #4A545B; }
@media (min-width: 768px) { body .wrapper .topic-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { body .wrapper .topic-tiles { grid-template-columns: repeat(4, 1fr); } }

/* ---------- Startseite: Ratgeber-Teaser ---------- */
body .wrapper .ratgeber-teaser { background-color: #FFFFFF; padding: 52px 0; }
body .wrapper .topics-more { margin-top: 18px; }
body .wrapper .topics-more a { color: #A5302C; font-weight: 700; text-decoration: none; }
body .wrapper .topics-more a:hover { text-decoration: underline; }

/* ---------- Startseite: Redaktion (E-E-A-T) ---------- */
body .wrapper .team { background-color: #F9F9F9; padding: 52px 0; }
body .wrapper .team-grid { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 24px; }
body .wrapper .team-card { display: flex; gap: 16px; align-items: flex-start; background-color: #FFFFFF; border: 1px solid #E2E2E2; border-radius: 10px; padding: 20px; }
body .wrapper .team-photo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 2px solid #E6252C; }
body .wrapper .team-meta { display: flex; flex-direction: column; gap: 2px; }
body .wrapper .team-name { font-size: 17px; font-weight: 800; color: #20292A; }
body .wrapper .team-role { font-size: 13px; font-weight: 600; color: #A5302C; }
body .wrapper .team-bio { font-size: 14px; line-height: 1.55; color: #4A545B; margin: 6px 0 0; }
@media (min-width: 768px) { body .wrapper .team-grid { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Startseite: SEO-Textblock ---------- */
body .wrapper .home-copy { background-color: #F9F9F9; padding: 52px 0; border-top: 1px solid #E2E2E2; }
body .wrapper .home-copy .page-narrow { max-width: 880px; }
body .wrapper .home-copy h2 { font-size: 22px; line-height: 1.25; margin: 26px 0 10px; color: #20292A; }
body .wrapper .home-copy h2:first-child { margin-top: 0; }
body .wrapper .home-copy p { font-size: 16px; line-height: 1.7; color: #20292A; margin-bottom: 14px; }
body .wrapper .home-copy a { color: #A5302C; text-decoration: underline; }

/* ---------- FAQ ---------- */
body .wrapper .faq { background-color: #FFFFFF; padding: 52px 0; }
body .wrapper .faq .faq-list { display: flex; flex-direction: column; gap: 12px; max-width: 880px; }
body .wrapper .faq .faq-item { border: 1px solid #E2E2E2; border-radius: 8px; overflow: hidden; }
body .wrapper .faq .faq-q { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 17px 20px; cursor: pointer; background-color: #F9F9F9; }
body .wrapper .faq .faq-q-text { font-weight: 700; font-size: 16px; color: #20292A; }
body .wrapper .faq .faq-chevron { display: inline-flex; color: #A5302C; transition: transform 0.2s ease; flex-shrink: 0; }
body .wrapper .faq .faq-item.is-open .faq-chevron { transform: rotate(180deg); }
body .wrapper .faq .faq-a { max-height: 0; overflow: hidden; transition: max-height 0.25s ease; }
body .wrapper .faq .faq-item.is-open .faq-a { max-height: 320px; }
body .wrapper .faq .faq-a-text { padding: 4px 20px 20px; font-size: 15px; line-height: 1.6; color: #4A545B; }

@media (min-width: 768px) {
  body .wrapper .comparison-table { display: table; }
  body .wrapper .comparison-table thead { display: table-header-group; }
  body .wrapper .comparison-table tbody { display: table-row-group; }
  body .wrapper .comparison-table thead th { background-color: #20292A; color: #FFFFFF; font-size: 13px; font-weight: 700; text-align: left; padding: 14px 14px; white-space: nowrap; }
  body .wrapper .comparison-table thead th:first-child { border-top-left-radius: 8px; }
  body .wrapper .comparison-table thead th:last-child { border-top-right-radius: 8px; text-align: center; }
  body .wrapper .comparison-table tbody tr { display: table-row; background-color: #FFFFFF; border: none; border-radius: 0; padding: 0; margin: 0; }
  body .wrapper .comparison-table tbody tr:nth-child(even) { background-color: #F9F9F9; }
  body .wrapper .comparison-table tbody tr.is-winner { background-color: #FDF0EE; box-shadow: none; border: none; }
  body .wrapper .comparison-table tbody td { display: table-cell; vertical-align: middle; justify-content: flex-start; padding: 14px 14px; border-bottom: 1px solid #E2E2E2; font-size: 14px; }
  body .wrapper .comparison-table tbody td::before { display: none; }
  body .wrapper .comparison-table tbody td.col-rank { display: table-cell; font-weight: 800; color: #4A545B; text-align: center; width: 42px; }
  body .wrapper .comparison-table tbody tr.is-winner td.col-rank { color: #A5302C; }
  body .wrapper .comparison-table tbody td.col-name::before { display: none; }
  body .wrapper .comparison-table tbody td.col-cta { text-align: center; padding-top: 14px; }
  body .wrapper .comparison-table tbody td.col-cta .btn-table { width: auto; }
  body .wrapper .comparison-table tbody tr.is-winner td:first-child { box-shadow: inset 4px 0 0 #E6252C; }

  body .wrapper .recommendations .card-grid { grid-template-columns: repeat(3, 1fr); }
  body .wrapper .testverfahren .test-inner { flex-direction: row; align-items: center; }
  body .wrapper .test-media { flex: 1 1 42%; }
  body .wrapper .test-content { flex: 1 1 58%; }
  body .wrapper .test-media .test-image { height: 320px; }
}

/* ---------- Autorenkasten (E-E-A-T) ---------- */
body .wrapper .author-box { display: flex; gap: 16px; align-items: flex-start; margin-top: 34px; padding: 20px; background-color: #F9F9F9; border: 1px solid #E2E2E2; border-radius: 10px; }
body .wrapper .author-box .author-photo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 2px solid #E6252C; }
body .wrapper .author-box .author-photo-fallback { display: inline-flex; align-items: center; justify-content: center; background-color: #E6252C; color: #FFFFFF; font-weight: 800; font-size: 28px; }
body .wrapper .author-box .author-meta { display: flex; flex-direction: column; gap: 3px; }
body .wrapper .author-box .author-byline { font-size: 11px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; color: #A5302C; }
body .wrapper .author-box .author-name { font-size: 17px; font-weight: 800; color: #20292A; }
body .wrapper .author-box .author-role { font-size: 13px; font-weight: 600; color: #4A545B; }
body .wrapper .author-box .author-bio { font-size: 14px; line-height: 1.55; color: #4A545B; margin-top: 6px; }

/* ---------- Verwandte-Themen-Karten (bricht Textwüsten auf) ---------- */
body .wrapper .themen-cards { margin: 36px 0 8px; padding: 22px; background-color: #F9F9F9; border: 1px solid #E2E2E2; border-radius: 10px; }
body .wrapper .themen-cards .themen-head { font-size: 13px; font-weight: 800; letter-spacing: 0.6px; text-transform: uppercase; color: #A5302C; margin: 0 0 14px; }
body .wrapper .themen-cards .themen-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
body .wrapper .themen-cards .themen-card { display: block; padding: 14px 16px; background-color: #FFFFFF; border: 1px solid #E2E2E2; border-left: 3px solid #E6252C; border-radius: 8px; transition: box-shadow 0.15s ease, transform 0.15s ease; }
body .wrapper .themen-cards .themen-card:hover { box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08); transform: translateY(-1px); }
body .wrapper .themen-cards .themen-card-title { display: block; font-size: 15px; font-weight: 800; color: #20292A; margin-bottom: 3px; }
body .wrapper .themen-cards .themen-card-desc { display: block; font-size: 13px; line-height: 1.45; color: #4A545B; }

@media (min-width: 768px) {
  body .wrapper .themen-cards .themen-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  body .wrapper .themen-cards .themen-grid { grid-template-columns: repeat(4, 1fr); }
}
