/* Vergleichsmodul der LP-Seiten (Karten, Filter, Tabellen), ausgelagert aus identischen Inline-Styles von 15 LPs (27.10.2026) */

.pt.is-no b{color:var(--red-deep)}
.fbtn b{display:block;font-size:var(--fs-md);font-weight:600;color:var(--head);line-height:1.3}
.fgroup-h b{color:var(--navy);font-weight:600}
.rescount b{color:var(--head);font-weight:700}
.wenlist li b{color:var(--head);font-weight:600}
.disc b{color:var(--ink);font-weight:600}
.krow .kv b{font-weight:600;color:var(--head)}
.krow .kv b.free{color:var(--green-deep)}
.feat-tag b{font-weight:600;color:var(--head)}
.feat-tag b{font-weight:inherit;color:inherit}
.ctab td b{font-weight:700;font-size:var(--fs-base)}
.ctab td b.free,.ctab td .free{color:var(--green-deep)}
.ct-note b{font-size:22px;font-weight:700;color:var(--head);letter-spacing:-.03em}
.ct-l b{font-weight:inherit;color:inherit;font-size:inherit}
.ctab .ct-l b{font-weight:inherit;font-size:inherit;color:inherit}
@media(max-width:760px){
  .steps.flow::before{left:calc(16px + 16px);right:auto;width:2px;top:30px;bottom:40px;height:auto}
}
.ovt td.free{color:var(--green-deep);font-weight:600}
.plist dt span{display:block;font-weight:400;color:var(--ink);font-size:var(--fs-md);line-height:1.55;margin-top:2px}
.alist li{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:12px 0;border-bottom:1px solid var(--line);margin:0}
.alist b{color:var(--head);font-weight:600}
@media(max-width:560px){.plist>div{align-items:flex-start;gap:14px}.plist dd{font-size:var(--fs-md)}.alist li{flex-direction:column;gap:4px}}
.plist dt b{font-weight:600}
@media(max-width:560px){.plist>div{display:grid;grid-template-columns:1fr auto;gap:2px 12px}.plist dt{display:contents}.plist dt b{grid-column:1;grid-row:1}.plist dd{grid-column:2;grid-row:1}.plist dt span{grid-column:1/-1;grid-row:2}}
.qr-logo img{max-width:34px;max-height:34px}
.drow{border-radius:22px;border-color:var(--line)}
.drow.top{background:var(--bg);border:1.5px solid var(--gold-line)}
.drow.top .rk{background:var(--navy);color:var(--bg)}
@media(hover:hover){.drow.top:hover{border-color:var(--gold)}}
.drow .plogo{border-radius:12px}
.card-badges .badge{border-radius:99px;padding:4px 11px;background:var(--navy-soft);color:var(--navy)}
.card-badges .badge.b-free{background:var(--green-soft);color:var(--green-deep)}
.card-badges .badge.b-note{background:var(--gold-soft);color:var(--gold-deep)}
.mrow{background:var(--bg-2);border-radius:16px}
.drow.top .mrow{background:#fff}
.mrow>div+div,.mrow>div:nth-child(even){box-shadow:none}
.mrow>div:nth-child(n+3){border-top:0}
.mrow .cl{color:var(--muted)}
.feat-tag{gap:9px}
.feat-tag svg{box-sizing:content-box;width:10px;height:10px;padding:3px;margin-top:3px;border-radius:50%;background:color-mix(in srgb,var(--green) 30%,transparent);color:var(--green)}
.feat-tag.is-no svg{background:color-mix(in srgb,var(--red) 26%,transparent);color:var(--red)}
.card-toggles .ctgl{background:var(--navy-soft);border-radius:99px;padding:7px 14px;font-weight:600;transition:background .15s}
.card-toggles .ctgl:hover{background:var(--navy-line)}
.card-toggles .ctgl:hover span{text-decoration:none}
.card-toggles .ctgl+.ctgl{margin-left:4px}
.drow.top .card-toggles .ctgl{box-shadow:inset 0 0 0 1px var(--gold-line)}
.drow.top .card-toggles .ctgl:hover{background:var(--gold-soft)}
.dsc .nn,.dc-action .nn{font-weight:700;letter-spacing:-.03em}
.dsc .nw,.dc-action .nw,.m-score .nw{text-transform:none;letter-spacing:0;font-size:var(--fs-sm);font-weight:600;border-radius:99px;padding:4px 12px}
.dc-action .btn{border-radius:12px}
@media(hover:hover){[data-tip] .ftxt{text-decoration-color:var(--line-2)}}
.seg-label.seg-out{margin-bottom:6px}
.cmp{gap:20px}
.drow{border-color:var(--line-2);box-shadow:0 1px 2px rgba(20,34,75,.04),0 6px 18px rgba(20,34,75,.05)}
@media(max-width:760px){.cmp{gap:16px}}
.drow.top{border:1.5px solid var(--line-2)}
@media(hover:hover){.drow.top:hover{border-color:var(--navy-line)}}
.drow.top .rk{background:var(--navy);color:var(--bg)}
.drow.top .card-toggles .ctgl{background:#fff;box-shadow:inset 0 0 0 1px var(--line-2)}
.drow.top .card-toggles .ctgl:hover{background:var(--navy-soft)}
:root[data-theme="dark"] .drow.top .card-toggles .ctgl{background:transparent}
.drow.top{background:var(--card);border:1.5px solid var(--navy-line)}
@media(hover:hover){.drow.top:hover{border-color:var(--navy)}}
.drow.top .mrow{background:var(--bg-2)}
.drow.top .card-toggles .ctgl{background:var(--navy-soft)}
.drow.top .card-toggles .ctgl:hover{background:var(--navy-line)}
:root[data-theme="dark"] .drow.top .mrow{background:var(--bg-2)}
:root[data-theme="dark"] .drow.top .card-toggles .ctgl{background:var(--navy-soft)}
.drow.top{border:1.5px solid var(--gold-line)}
:root[data-theme="dark"] .drow.top{border-color:#8A6A24}
.card-toggles .ctgl-body{background:var(--bg-2);border-top:0;border-radius:14px;padding:8px 18px;margin-top:10px}
.card-toggles .ctgl-body .krow,.card-toggles .ctgl-body li{border-top:0;border-bottom:0}
.card-toggles .ctgl-body .krow{padding:6px 0}
.card-toggles .ctgl-body .gs-wen{border-top:0;margin:0}
.card-toggles .ctgl-body .gs-wen li{padding:7px 0}
:root[data-theme="dark"] .card-toggles .ctgl-body{background:var(--bg-2)}
.mrow>div,.mrow.m3>div:nth-child(3){border-top:0;border-left:0;border-right:0;box-shadow:none}
@media(max-width:760px){.mrow>div,.mrow>div:nth-child(n+3),.mrow.m3>div:nth-child(3){border-top:0;border-left:0;border-right:0;box-shadow:none}
.mrow.m3>div:nth-child(3){border-top:1px solid var(--line-2);grid-column:1/-1}}
.drow .mrow>div:nth-child(n),.drow .mrow.m3>div:nth-child(n){box-shadow:none;border-top:0;border-left:0;border-right:0}
.drow{box-shadow:0 1px 2px rgba(20,34,75,.05),0 10px 26px rgba(20,34,75,.07)}
@media(hover:hover){.drow:hover{box-shadow:0 2px 4px rgba(20,34,75,.06),0 14px 34px rgba(20,34,75,.10)}}
.cmpsec .lead{color:var(--ink);font-size:var(--fs-lg);line-height:1.65;max-width:780px}
.cmp-main>.seg-label.seg-out{display:none}
.ftop{row-gap:14px}
@media(max-width:760px){.ftop-right{flex:1 1 auto;min-width:0}}
.cmp{grid-template-columns:minmax(0,1fr)}
.drow{min-width:0}
.ftop{flex-wrap:wrap;align-items:center;row-gap:18px}
.ftop-right{flex:1 1 100%;justify-content:space-between;margin-left:0}
.ftop-right .rescount{font-size:var(--fs-md);color:var(--muted);white-space:nowrap}
.ftop-right .sdd-btn{background:transparent;border:0;padding:4px 0;gap:6px;font-size:var(--fs-md);box-shadow:none}
.ftop-right .sdd-btn:hover .sdd-v{text-decoration:underline;text-underline-offset:3px}
.ftop-right .sdd-k{display:inline;color:var(--muted)}
.ftop-right .sdd-v{color:var(--navy);font-weight:600}
.ftool{margin-bottom:4px}
.cmpsec .segmented{background:transparent;border:0;padding:0;gap:8px;border-radius:0;box-shadow:none}
.cmpsec .segmented button{border:0;border-radius:99px;padding:9px 16px;font-size:var(--fs-md);font-weight:500;transition:background .15s,color .15s}
.cmpsec .segmented button:hover{background:var(--navy-soft);color:var(--navy)}
.cmpsec .segmented button.on,.cmpsec .segmented button.on:hover{background:var(--navy);color:#fff;box-shadow:none}
:root[data-theme="dark"] .cmpsec .segmented button{background:var(--bg-2);color:var(--ink)}
:root[data-theme="dark"] .cmpsec .segmented button.on{background:var(--navy);color:#0B1020}
.cmpsec .segmented button{border-radius:10px;padding:9px 15px;background:var(--bg-3);color:var(--head);box-shadow:none}
.cmpsec .segmented button.on,.cmpsec .segmented button.on:hover{background:#fff;box-shadow:inset 0 0 0 1.5px var(--navy)}
[data-tip]:hover::after{background:var(--ink);border:0;color:#fff;font-weight:400;box-shadow:0 10px 24px rgba(20,34,75,.22)}
[data-tip]:hover::before{background:var(--ink);border:0}
:root[data-theme="dark"] .cmpsec .segmented button.on{background:var(--card)}
:root[data-theme="dark"] [data-tip]:hover::after,:root[data-theme="dark"] [data-tip]:hover::before{background:#E4E8F2;color:#141B2E}
.cmpsec .segmented button[data-tip] .ftxt{text-decoration:underline dotted;text-decoration-color:#9AA2B6;text-decoration-thickness:1.5px;text-underline-offset:5px}
.cmpsec .segmented button[data-tip]:hover .ftxt,.cmpsec .segmented button[data-tip].on .ftxt{text-decoration-color:var(--navy)}
.drow .pn{line-height:1.25}
.drow .ptag{line-height:1.4;margin-top:2px}
.drow .mrow .cl{font-size:var(--fs-sm)}
.drow .feat-tag{font-size:var(--fs-md);line-height:1.45}
.drow .card-toggles .ctgl,.drow .cmpchk{font-size:var(--fs-md)}
.drow .cmpchk{font-weight:500}
.drow .dsc .nw{font-size:var(--fs-md)}
.drow .dsc .vd{font-size:var(--fs-sm);line-height:1.4}
.drow .dc-test{font-size:var(--fs-md)}
.drow .pn{font-weight:700}
.drow .mrow .cv{font-weight:600;font-size:var(--fs-base);line-height:1.3}
.drow .card-toggles .ctgl{font-weight:500}
.drow .dc-test{font-weight:500}
.drow .dc-test .tn{color:var(--muted)}
.drow .dsc .nw{font-weight:500}
.drow .feat-tag b{font-weight:600}
.drow{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}
.drow .cmpchk,.drow .mrow .cl{font-weight:400}
.drow .ctgl-body b,.drow .gs-wen b,.drow .wenlist b,.drow .krow .kl{font-weight:500}
.drow .ctgl-body span,.drow .gs-wen span,.drow .krow .kv small{font-weight:400;color:var(--ink)}
.drow .card-toggles{margin-top:8px}
.drow .krow .kv b{font-weight:500}
.drow .dc-test{font-weight:600}
.drow .card-toggles .ctgl,.drow.top .card-toggles .ctgl{background:none;box-shadow:none;border-radius:0;padding:6px 0;font-weight:600;color:var(--navy)}
.drow .card-toggles .ctgl:hover,.drow.top .card-toggles .ctgl:hover{background:none}
.drow .card-toggles .ctgl:hover span{text-decoration:underline;text-underline-offset:3px}
.drow .card-toggles .ctgl+.ctgl{margin-left:0}
.drow .card-toggles{column-gap:24px}
:root[data-theme="dark"] .drow .card-toggles .ctgl{background:none}
.cmpsec .segmented button.on,.cmpsec .segmented button.on:hover{box-shadow:inset 0 0 0 1px var(--navy-line)}
.cmpsec .segmented button[data-tip].on .ftxt,.cmpsec .segmented button[data-tip]:hover .ftxt{text-decoration-color:var(--navy-line)}
.two-paths .tp.on{box-shadow:inset 0 0 0 1px var(--navy-line)}
.cmpsec .segmented button.on,.cmpsec .segmented button.on:hover{background:var(--navy-soft);color:var(--navy);font-weight:600;box-shadow:inset 0 0 0 1px var(--navy)}
.two-paths .tp.on{background:var(--navy-soft);box-shadow:inset 0 0 0 1px var(--navy)}
.ctab tr.ct-cta th,.ctab tr.ct-cta td{position:sticky;bottom:0;z-index:2;background:var(--bg);box-shadow:0 -1px 0 var(--line),0 -10px 18px -10px rgba(20,34,75,.12);padding-top:12px;padding-bottom:12px}
.ctab tr.ct-cta th{z-index:3}
.cmodal-body{padding-bottom:0}
.cmodal-body{display:flex;flex-direction:column;overflow:hidden;min-height:0}
.cmodal-body .ctwrap{flex:1 1 auto;min-height:0;overflow:auto}
.cmodal-body>:not(.ctwrap){flex:none}
.ctab tbody th{overflow-wrap:anywhere;hyphens:auto}
.ctab td b{font-weight:500;font-size:var(--fs-md);color:var(--head)}
.ctab td.best b,.ctab td b.free{font-weight:600}
.ctab td{font-size:var(--fs-md)}
.ctab tbody th{font-weight:400;color:var(--muted)}
.ctab .ct-n{font-weight:700}
.drow .krow .kl{font-weight:500;color:var(--head)}
.drow .krow .kv b{font-weight:400;color:var(--ink)}
.drow .krow .kv b.free{font-weight:500;color:var(--green-deep)}

/* 01.11.2026 (Alessia, Variante B): Kartenfuß „Alle Kosten / Für wen? / Vergleichen“ als ruhiges graues Band.
   Breit: eine Zeile, Vergleichen rechts. Handy: eine Zeile, wenn Platz; unter 421 px Vergleichen in zweiter Zeile links.
   Aufgeklappte Details erscheinen als weiße Fläche innerhalb des Bandes. */
.drow .card-toggles{margin-top:18px;padding:0 16px;column-gap:24px;row-gap:0;align-items:center;background:var(--panel);border-radius:12px}
:is(.drow,.drow.top) .card-toggles .ctgl,.drow .card-toggles .cmpchk{min-height:46px;padding:0;font-size:15px}
.drow .card-toggles .cmpchk{font-weight:500}
:is(.drow,.drow.top) .card-toggles .ctgl-body{flex-basis:100%;margin:0 0 12px;background:var(--bg);border-radius:10px;padding:8px 16px}
@media(max-width:700px){
  .drow .card-toggles{column-gap:12px;padding:0 12px;justify-content:space-between}
  :is(.drow,.drow.top) .card-toggles .ctgl,.drow .card-toggles .cmpchk{font-size:14px;min-height:44px}
  .drow .card-toggles .ctgl{gap:4px}
  .drow .card-toggles .cmpchk{margin-left:0}
  :is(.drow,.drow.top) .card-toggles .ctgl-body{padding:6px 14px}
}
@media(max-width:420px){
  .drow .card-toggles{justify-content:flex-start;column-gap:20px}
  .drow .card-toggles .cmpchk{flex-basis:100%;border-top:1px solid var(--bg)}
}