/* ===== Products: comparison matrix (products = columns) ===== */
.pm { min-width: 0; max-width: 100%; }
.pm-scroll { position: relative; /* contain the absolutely-positioned .screen-reader-text spans */ max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--bg-elev); }
.pm-table { width: 100%; border-collapse: collapse; min-width: 520px; }
.pm-table th, .pm-table td { padding: 12px 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.pm-table tbody th { position: sticky; left: 0; z-index: 1; background: var(--bg-elev); font-weight: 600; color: var(--muted); white-space: nowrap; min-width: 150px; }
.pm-table tbody tr:last-child th, .pm-table tbody tr:last-child td { border-bottom: 0; }

.pm-head { min-width: 190px; vertical-align: bottom; }
.pm-img { display: block; width: 100%; max-width: 220px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-sm); border: 1px solid var(--line); margin-bottom: 10px; background: var(--bg); }
.pm-img--empty { background: repeating-linear-gradient(45deg, var(--bg), var(--bg) 8px, var(--line) 8px, var(--line) 9px); }
.pm-name { display: block; font-family: var(--font-head); font-weight: 800; font-size: 18px; color: var(--ink); }
.pm-model { display: block; font-size: 13px; color: var(--muted); }

.pm-table td.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.pm-price td { font-weight: 800; color: var(--ink); }
.pm-quote { font-weight: 700; color: var(--green); }
.pm-check { font-weight: 800; }
.pm-check.is-yes { color: var(--green); }
.pm-check.is-no { color: var(--muted); font-weight: 400; }
.pm-inc--market th, .pm-inc--market td { border-top: 2px solid var(--line); }
.pm-docs[hidden] { display: none; }
.pm-docs a { font-weight: 600; color: var(--green); }

.pm-actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); }

@media (max-width: 600px) {
  .pm-table th, .pm-table td { padding: 10px 12px; }
  .pm-table tbody th { min-width: 120px; white-space: normal; }
  .pm-head { min-width: 150px; }
}