/* Privacyverklaring: een leeskolom met de inhoud ernaast, net als een artikel uit Langs de lijn maar zonder de lijn.
   Alleen tokens uit tokens.css. */
.pv-lees { display: grid; gap: 2rem; padding-block: clamp(2.5rem, 2rem + 2vw, 4rem); }
.pv-inhoud { padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: var(--radius-card); }
.pv-inhoud h2 { font-family: var(--font-body); font-size: .95rem; font-weight: 700; letter-spacing: 0; line-height: 1.4; }
.pv-inhoud ol { display: grid; gap: .3rem; margin-top: .5rem; padding-left: 1.2rem; font-size: .95rem; }
.pv-inhoud a { color: var(--link); text-underline-offset: .2em; }

.pv-tekst { max-width: 40rem; font-size: clamp(1.0625rem, 1rem + .2vw, 1.125rem); line-height: 1.65; }
.pv-tekst > * + * { margin-top: 1.1em; }
.pv-tekst h2 { margin-top: 2.4em; font-size: clamp(1.45rem, 1.25rem + .8vw, 1.9rem); line-height: 1.15; scroll-margin-top: calc(var(--header-h, 4.5rem) + 1rem); }
.pv-tekst > h2:first-child { margin-top: 0; }
.pv-tekst h3 { margin-top: 1.8em; font-size: 1.15rem; }
.pv-tekst :is(h2, h3) + * { margin-top: .6em; }
.pv-tekst ul { padding-left: 1.25em; }
.pv-tekst li + li { margin-top: .45em; }
.pv-tekst a { color: var(--link); text-underline-offset: .2em; }
.pv-tekst code { font-size: .9em; overflow-wrap: anywhere; }

/* Naam en uitleg onder elkaar, vanaf een tablet naast elkaar */
.pv-lijst { border-top: 1px solid var(--border); }
.pv-lijst > div { display: grid; gap: .15rem 1.5rem; padding-block: .85rem; border-bottom: 1px solid var(--border); }
.pv-lijst dt { font-weight: 700; color: var(--heading); }
@media (min-width: 40em) {
  .pv-lijst > div { grid-template-columns: 11rem minmax(0, 1fr); }
}

/* Op een breed scherm staat de inhoud rechts naast de tekst en blijft hij staan onder de vaste kop */
@media (min-width: 64em) {
  .pv-lees { grid-template-columns: minmax(0, 40rem) 1fr; column-gap: clamp(2rem, 4vw, 4rem); }
  .pv-inhoud { grid-column: 2; grid-row: 1; align-self: start; position: sticky; top: calc(var(--header-h, 4.5rem) + 1.75rem); justify-self: end; max-width: 17rem; }
  .pv-tekst { grid-column: 1; grid-row: 1; }
}

/* Dit is een concept. De melding en de open punten in de tekst blijven zichtbaar, ook als de prototypebalk de open
   punten verbergt: zonder die punten leest de verklaring als af (lege velden, of "je kunt downloaden" zonder dat het
   nog kan), en dat mag een juridische tekst niet doen. */
html[data-todo="hidden"] :is(.pv-concept, .pv-tekst .todo) { display: inline; }

@media print {
  .pv-inhoud { display: none; }
  .pv-lees { display: block; }
}