/* WMO Digitaal design system v3 — shared stylesheet for the secondary pages
   (privacy, accessibility, contact, 404).

   index.html and trust.html still carry their own inline CSS; they were built
   before this file existed and unifying them is a separate change with its own
   regression risk. Tokens below are copied verbatim from them, so the two
   stay visually identical.

   All font sizes are rem so the page honours the reader's own browser/OS font
   setting (docs/17 U1: 200% scaling). Paddings and tap targets stay px — a
   44px target must remain 44 physical px whatever the text scale. */
:root{
  --ink:#164E63; --ink-strong:#123B4A; --ink-2:#3A5762;
  --primary:#0E7490; --primary-text:#0C5A70; --green:#047857;
  --bg:#F6FBFC; --card:#FFFFFF; --line:#D3E4E9;
  --info-bg:#DFF1F6; --ok-bg:#D1FAE5; --ok-text:#065F46;
  --warn-bg:#FDF0D5; --warn-text:#7A4E09;
}
*{box-sizing:border-box}
body{margin:0; background:var(--bg); color:var(--ink);
     font:1.0938rem/1.6 "Source Sans 3","Source Sans Pro","Segoe UI",-apple-system,Roboto,Arial,sans-serif;}
h1,h2,h3{font-family:"Lexend","Trebuchet MS","Segoe UI",sans-serif; color:var(--ink-strong);
         line-height:1.25; text-wrap:balance; margin:0 0 10px;}
h1{font-size:clamp(1.6875rem,4vw,2.375rem); font-weight:600;}
h2{font-size:clamp(1.375rem,2.8vw,1.75rem); font-weight:600; margin-top:28px;}
h3{font-size:1.1563rem; font-weight:600;}
p,li{margin:0 0 13px; max-width:70ch;}
a{color:var(--primary-text);}
a:focus-visible,button:focus-visible{outline:4px solid var(--ink); outline-offset:2px;}
.wrap{max-width:1120px; margin:0 auto; padding:0 22px;}
header.site{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10;}
.bar{display:flex; align-items:center; gap:16px; padding:13px 0; flex-wrap:wrap;}
.logo{display:flex; align-items:center; gap:11px; text-decoration:none;}
.logo .wm{font-family:"Lexend","Segoe UI",sans-serif; font-size:1.3125rem; white-space:nowrap;}
.logo .wm b{color:var(--primary); font-weight:700;}
.logo .wm span{color:var(--ink-strong); font-weight:600;}
.crumb{color:var(--ink-2); font-size:1rem;}
.langbtn{border:2px solid var(--primary); background:#fff; color:var(--primary-text);
         font:600 1rem "Lexend","Segoe UI",sans-serif;
         border-radius:999px; padding:8px 16px; cursor:pointer; min-height:44px; margin-left:auto;}
.hero{padding:40px 0 8px;}
.kicker{display:inline-flex; align-items:center; gap:8px; background:var(--info-bg); color:#0C4A5E;
        border-radius:999px; padding:7px 15px; font-size:1rem; font-weight:600; margin-bottom:14px;}
section.band{padding:34px 0; border-top:1px solid var(--line);}
section.band.alt{background:#fff;}
.cols{display:grid; gap:20px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); align-items:start;}
.card{background:var(--card); border:1.5px solid var(--line); border-radius:16px; padding:19px 21px;}
.band.alt .card{background:var(--bg);}
.chip{display:inline-flex; align-items:center; gap:6px; font-size:0.875rem; font-weight:600;
      border-radius:999px; padding:4px 12px;}
.chip.ok{background:var(--ok-bg); color:var(--ok-text);}
.chip.warn{background:var(--warn-bg); color:var(--warn-text);}
.ic{width:1.05em; height:1.05em; vertical-align:-0.14em; fill:none; stroke:currentColor;
    stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;}
table.t{width:100%; border-collapse:collapse; background:#fff; border:1.5px solid var(--line);
        border-radius:12px; overflow:hidden; font-size:1rem;}
table.t th{background:var(--info-bg); text-align:left; color:#0C4A5E; padding:11px 14px;
           font-family:"Lexend","Segoe UI",sans-serif; font-weight:600; font-size:0.9375rem;}
table.t td{padding:11px 14px; border-top:1px solid var(--line); vertical-align:top;}
.tscroll{overflow-x:auto; border-radius:12px;}
ul.clean{padding-left:0; list-style:none; margin:0;}
ul.clean li{padding:6px 0 6px 30px; position:relative;}
ul.clean li::before{content:""; position:absolute; left:2px; top:12px; width:15px; height:8px;
  border-left:3px solid var(--green); border-bottom:3px solid var(--green); transform:rotate(-45deg);}
.warnbox{background:var(--warn-bg); color:var(--warn-text); border-radius:12px; padding:14px 18px; max-width:66ch;}
.cta{display:inline-flex; align-items:center; gap:9px; background:var(--primary); color:#fff;
     border-radius:12px; padding:14px 26px; font:600 1.125rem "Lexend","Segoe UI",sans-serif;
     text-decoration:none; min-height:52px;}
.muted{color:var(--ink-2); font-size:1rem;}
footer.site{background:#0F3A47; color:#C6DBE2; padding:34px 0; margin-top:46px; font-size:1rem;}
footer.site a{color:#EAF4F7;}
footer.site h3{color:#fff; font-size:1rem;}
[hidden]{display:none !important;}