/* ============================================================
   Morris — de juridische pagina's (voorwaarden, privacy, verwerkers-
   overeenkomst). Alleen wat die pagina's gebruiken; de basis (lettertypes,
   reset, focus, print) komt uit module.css, kop en voet uit site-opzet.css.
   Tot 15 okt 2026 laadden ze de oude morris.css (871 regels, waarvan 19
   gebruikt), met een eigen kopie van de kleuren.

   De kleuren tussen de markeringen komen uit docs/brandkit/tokens.css
   (aliasblok 2h) via apps/web/scripts/maak-tokens.mjs.
   ============================================================ */

:root{
  /* tokens:juridisch-dag — gemaakt door apps/web/scripts/maak-tokens.mjs uit docs/brandkit/tokens.css, niet met de hand aanpassen */
  --ink:#14100A;
  --ink2:#3E362C;
  --ink3:#7D6E5E;
  --sand:#F3EDE3;
  --sand2:#E7DFD3;
  --white:#FFFDF8;
  --border:#DCD3C5;
  --border-light:#E7DFD3;
  --amber:#B37008;
  --amber-dark:#965E06;
  --green:#2D7A4F;
  --red:#C0392B;
  /* /tokens:juridisch-dag */
  --font-display:'Syne',sans-serif;
  --font-body:'DM Sans',sans-serif;
  --wrap:1180px;
}

body{margin:0;background:var(--sand);color:var(--ink);font-family:var(--font-body);font-size:var(--m-tekst-xl);line-height:var(--m-regel-lang);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;letter-spacing:var(--m-spatie-kop);margin:0;line-height:var(--m-regel-kop)}
p{margin:0}
a{color:inherit}
img,svg{max-width:100%}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--m-ruimte-24)}
.section{padding:var(--m-ruimte-64) 0}
.lede{font-size:clamp(16px,1.5vw,19px);color:var(--ink2);line-height:var(--m-regel-lang);max-width:62ch}
.crumb{display:flex;align-items:center;gap:var(--m-ruimte-8);font-size:var(--m-tekst-s);color:var(--ink3);margin-bottom:var(--m-ruimte-24)}
.crumb a{color:var(--ink3);text-decoration:none}
.crumb a:hover{color:var(--amber)}
.page-hero{padding:var(--m-ruimte-48) 0 var(--m-ruimte-64)}
.page-hero h1{font-size:var(--m-display-l);margin-bottom:var(--m-ruimte-20)}

/* lange leestekst: links onderstreept, lange woorden breken, grijs iets donkerder */
body:has(.prose){--ink3:var(--ink2)}
.prose{overflow-wrap:break-word}
.prose a{text-decoration:underline}

@container inhoud (max-width:767px){
  .wrap{padding:0 var(--m-ruimte-16)}
}