/* Prijzenpagina. Kleuren komen uit het palet bovenin site.css. */

.pr-blok{max-width:var(--maat);margin:0 auto;padding:clamp(30px,4vw,54px) var(--gutter) 0}

/* Vijf kolommen passen op een telefoon niet naast elkaar. De tabel schuift dan
   in zijn eigen vakje, zodat de pagina zelf niet openbreekt. */
.pr-tabelwrap{overflow-x:auto;border:1px solid var(--lijn);border-radius:8px;background:var(--vlak)}
.pr-tabel{border-collapse:collapse;width:100%;min-width:620px;font-size:16px}
.pr-tabel th,.pr-tabel td{text-align:left;padding:14px clamp(12px,1.6vw,18px);
  border-bottom:1px solid var(--lijn-fijn);vertical-align:top}
.pr-tabel thead th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--inkt-vaag);font-weight:600;background:var(--grond);white-space:nowrap}
.pr-tabel tbody th{font-weight:600;letter-spacing:-.015em;white-space:nowrap}
.pr-tabel tbody td:nth-child(2),.pr-tabel tbody td:nth-child(3){font-weight:700;white-space:nowrap}
.pr-tabel tbody td:nth-child(4),.pr-tabel tbody td:nth-child(5){color:var(--inkt-zacht);font-size:14px}
.pr-tabel tbody tr:last-child th,.pr-tabel tbody tr:last-child td{border-bottom:0}
/* de bundels staan onder een dikkere lijn, zodat je ziet dat het een andere soort rij is */
.pr-tabel tbody tr.pr-bundel:first-of-type th{border-top:2px solid var(--lijn)}
.pr-tabel tbody tr.pr-bundel th{font-weight:500;color:var(--inkt-zacht);white-space:normal}
.pr-btw{margin-top:12px;font-size:14px;color:var(--inkt-vaag)}
.pr-scan{margin-top:22px;padding:16px 18px;border-left:3px solid var(--accent-vlak);background:var(--accent-zacht);font-size:16px;line-height:1.55;color:var(--inkt);max-width:66ch;border-radius:0 6px 6px 0}
.pr-scan a{color:var(--accent);font-weight:600;border-bottom:1px solid currentColor}

.pr-uitleg{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.4vw,44px)}
@media(max-width:760px){.pr-uitleg{grid-template-columns:1fr;gap:26px}}
.pr-kolom h2{font-size:19px;letter-spacing:-.022em;margin-bottom:9px}
.pr-kolom p{font-size:16px;line-height:1.62;color:var(--inkt-zacht);max-width:56ch}

.pr-niet{background:var(--grond-diep);border-radius:8px;padding:clamp(22px,3vw,32px)}
.pr-niet h2{font-size:19px;letter-spacing:-.022em;margin-bottom:14px}
.pr-niet ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.pr-niet li{font-size:16px;line-height:1.6;color:var(--inkt-zacht);
  padding-left:20px;position:relative;max-width:70ch}
.pr-niet li::before{content:"—";position:absolute;left:0;color:var(--accent)}

/* het slot: één kolom tekst, op de lichte grond in de kleuren van het palet */
.pr-slot{grid-template-columns:minmax(0,1fr)}
.pr-slot .demo-slot-tekst>p{color:var(--inkt-zacht)}
.pr-slot h2{max-width:22ch}

/* Drie korte kolommen passen op een telefoon wél naast elkaar, als de koppen mogen afbreken. */
@media(max-width:600px){
  .pr-tabel{min-width:0;font-size:14px}
  .pr-tabel th,.pr-tabel td,.pr-tabel tbody th,.pr-tabel tbody td:nth-child(2),.pr-tabel tbody td:nth-child(3){white-space:normal;padding:12px 10px}
  .pr-tabel thead th{white-space:normal}
}