/* Paketvergleich „Alle Leistungen im Vergleich“ (it.html, audisys.html, #pakete), Logik in assets/paketvergleich.js.
   Nur Token-Variablen aus site.css/marke.css; alle Klassen mit Präfix .pv-. */
.pv { margin-top: clamp(1.5rem, 1.2rem + 1vw, 2.2rem); min-width: 0; }
.pv > summary { display: inline-flex; align-items: center; gap: .8rem; min-height: 44px; padding: .7rem 1.1rem; cursor: pointer; list-style: none;
  font-weight: 650; color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-strong); }
.pv > summary::-webkit-details-marker { display: none; }
.pv > summary::after { content: "+"; font-size: 1.3rem; line-height: 1; font-weight: 400; }
.pv[open] > summary::after { content: "–"; }
.pv > summary:hover { background: color-mix(in srgb, var(--ink) 8%, transparent); }
.pv-inhalt { display: grid; gap: 1rem; margin-top: 1.2rem; min-width: 0; }
.pv-inhalt > p { margin: 0; }

.pv-rahmen { position: relative; overflow-x: auto; min-width: 0; max-width: 100%; }  /* relative: .pv-vh bleibt im Scrollbereich */
.pv-rahmen:focus-visible { outline-offset: 0; }
.pv table { width: 100%; border-collapse: collapse; background: var(--surface); font-size: var(--step--1); line-height: 1.45; }
.pv caption { text-align: left; }
.pv th, .pv td { padding: .7rem .8rem; border-bottom: var(--hair, 1px) solid var(--line); text-align: left; vertical-align: top; font-weight: 400; }
.pv thead th { font-weight: 750; color: var(--head); border-bottom: 2px solid var(--line-strong); vertical-align: bottom; }
.pv thead th:nth-child(4) { box-shadow: inset 0 4px 0 var(--accent, var(--green)); }
.pv tbody th[scope="row"] { width: 40%; padding: 0; color: var(--ink); hyphens: auto; overflow-wrap: break-word; }
.pv td { width: 20%; overflow-wrap: break-word; }
.pv-gruppe th { padding-top: 1.3rem; font-size: var(--mono-lbl, .8rem); font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); background: var(--band, var(--paper-2)); }
.pv-ja { color: var(--accent-text, var(--cyan)); font-weight: 800; }
.pv-nein { color: var(--muted); }
.pv-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }

/* Erklärung je Leistung: die ganze Zelle ist klickbar */
.pv-info > summary { display: flex; justify-content: space-between; gap: .6rem; padding: .7rem .8rem; cursor: pointer; list-style: none; font-weight: 600; }
.pv-info > summary::-webkit-details-marker { display: none; }
.pv-info > summary::after { content: "+"; flex: none; color: var(--muted); font-weight: 400; transition: transform .15s; }
.pv-info[open] > summary::after { transform: rotate(45deg); }
.pv-info > summary:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.pv-info > summary:focus-visible { outline-offset: -3px; }
.pv-zeile { display: block; padding: .7rem .8rem; font-weight: 600; }
.pv-info p { margin: 0; padding: 0 .8rem .8rem; color: var(--muted); font-weight: 400; }
@media (prefers-reduced-motion: reduce) { .pv-info > summary::after { transition: none; } }

/* Umschalter (nur mit JavaScript, nur schmal) */
.pv-schalter { display: none; flex-wrap: wrap; gap: .5rem; }
.pv-knopf { font: inherit; font-size: var(--step--1); font-weight: 650; min-height: 44px; padding: .5rem .9rem; cursor: pointer; }

/* Ohne JavaScript: schmal scrollt nur die Tabelle */
@media (max-width: 640px) {
  .pv table { min-width: 34rem; }
  .pv-js .pv-schalter { display: flex; }
  .pv-js table { min-width: 0; table-layout: fixed; }
  .pv-js thead th:first-child, .pv-js tbody th[scope="row"] { width: 58%; }
  .pv-js thead th, .pv-js td { padding-left: .6rem; padding-right: .6rem; }
  .pv-js table[data-zeige="1"] tr > :nth-child(3), .pv-js table[data-zeige="1"] tr > :nth-child(4),
  .pv-js table[data-zeige="2"] tr > :nth-child(2), .pv-js table[data-zeige="2"] tr > :nth-child(4),
  .pv-js table[data-zeige="3"] tr > :nth-child(2), .pv-js table[data-zeige="3"] tr > :nth-child(3) { display: none; }
  .pv-js thead th:nth-child(4) { box-shadow: none; }
}