/* Partnerpagina: aanvullend op gedeeld/stijl.css (zelfde kleuren, licht/donker volgt het apparaat). */
.balk { display: flex; justify-content: center; padding: calc(14px + env(safe-area-inset-top)) 16px 10px;
  border-bottom: 1px solid var(--lijn); background: var(--kaart); }
.wordmark { display: block; height: 28px; width: auto; }
@media (prefers-color-scheme: dark) { .wordmark { filter: invert(1) hue-rotate(180deg); } }
#inhoud { max-width: 640px; }
.merk-blok { display: flex; align-items: center; gap: 14px; margin: 8px 0 18px; }
.merk-blok img { width: 64px; height: 64px; object-fit: contain; border-radius: 12px; background: #fff; padding: 4px; }
.merk-blok .sub { margin: 0; }
.checklist { margin: 0; padding: 0; list-style: none; }
.checklist li { padding: 8px 0 8px 30px; border-top: 1px solid var(--lijn); position: relative; }
.checklist li:first-child { border-top: 0; }
.checklist li::before { content: "✓"; position: absolute; left: 4px; color: var(--groen); font-weight: 700; }
.voortgang { margin: 4px 0 14px; }
.voortgang .balkje { height: 6px; border-radius: 3px; background: var(--lijn); overflow: hidden; margin-top: 6px; }
.voortgang .balkje span { display: block; height: 100%; background: var(--accent); transition: width .2s; }
.nav-knoppen { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 18px; }
.nav-knoppen .alleen { grid-column: 1 / -1; }
.contact { color: var(--zacht); font-size: 14px; margin-top: 22px; text-align: center; }
.contact a { color: var(--tekst); }

/* Tekenpagina (fase 4c): leesversie van de overeenkomst en "Zo werkt het", handtekeningvak. */
.lees { font-size: 15px; line-height: 1.5; }
.lees h2 { font-size: 18px; }
.lees p { margin: 0 0 10px; }
.lees .lees-midden { text-align: center; }
.lees .lees-hangend { padding-left: 1.8em; text-indent: -1.8em; }
.lees .lees-tab { display: inline-block; width: 1em; text-indent: 0; }
.lees ul { margin: 4px 0 12px; padding-left: 1.3em; }
.lees li { margin-bottom: 4px; }
.lees-tabel { width: 100%; border-collapse: collapse; margin: 6px 0 14px; font-size: 14px; }
.lees-tabel td { border: 1px solid var(--lijn); padding: 6px 8px; vertical-align: top; overflow-wrap: break-word; }
.lees-tabel td:first-child { width: 42%; }
.lees-plek, .lees-handtekening { color: var(--zacht); font-style: italic; }
.pdf-link { font-weight: 600; color: var(--tekst); }
.handtekening-vak { display: block; width: 100%; height: 180px; margin: 6px 0 8px; border: 1px dashed var(--zacht);
  border-radius: 12px; background: #fff; touch-action: none; cursor: crosshair; }
.vink-regel span { font-weight: 500; }
.uitleg-tb { margin: -2px 0 8px 32px; }
.vink-regel { align-items: flex-start; }
.lees-doc h2, .lees-doc h3 { font-size: 16px; font-weight: 700; color: var(--tekst); text-transform: none; letter-spacing: 0;
  margin: 18px 0 8px; }

/* Onboarding-planner (#o=): dagen en tijden als pillen, zelfde keuzeknoppen als het formulier. */
.pillen { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
.pillen[data-wat="tijd"] { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); }
.pillen button { padding: 0 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pillen + .label { margin-top: 18px; }
.plan-lijst { list-style: none; margin: 0 0 18px; padding: 0; font-weight: 600; }
.plan-lijst li { padding: 6px 0; }
.afronden .plan-lijst { font-size: 17px; }
.kaart .plan-lijst { margin: 0; }
.knop-link { display: block; text-align: center; text-decoration: none; box-sizing: border-box; }
