/* Tekstpagina's (privacy, voorwaarden, handleiding): zelfde look als de startpagina, enkel licht, goed afdrukbaar */
@font-face{font-family:Poppins;font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/Poppins-Regular.woff) format('woff')}
@font-face{font-family:Poppins;font-weight:500;font-style:normal;font-display:swap;src:url(/fonts/Poppins-Medium.woff) format('woff')}
@font-face{font-family:Poppins;font-weight:600;font-style:normal;font-display:swap;src:url(/fonts/Poppins-SemiBold.woff) format('woff')}
:root{
  color-scheme:light;
  --font:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --bg:#F4F6F8; --ink:#18212B; --ink-2:#45505E; --ink-3:#6B7584; --ink-4:#A9B1BD;
  --card:rgba(255,255,255,.7); --hair:rgba(23,32,48,.09); --accent:#23935F; --warn:#C2410C; --t-warn:rgba(226,122,46,.12); --t-accent:rgba(35,147,95,.12);
}
body::before{content:"";position:fixed;inset:-10%;z-index:-1;pointer-events:none;filter:blur(20px);background:
  radial-gradient(38% 42% at 12% 8%, rgba(67,196,134,.22), transparent 70%),
  radial-gradient(34% 40% at 92% 6%, rgba(96,165,250,.20), transparent 70%),
  radial-gradient(40% 46% at 70% 96%, rgba(167,139,250,.16), transparent 70%),
  radial-gradient(30% 36% at 4% 92%, rgba(253,186,116,.16), transparent 70%)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:16.5px;line-height:1.6;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
a{color:var(--accent)}
:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:6px}
.doc{max-width:760px;margin:0 auto;padding:18px 16px calc(40px + env(safe-area-inset-bottom))}
.doc__top{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.doc__top{position:sticky;top:10px;z-index:5;padding:8px 10px 8px 10px;border-radius:20px;min-height:56px;background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(16,24,40,.04),0 10px 30px -12px rgba(16,24,40,.16)}
.doc__mark{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.7);box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),0 2px 6px -2px rgba(16,24,40,.06);border:0!important}
.doc__top b{font-weight:600}
.doc__top a{font-size:14px;color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--hair)}
.doc__top span{flex:1}
h1{font-size:28px;line-height:1.15;font-weight:600;letter-spacing:-.02em;margin:22px 0 4px}
h2{font-size:18px;font-weight:600;margin:30px 0 6px;letter-spacing:-.01em}
h3{font-size:16.5px;font-weight:600;margin:18px 0 4px}
p{margin:8px 0}
ul,ol{margin:8px 0;padding-left:22px}
li{margin:4px 0}
.lead{color:var(--ink-3);margin-top:4px}
.meta{font-size:13.5px;color:var(--ink-3)}
.card{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(16,24,40,.04),0 10px 30px -12px rgba(16,24,40,.16);border-radius:16px;padding:14px 16px;margin:12px 0}
.warn{background:linear-gradient(135deg,rgba(255,237,213,.9),rgba(254,215,170,.55));border-color:transparent;box-shadow:inset 0 0 0 1px rgba(251,146,60,.18);color:#7C2D12}
table{width:100%;border-collapse:collapse;font-size:15px;margin:10px 0;background:var(--card);border:1px solid var(--hair);border-radius:12px;overflow:hidden}
th,td{padding:9px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--hair)}
th{font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-4);background:rgba(255,255,255,.6)}
tr:last-child td{border-bottom:0}
@media (max-width:620px){table,thead,tbody,tr,th,td{display:block}thead{display:none}td{border-bottom:0;padding:3px 12px}tr{border-bottom:1px solid var(--hair);padding:8px 0}tr:last-child{border-bottom:0}td::before{content:attr(data-k);display:block;font-size:12px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em}}
.steps{counter-reset:s;list-style:none;padding:0}
.steps li{counter-increment:s;position:relative;padding:8px 0 8px 40px;border-bottom:1px solid var(--hair)}
.steps li:last-child{border-bottom:0}
.steps li::before{content:counter(s);position:absolute;left:0;top:8px;width:28px;height:28px;border-radius:50%;background:var(--t-accent);color:var(--accent);font-weight:600;font-size:14px;display:grid;place-items:center}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.tabs a{padding:7px 12px;border-radius:11px;background:#fff;border:0;box-shadow:0 1px 1px rgba(16,24,40,.03),0 2px 6px -2px rgba(16,24,40,.06),0 0 0 1px var(--hair);text-decoration:none;color:var(--ink-2);font-size:14px}
.foot{margin-top:34px;font-size:13.5px;color:var(--ink-3);text-align:center}
.foot a{color:var(--ink-2);margin:0 6px}
.foot__maker{margin:10px 0 0;line-height:1.6}
.foot a.foot__in{margin:0}
.printbtn{font:inherit;font-size:13.5px;font-weight:500;min-height:36px;padding:0 14px;border-radius:11px;border:0;background:#fff;box-shadow:0 2px 6px -2px rgba(16,24,40,.06),0 0 0 1px var(--hair);cursor:pointer;color:var(--ink)}
/* touch: tabs and buttons 44px, small text links get a bigger invisible hit area */
@media (pointer:coarse){
  .tabs a,.printbtn{min-height:44px;display:inline-flex;align-items:center}
  .doc__top a,.foot a{position:relative}
  .doc__top a:not(.doc__mark)::after,.foot a::after{content:"";position:absolute;inset:-12px -4px}
  .doc__mark::after{content:"";position:absolute;inset:-4px}
}
@media print{
  body{background:#fff;font-size:11.5pt}
  body::before{display:none}
  .doc__top{position:static;box-shadow:none;border:0;background:none}
  .doc{max-width:none;padding:0}
  .doc__top a:not(.doc__mark),.printbtn,.tabs,.foot{display:none}
  .doc__mark{background:none;box-shadow:none}
  .card,table{border-color:#bbb;background:#fff}
  .pb{page-break-before:always}
  h2,h3{page-break-after:avoid}
  .role{page-break-inside:avoid}
}
/* handleiding: a screenshot with orange letters and its legend; the full text folds under In woorden */
.shot{margin:14px 0 18px;display:grid;gap:12px}
.shot img{display:block;width:100%;height:auto;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--hair),0 10px 30px -14px rgba(16,24,40,.25)}
.shot--phone{grid-template-columns:minmax(0,1fr)}
.shot--phone img{max-width:300px;margin:0 auto}
@media (min-width:620px){.shot--phone{grid-template-columns:280px minmax(0,1fr);align-items:start;gap:22px}.shot--phone img{margin:0}}
.legend{counter-reset:n;list-style:none;margin:0;padding:0;display:grid;gap:6px 18px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.shot--phone .legend{grid-template-columns:minmax(0,1fr)}
.legend li{counter-increment:n;position:relative;margin:0;padding:3px 0 3px 36px}
.legend li::before{content:counter(n,upper-alpha);position:absolute;left:0;top:2px;width:26px;height:26px;border-radius:50%;background:#EA580C;color:#fff;font-weight:700;font-size:13.5px;display:grid;place-items:center}
.legend b{display:block;color:var(--ink);font-weight:600}
.words{margin:8px 0 0;border-top:1px solid var(--hair);padding-top:6px}
.words>summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--ink-2);padding:8px 0;list-style-position:inside}
.words>summary:hover{color:var(--ink)}
@media print{
  .shot{break-inside:avoid}
  .shot--phone img{max-width:62mm}
  .words>summary{display:none}
}
