/* ════════════════════════════════════════════════════════════
   Preise-Seite — Vergleichstabelle (offizielles Design)
   Quelle: Referenz-Mockup 12_preise.html, 2026-05-25.
   Hero, Individuell, FAQ liegen in static.css. Diese Datei
   stylet ausschließlich die Vergleichstabelle inkl. Plan-Köpfe.
   ════════════════════════════════════════════════════════════ */

.billing-toggle-wrap {
    display: flex;
    justify-content: center;
    max-width: 1240px;
    margin: 0 auto 2.2rem;
}
.billing-toggle {
    display: inline-flex;
    background: rgba(27,42,63,0.05);
    border: 1px solid rgba(27,42,63,0.10);
    border-radius: 999px;
    padding: 4px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6);
}
.bt-opt {
    border: none; background: transparent;
    padding: 0.62rem 1.35rem;
    font: 600 0.86rem var(--font);
    color: var(--mute);
    cursor: pointer;
    border-radius: 999px;
    transition: background 0.2s, color 0.2s, box-shadow 0.2s;
    display: inline-flex; align-items: center; gap: 0.55rem;
}
.bt-opt:hover { color: var(--navy); }
.bt-opt.is-active {
    background: var(--navy);
    color: #fff;
    box-shadow: 0 6px 14px -6px rgba(20,40,64,0.4);
}
.bt-opt.is-active:hover { color: #fff; }
.bt-save {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #15a04a;
    background: rgba(31,200,90,0.18);
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
}
.bt-opt.is-active .bt-save {
    background: rgba(31,200,90,0.28);
    color: #fff;
}

.preise-table-wrap {
    padding: 4.5rem 5% 6rem;
}
.ptable-card {
    max-width: 1240px;
    margin: 0 auto;
    background: linear-gradient(180deg, #FFFFFF 0%, #FAFBFD 100%);
    border: 1px solid rgba(27,42,63,0.12);
    border-radius: var(--r-xl);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.95),
        0 1px 2px rgba(20,40,64,0.04),
        0 16px 36px -16px rgba(20,40,64,0.18),
        0 44px 84px -32px rgba(20,40,64,0.32);
    overflow: hidden;
}
@media (max-width: 960px) {
    .ptable-card { overflow-x: auto; }
}
.ptable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-feature-settings: 'tnum';
    min-width: 760px;
}

/* Plan header */
.ptable thead th {
    text-align: left;
    padding: 2.4rem 1.6rem 1.8rem;
    vertical-align: top;
    background: transparent;
    font-weight: 400;
    border-bottom: 1px solid var(--border);
    border-right: 1px solid var(--border-2);
    width: 25%;
    /* #238: height:1px wirkt in Tabellenzellen als min-height und lässt
       height:100% der .ptp-body auf die volle Zeilenhöhe auflösen —
       erst damit pinnt .ptp-foot (margin-top:auto) in ALLEN Spalten
       bündig nach unten, egal wie lang die Texte darüber umbrechen. */
    height: 1px;
}
.ptable thead th:last-child { border-right: none; }
.ptable thead th:first-child {
    width: 25%;
    padding: 2.8rem 1.9rem 2rem;
    background: var(--offwhite-2);
    border-right: 1px solid var(--border-2);
    vertical-align: top;
}
.ptable-intro .eyebrow {
    margin-bottom: 1rem;
    font-size: 0.7rem;
}
.ptable-intro h3 {
    font: 800 1.45rem/1.18 var(--font);
    letter-spacing: -0.035em;
    color: var(--navy);
    margin: 0 0 0.9rem;
    text-wrap: balance;
}
.ptable-intro p {
    font-size: 0.88rem;
    color: var(--mute);
    line-height: 1.55;
    margin: 0;
    text-wrap: pretty;
}
.ptp-body {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 380px;
}
.ptp-badge-slot {
    min-height: 0;          /* kollabiert wenn Empfohlen aus; expand bei show-empfohlen */
    margin-bottom: 0;
    display: block;
}
.ptp-foot {
    margin-top: auto;
    padding-top: 0.6rem;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.9rem;
}
.ptp-foot .ptp-limit { margin: 0;
                       /* Patrick 2026-06-11: Pill exakt so breit wie der
                          Button darunter — gleiche Kante, ruhigeres Bild. */
                       align-self: stretch;
                       box-sizing: border-box;
                       text-align: center;
                       white-space: nowrap; /* #238: einzeilig — sonst
                       brechen schmale Spalten um und die Pills sitzen
                       auf verschiedenen Höhen */ }
.ptp-foot .ptp-btn { margin: 0; }
/* Standard: kein Highlight auf der Business-Spalte.
   Aktivieren: <table class="ptable show-empfohlen"> — alle Empfohlen-Styles weiter unten. */
.ptp-badge {
    display: none;          /* nur sichtbar bei .ptable.show-empfohlen */
    font: 700 0.62rem/1 var(--font);
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #fff;
    background: var(--navy);
    padding: 0.4rem 0.75rem;
    border-radius: 999px;
    margin: 0;
}
.ptp-name {
    font: 700 0.78rem/1 var(--font);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mid);
    margin-bottom: 1rem;
}
/* .ptp-name Farb-Override bei show-empfohlen weiter unten */
.ptp-price {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    color: var(--navy);
    margin-bottom: 0.3rem;
}
.ptp-num {
    font-size: 2.8rem;
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 1;
}
.ptp-unit { font-size: 0.86rem; color: var(--mute); font-weight: 500; }
/* min-height: 2 Zeilen reservieren (#238) — der Jahres-Text bricht je
   nach Preis-Länge auf 1–2 Zeilen um; ohne Reservierung rutschen die
   "Kostenlos starten"-Buttons der Spalten auf verschiedene Höhen. */
.ptp-jahres { font-size: 0.78rem; color: var(--mute); margin-bottom: 1rem;
              line-height: 1.45; min-height: 2.9em; }
.ptp-sparen { color: #1FC85A; font-weight: 700; }
.ptp-sub {
    font-size: 0.86rem;
    color: var(--ink-2);
    line-height: 1.5;
    margin: 0 0 1rem;
    min-height: 2.6em;
}
.ptp-limit {
    /* Patrick 2026-06-11: Artikel-Kontingent ist DAS Vergleichskriterium —
       Pill deutlich hervorheben (Sky-Fläche, Navy-Kante, große Zahl). */
    font-size: 0.78rem;
    color: var(--ink-2);
    padding: 0.6rem 0.75rem;
    background: rgba(27,58,92,0.07);
    border: 1.5px solid rgba(27,58,92,0.35);
    border-radius: var(--r);
    display: inline-block;
    margin-bottom: 1.1rem;
}
.ptp-limit strong {
    color: var(--navy);
    font-weight: 800;
    font-size: 1.18rem;
    font-feature-settings: 'tnum';
    letter-spacing: -0.01em;
}
/* #33: Nachkauf-Hinweis direkt unter der Limit-Pill — nimmt dem Interessenten
   die "reicht mein Volumen?"-Angst genau dort, wo sie entsteht. */
.ptp-nachkauf {
    font-size: 0.72rem;
    color: var(--ink-2);
    opacity: 0.75;
    margin: -0.65rem 0 1.1rem;
}
/* .ptp-limit Override bei show-empfohlen weiter unten */
.ptp-btn {
    width: 100%;
    /* Ohne border-box: 100% + 2×1rem Padding = ~29px Überstand nach rechts —
       Buttons ragten aus ihren Tarif-Spalten (Patrick-Screenshot 2026-06-11). */
    box-sizing: border-box;
    justify-content: center;
    border-radius: var(--r);
    padding: 0.85rem 1rem;
    font-size: 0.92rem;
}

/* Body rows */
.ptable tbody th,
.ptable tbody td {
    padding: 0.85rem 1.5rem;
    border-bottom: 1px solid var(--border-2);
    vertical-align: middle;
    font-size: 0.9rem;
}
.ptable tbody th {
    text-align: left;
    font-weight: 500;
    color: var(--ink);
}
.ptable tbody td {
    text-align: center;
    color: var(--ink-2);
    border-right: 1px solid var(--border-2);
}
.ptable tbody th { border-right: 1px solid var(--border-2); }
.ptable tbody td:last-child { border-right: none; }
/* tbody-Highlight bei show-empfohlen weiter unten */
.ptable tbody tr:last-child th,
.ptable tbody tr:last-child td {
    border-bottom: none;
}

/* Section header row */
.ptr-section th {
    font: 700 0.7rem/1 var(--font) !important;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mid);
    padding-top: 1.7rem !important;
    padding-bottom: 0.7rem !important;
    background: var(--offwhite-2);
    border-top: 1px solid var(--border-2);
    border-bottom: 1px solid var(--border) !important;
}
.ptable tbody tr:first-child.ptr-section th { border-top: none; }

/* Hint subtle */
.ptc-hint {
    display: block;
    font-size: 0.76rem;
    color: var(--mute);
    font-weight: 400;
    margin-top: 0.2rem;
    line-height: 1.4;
}

/* Checkmark and dash */
.ic-check {
    display: inline-block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: #1FC85A;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'><path d='M2 5.2 L4.4 7.6 L8 3.4' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 70%;
    vertical-align: middle;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 1px 2px rgba(31,200,90,0.35);
}
.ic-none {
    display: inline-block;
    width: 22px;
    color: var(--soft);
    font-weight: 700;
    font-size: 1.05rem;
    line-height: 1;
    vertical-align: middle;
}
.v-text {
    font-weight: 700;
    color: var(--navy);
    font-size: 0.92rem;
}

/* ════════════════════════════════════════════════════════════
   EMPFOHLEN-FRAME — Toggle
   Aktivieren: <table class="ptable show-empfohlen">
   Deaktivieren: <table class="ptable"> (Standard)
   Wirkt: Pill sichtbar, Spalte komplett gerahmt, Button auf Primary.
   ════════════════════════════════════════════════════════════ */
.ptable.show-empfohlen .ptp-badge { display: inline-block; }
.ptable.show-empfohlen .ptp-badge-slot {
    min-height: 1.9rem;
    margin-bottom: 0.65rem;
}
.ptable.show-empfohlen thead .empfohlen {
    background: linear-gradient(180deg, rgba(27,58,92,0.09), rgba(27,58,92,0.13));
    border-top: 2px solid var(--navy);
    border-left: 2px solid var(--navy);
    border-right: 2px solid var(--navy);
    border-top-left-radius: var(--r-lg);
    border-top-right-radius: var(--r-lg);
}
.ptable.show-empfohlen thead .empfohlen .ptp-name { color: var(--navy); }
.ptable.show-empfohlen thead .empfohlen .ptp-limit {
    background: rgba(255,255,255,0.85);
    border-color: rgba(27,58,92,0.35); /* gleiche Kanten-Stärke wie Basis-Pill */
}
.ptable.show-empfohlen thead .empfohlen .ptp-btn {
    background: var(--navy);
    color: #fff;
    border: 1px solid var(--navy);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 6px 14px -8px rgba(20,40,64,0.4);
}
.ptable.show-empfohlen thead .empfohlen .ptp-btn:hover {
    background: var(--navy-2);
    border-color: var(--navy-2);
    transform: translateY(-1px);
}
.ptable.show-empfohlen tbody td.empfohlen {
    background: linear-gradient(180deg, rgba(27,58,92,0.045), rgba(27,58,92,0.07));
    border-left: 2px solid var(--navy);
    border-right: 2px solid var(--navy);
}
.ptable.show-empfohlen tbody tr:last-child td.empfohlen {
    border-bottom: 2px solid var(--navy);
    border-bottom-left-radius: var(--r-lg);
    border-bottom-right-radius: var(--r-lg);
}

/* ════════════════════════════════════════════════════════════
   4-Spalten-Modus (Starter / Business / Business+ / Pro)
   Pricing-Refresh Task #99 (2026-05-26)
   ════════════════════════════════════════════════════════════ */
.ptable-4col { min-width: 980px; }
.ptable-4col thead th { width: 20%; padding: 2.4rem 1.15rem 1.7rem; }
.ptable-4col thead th:first-child { width: 20%; padding: 2.8rem 1.6rem 2rem; }
.ptable-4col .ptp-num { font-size: 2.4rem; }
.ptable-4col .ptp-name { font-size: 1.1rem; }
.ptable-4col .ptp-sub { min-height: 3.2em; font-size: 0.82rem; }
.ptable-4col .ptp-jahres { font-size: 0.74rem; }
.ptable-4col .ptp-limit { font-size: 0.74rem; padding: 0.5rem 0.65rem; }
/* Zahl bleibt auch in der 4-Spalten-Variante groß — sie ist DAS
   Vergleichskriterium (Patrick 2026-06-11). */
.ptable-4col .ptp-limit strong { font-size: 1.08rem; }
.ptable-4col .ptp-btn { padding: 0.78rem 0.85rem; font-size: 0.86rem; }
.ptable-4col tbody th,
.ptable-4col tbody td { padding: 0.78rem 1.05rem; font-size: 0.86rem; }
.ptable-4col tbody th { padding-left: 1.5rem; }
.ptable-4col .ptc-hint { font-size: 0.72rem; }
@media (max-width: 1080px) {
    .ptable-card { overflow-x: auto; }
}

/* ════════════════════════════════════════════════════════════
   Use-Case-Helper (vor der Tabelle) — visueller Refresh Task #100
   Karten sind klickbare <a>, mit Tier-Akzent-Farbe oben, Empfohlen-
   Highlight auf .helper-card-empfohlen, dezentem Gradient + Hover-Lift.
   ════════════════════════════════════════════════════════════ */
.preise-helper {
    padding: 1.2rem 5% 3rem;
}
.preise-helper-inner {
    max-width: 1240px;
    margin: 0 auto;
    background: linear-gradient(180deg, #FFFFFF 0%, var(--offwhite-2) 100%);
    border: 1px solid var(--border-2);
    border-radius: var(--r-xl);
    padding: 2.4rem 2.4rem 2.6rem;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.95),
        0 1px 2px rgba(20,40,64,0.04),
        0 14px 30px -22px rgba(20,40,64,0.22);
}
.helper-head {
    text-align: center;
    margin-bottom: 1.8rem;
}
.helper-head .eyebrow {
    font-size: 0.7rem;
    color: var(--mid);
    display: block;
    margin-bottom: 0.45rem;
    letter-spacing: 0.2em;
}
.helper-head h2 {
    font: 800 1.5rem/1.2 var(--font);
    color: var(--navy);
    letter-spacing: -0.03em;
    margin: 0 0 0.45rem;
    text-wrap: balance;
}
.helper-sub {
    font-size: 0.85rem;
    color: var(--mute);
    margin: 0;
}
.helper-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}
@media (max-width: 900px) {
    .helper-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
}

/* ── Karte als klickbarer Block ────────────────────────────── */
.helper-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    background: #FFFFFF;
    border: 1px solid var(--border-2);
    border-radius: var(--r-lg);
    padding: 1.4rem 1.3rem 1.3rem;
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
/* Tier-Akzent-Streifen oben (CSS-Variable wird pro Tier gesetzt) */
.helper-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--tier-color, var(--navy));
    opacity: 0.85;
    transition: height .18s ease, opacity .18s ease;
}
.helper-card:hover {
    transform: translateY(-3px);
    border-color: var(--tier-color, var(--navy));
    box-shadow: 0 14px 32px -18px rgba(20,40,64,0.32);
}
.helper-card:hover::before {
    height: 5px;
    opacity: 1;
}

/* Tier-spezifische Akzent-Farben — subtil unterschiedlich */
.helper-card[data-tier="starter"]       { --tier-color: #6B8E9E; }   /* gedeckt-blau */
.helper-card[data-tier="business"]      { --tier-color: #1B3A5C; }   /* navy (Primary) */
.helper-card[data-tier="business_plus"] { --tier-color: #2E7D6D; }   /* gedämpft-grün */
.helper-card[data-tier="professional"]  { --tier-color: #8A6D3B; }   /* gedämpft-gold */

/* Empfohlen-Highlight auf der Business-Karte */
.helper-card-empfohlen {
    background: linear-gradient(180deg, rgba(27,58,92,0.04) 0%, #FFFFFF 60%);
    border-color: rgba(27,58,92,0.28);
}
.helper-badge-slot { margin-bottom: 0.55rem; }
.helper-badge {
    display: inline-block;
    font: 700 0.6rem/1 var(--font);
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #fff;
    background: var(--navy);
    padding: 0.32rem 0.65rem;
    border-radius: 999px;
}

/* Icon-Block (oben, dezent, Tier-Farbe) */
.helper-icon {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r);
    background: rgba(27,42,63,0.04);
    color: var(--tier-color, var(--navy));
    margin-bottom: 0.85rem;
    transition: background .18s ease;
}
.helper-icon svg { width: 22px; height: 22px; }
.helper-card:hover .helper-icon {
    background: rgba(27,42,63,0.09);
}

/* Persona-Label (oben, klein, kursiv-feel über Spacing) */
.helper-persona {
    font: 600 0.7rem/1.3 var(--font);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--mute);
    margin-bottom: 0.55rem;
}

/* Lieferanten-Range — die "Zahl" */
.helper-num {
    font: 800 2.05rem/1 var(--font);
    color: var(--navy);
    letter-spacing: -0.045em;
    margin-bottom: 0.15rem;
    font-feature-settings: 'tnum';
}
.helper-label {
    font-size: 0.82rem;
    color: var(--mute);
    margin-bottom: 0.95rem;
    font-weight: 500;
}

/* Trennlinie zwischen Zahl-Block und USP-Block */
.helper-divider {
    width: 32px;
    height: 1px;
    background: var(--border-2);
    margin-bottom: 0.9rem;
}

/* USP-Text */
.helper-usp {
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--ink-2);
    margin-bottom: 1.1rem;
    flex-grow: 1;
}

/* CTA-Pfeil unten */
.helper-cta {
    font: 700 0.85rem/1 var(--font);
    color: var(--navy);
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.helper-arrow {
    display: inline-block;
    transition: transform .18s ease;
}
.helper-card:hover .helper-arrow { transform: translateX(3px); }

/* ════════════════════════════════════════════════════════════
   Klartext-Sektion (Hive, GPSR, Branchen-Packs)
   ════════════════════════════════════════════════════════════ */
.preise-klartext {
    padding: 5rem 5% 4rem;
    /* Farbverlauf-Regel: Fläche blendet unten weich in den Seiten-Verlauf aus
       (endete vorher hart an der Enterprise-Sektion → sichtbare Trennlinie) */
    background: linear-gradient(180deg, transparent 0%, var(--offwhite) 40%, var(--offwhite) calc(100% - 130px), transparent 100%);
}
.klartext-inner {
    max-width: 1240px;
    margin: 0 auto;
}
.klartext-head {
    margin-bottom: 2.4rem;
}
.klartext-head .eyebrow {
    font-size: 0.7rem;
    color: var(--mid);
    display: block;
    margin-bottom: 0.45rem;
}
.klartext-head h2 {
    font: 800 1.85rem/1.18 var(--font);
    color: var(--navy);
    letter-spacing: -0.035em;
    margin: 0;
    text-wrap: balance;
}
.klartext-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
}
@media (max-width: 920px) {
    .klartext-grid { grid-template-columns: 1fr; }
}
.klartext-card {
    background: #FFFFFF;
    border: 1px solid var(--border-2);
    border-radius: var(--r-lg);
    padding: 1.8rem 1.8rem;
    box-shadow: 0 1px 2px rgba(20,40,64,0.04), 0 8px 22px -16px rgba(20,40,64,0.18);
}
.klartext-icon {
    font-size: 1.8rem;
    margin-bottom: 0.7rem;
    line-height: 1;
}
.klartext-card h3 {
    font: 800 1.1rem/1.25 var(--font);
    color: var(--navy);
    letter-spacing: -0.025em;
    margin: 0 0 0.7rem;
}
.klartext-card p {
    font-size: 0.9rem;
    line-height: 1.55;
    color: var(--ink-2);
    margin: 0 0 0.7rem;
    text-wrap: pretty;
}
.klartext-card p:last-child { margin-bottom: 0; }
.klartext-detail {
    background: var(--offwhite-2);
    border-left: 3px solid var(--navy);
    padding: 0.7rem 0.95rem;
    border-radius: 0 var(--r) var(--r) 0;
    font-size: 0.85rem !important;
}
.klartext-detail strong { color: var(--navy); }


/* ── Mini-Häkchen in den Tarif-Karten (Patrick 2026-06-11) ──────────
   Füllen den Leerraum zwischen Beschreibung und Artikel-Pill mit den
   3 entscheidenden Differenzierern pro Tarif — Vergleich ohne Scrollen. */
.ptp-mini {
    list-style: none;
    margin: 0 0 0.8rem;
    padding: 0;
    text-align: left;
}
.ptp-mini li {
    font-size: 0.8rem;
    color: var(--ink-2);
    line-height: 1.45;
    padding: 0.18rem 0 0.18rem 1.25rem;
    position: relative;
}
.ptp-mini li::before {
    content: "";
    position: absolute;
    left: 0; top: 0.42em;
    width: 0.72em; height: 0.72em;
    border-radius: 50%;
    background: rgba(31,200,90,0.16);
    /* Häkchen als Inline-SVG-Maske — kein Icon-Font nötig */
    -webkit-mask: none;
}
.ptp-mini li::after {
    content: "✓";
    position: absolute;
    left: 0.11em; top: 0.06em;
    font-size: 0.72em;
    font-weight: 800;
    color: #169648;
}

/* ── Sticky-Tarif-Leiste über der Vergleichstabelle ────────────────── */
.ptable-sticky {
    position: fixed;
    top: 0;
    z-index: 60;
    display: none;
    background: rgba(255,255,255,0.97);
    border-bottom: 1.5px solid var(--border-2, #e2e8f0);
    box-shadow: 0 8px 24px -16px rgba(27,42,63,0.35);
    border-radius: 0 0 12px 12px;
}
.ptable-sticky.is-visible { display: flex; }
.pts-cell {
    box-sizing: border-box;
    padding: 0.55rem 1rem;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    white-space: nowrap;
    overflow: hidden;
}
.pts-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mute, #6b7b8e);
    align-self: center;
}
.pts-name { font-weight: 800; font-size: 0.88rem; color: var(--ink, #1b2a3f); }
.pts-preis { font-weight: 700; font-size: 0.82rem; color: var(--navy, #1b3a5c); font-feature-settings: 'tnum'; }
.pts-empfohlen { background: rgba(27,58,92,0.06); }

/* ── Zeilen-Hover in der Vergleichstabelle ─────────────────────────── */
.ptable tbody tr:not(.ptr-section):hover th,
.ptable tbody tr:not(.ptr-section):hover td {
    background: rgba(27,58,92,0.035);
}