/* ==========================================================================
   Creo2 — briefpapier
   De site is een zakelijke brief: briefhoofd met afzender, referentieregel
   (Uw kenmerk / Ons kenmerk / Datum), een rode kantlijn met de inhoud,
   "Betreft:", aanhef, ondertekening, genummerde bijlagen, voetnoten in
   mono, P.S. en een antwoordkaart. Voorvoegsel: cr-
   Geen afgeronde hoeken, alleen haarlijnen.
   ========================================================================== */

@font-face { font-family: 'Signifier'; font-weight: 300; font-style: normal; font-display: swap; src: url('fonts/Signifier-Light.woff2') format('woff2'); }
@font-face { font-family: 'Signifier'; font-weight: 300; font-style: italic; font-display: swap; src: url('fonts/Signifier-LightItalic.woff2') format('woff2'); }
@font-face { font-family: 'Signifier'; font-weight: 400; font-style: normal; font-display: swap; src: url('fonts/Signifier-Regular.woff2') format('woff2'); }
@font-face { font-family: 'Signifier'; font-weight: 400; font-style: italic; font-display: swap; src: url('fonts/Signifier-RegularItalic.woff2') format('woff2'); }
@font-face { font-family: 'Signifier'; font-weight: 500; font-style: normal; font-display: swap; src: url('fonts/Signifier-Medium.woff2') format('woff2'); }
@font-face { font-family: 'SoehneMono'; font-weight: 400; font-style: normal; font-display: swap; src: url('fonts/SohneMono-Buch.woff2') format('woff2'); }

:root {
  --paper:  #F5F0DD;
  --desk:   #E3DCC4;
  --ink:    #1E2C6E;
  --body:   #2B3570;
  --sec:    #4A507A;
  --muted:  #6B6F8C;
  --rule:   #CFC6A8;
  --fold:   #A99F80;
  --red:    #B8352A;
  --margin-line: rgba(184, 53, 42, 0.42);
  --wash:   #EEE7CF;   /* iets donkerder papier voor kaders */
  --photo:  #FBF7E8;   /* passe-partout rond foto's */

  --serif: 'Signifier', Georgia, 'Times New Roman', serif;
  --mono:  'SoehneMono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --col: 700px;
  --side: 190px;
  --gap: 52px;
  --frame: calc(var(--side) + var(--gap) + var(--col));
  --gut: 100px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--desk);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--red); }
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }

.cr-skip { position: absolute; left: -9999px; top: 0; }
.cr-skip:focus { left: 12px; top: 12px; z-index: 50; background: var(--paper); padding: 8px 12px; font-family: var(--mono); font-size: 13px; }
.cr-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Het vel ---------- */
.cr-sheet { max-width: 1280px; margin: 0 auto; background: var(--paper); position: relative; overflow: hidden; }
.cr-fold { position: absolute; left: 0; width: 16px; border-top: 1px solid var(--fold); pointer-events: none; }
.cr-fold--1 { top: 560px; }
.cr-fold--2 { top: 1120px; }

/* ---------- Advertentiestrook: de inktbalk zelf ---------- */
.cr-disclosure {
  display: flex; align-items: center; gap: 10px;
  padding: 7px var(--gut);
  background: var(--ink); color: var(--paper);
  font-family: var(--mono); font-size: 11.5px; line-height: 1.4; letter-spacing: 0.02em;
  border-bottom: 2px solid var(--red);
}
.cr-disclosure-mark { width: 8px; height: 8px; border: 1px solid var(--paper); flex: none; }

/* ---------- Briefhoofd ---------- */
.cr-letterhead {
  display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: end;
  padding: 38px var(--gut) 26px;
}
.cr-wordmark { display: inline-block; font-size: 40px; font-weight: 400; letter-spacing: -0.015em; line-height: 1.05; }
.cr-wordmark span, .cr-footer-mark span {
  font-family: var(--mono); font-size: 0.46em; color: var(--red); letter-spacing: 0; vertical-align: -0.12em; margin-left: 2px;
}
.cr-sender-line { margin-top: 9px; font-family: var(--mono); font-size: 11.5px; line-height: 1.5; color: var(--muted); max-width: 52ch; }
.cr-sender-block {
  font-style: normal; display: flex; flex-direction: column; text-align: right;
  font-family: var(--mono); font-size: 11px; line-height: 1.6; color: var(--sec);
  padding-left: 18px; border-left: 1px solid var(--rule);
}
.cr-sender-block span:first-child { color: var(--ink); }
.cr-sender-block a:hover { color: var(--red); }

/* Rubrieken als een rij tabbladen onder het briefhoofd */
.cr-nav {
  display: flex; flex-wrap: wrap; align-items: stretch;
  padding: 0 var(--gut);
  border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule);
  font-family: var(--mono); font-size: 12.5px; line-height: 1.4;
}
.cr-nav a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px 10px; border-right: 1px solid var(--rule); }
.cr-nav a:first-child { padding-left: 0; }
.cr-nav a img { width: 13px; height: 13px; flex: none; }
.cr-nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--ink); }
.cr-nav-reply { margin-left: auto; border-right: 0 !important; color: var(--red); padding-right: 0 !important; }
.cr-nav-reply:hover { color: var(--ink); }

/* ---------- Referentieregel ---------- */
.cr-main { padding: 46px 0 0; }
.cr-refline {
  width: var(--frame); max-width: calc(100% - 40px); margin: 0 auto;
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.cr-refline > div { padding: 9px 14px 10px; border-left: 1px solid var(--rule); min-width: 0; }
.cr-refline > div:first-child { border-left: 0; padding-left: 0; }
.cr-refline dt { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.cr-refline dd { margin: 2px 0 0; font-family: var(--mono); font-size: 13px; color: var(--ink); overflow-wrap: anywhere; }

/* ---------- De brief: kantlijn + tekstkolom ---------- */
.cr-letter {
  width: var(--frame); max-width: calc(100% - 40px); margin: 0 auto;
  display: grid; grid-template-columns: var(--side) minmax(0, var(--col)); column-gap: var(--gap);
}
.cr-margin {
  padding: 44px 24px 0 0;
  border-right: 1px solid var(--margin-line);
  font-family: var(--mono); font-size: 11.5px; line-height: 1.55; color: var(--sec);
}
.cr-margin-h { margin-top: 26px; font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.cr-margin-h:first-child { margin-top: 0; }
.cr-toc { list-style: none; margin: 10px 0 0; padding: 0; counter-reset: toc; }
.cr-toc li { counter-increment: toc; display: grid; grid-template-columns: 22px 1fr; padding: 6px 0; border-top: 1px solid var(--rule); }
.cr-toc li::before { content: counter(toc); color: var(--red); }
.cr-toc a:hover, .cr-toc a[aria-current="page"] { color: var(--red); }
.cr-toc a[aria-current="page"] { color: var(--ink); }
.cr-toc--cats li span { color: var(--muted); }
.cr-margin-note { margin-top: 18px; color: var(--muted); }
.cr-article { padding-top: 44px; min-width: 0; }

/* Venstervak (alleen voorpagina) */
.cr-venster { border: 1px solid var(--rule); padding: 12px 14px 14px; background: var(--wash); }
.cr-venster-label { font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.cr-venster p { margin: 6px 0 0; font-family: var(--serif); font-size: 16px; line-height: 1.45; color: var(--ink); }
.cr-margin dl { margin: 22px 0 0; }
.cr-margin dt { font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-top: 12px; }
.cr-margin dd { margin: 2px 0 0; color: var(--ink); }

/* ---------- Kop van de brief ---------- */
.cr-kicker { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 12px; color: var(--muted); }
.cr-kicker img { width: 14px; height: 14px; }
.cr-betreft { margin-top: 30px; font-size: 15px; font-weight: 500; letter-spacing: 0.02em; color: var(--red); }
.cr-kicker + .cr-betreft { margin-top: 22px; }
.cr-article > .cr-betreft:first-child { margin-top: 0; }
.cr-adlabel {
  display: inline-block; margin: 10px 0 0; padding: 4px 9px; border: 1px solid var(--red); background: var(--paper);
  font-family: var(--mono); font-size: 11px; line-height: 1.4; letter-spacing: 0.05em; text-transform: uppercase; color: var(--red);
}
.cr-h1 { margin: 8px 0 0; font-size: 48px; font-weight: 400; line-height: 1.1; letter-spacing: -0.01em; text-wrap: pretty; }
.cr-adlabel + .cr-h1 { margin-top: 14px; }
.cr-h1--home { font-size: 44px; }
.cr-h1 a:hover { color: var(--red); }
.cr-standfirst { margin: 20px 0 0; font-size: 22px; font-weight: 300; font-style: italic; line-height: 1.5; color: var(--body); }
.cr-from { margin-top: 16px; font-family: var(--mono); font-size: 11.5px; color: var(--muted); }

/* ---------- Foto's: als bijgevoegde afdruk met passe-partout ---------- */
.cr-figure { margin: 30px 0 0; padding: 7px 7px 0; background: var(--photo); border: 1px solid var(--rule); }
.cr-figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; filter: saturate(0.78) contrast(1.03) sepia(0.07); }
.cr-figure figcaption { padding: 7px 0 8px; font-family: var(--mono); font-size: 11px; line-height: 1.55; color: var(--muted); }
.cr-prose .cr-figure { margin: 30px 0 4px; }

/* ---------- Broodtekst ---------- */
.cr-prose { margin-top: 32px; }
.cr-prose p, .cr-prose li { color: var(--body); }
.cr-prose p { margin: 18px 0 0; font-size: 20px; line-height: 1.72; }
.cr-prose .cr-salute { margin-top: 0; }
.cr-prose h2 { margin: 50px 0 0; font-size: 28px; font-weight: 500; line-height: 1.2; color: var(--ink); text-wrap: pretty; scroll-margin-top: 20px; }
.cr-prose h2 + p { margin-top: 14px; }
.cr-prose h3 { margin: 30px 0 0; font-size: 21px; font-weight: 500; color: var(--ink); }
.cr-prose ul, .cr-prose ol { margin: 16px 0 0; padding-left: 1.3em; }
.cr-prose li { font-size: 20px; line-height: 1.65; margin-top: 8px; }
.cr-prose ol > li::marker { font-family: var(--mono); font-size: 14px; color: var(--red); }
.cr-prose ul > li::marker { color: var(--red); }
.cr-prose a { border-bottom: 1px solid var(--ink); }
.cr-prose a:hover { border-color: var(--red); }
.cr-prose strong { font-weight: 500; color: var(--ink); }
.cr-prose em { font-style: italic; }
.cr-prose sup { font-family: var(--mono); font-size: 11px; line-height: 0; color: var(--red); margin-left: 1px; }
.cr-prose sup a { border: 0; color: var(--red); }

/* Citaat uit de eigen tekst */
.cr-pull { margin: 40px 0; padding: 4px 0 4px 26px; border-left: 2px solid var(--red); }
.cr-pull p { margin: 0 !important; font-size: 27px !important; font-weight: 300; font-style: italic; line-height: 1.38 !important; color: var(--ink) !important; }

/* Rood kader "Belangrijk" */
.cr-important { margin: 36px 0; border: 1px solid var(--red); padding: 20px 24px; }
.cr-important-h, .cr-box-h {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red);
}
.cr-important-h img, .cr-box-h img { width: 14px; height: 14px; }
.cr-important p { margin: 10px 0 0; font-size: 18px; line-height: 1.6; }

/* Rekenvoorbeeld / tabel */
.cr-box { margin: 38px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 16px 0 18px; }
.cr-box-h { color: var(--ink); }
.cr-box > p { font-size: 18px; line-height: 1.6; }
.cr-box-note { margin-top: 12px !important; font-family: var(--mono); font-size: 11.5px !important; line-height: 1.6 !important; color: var(--muted) !important; }
.cr-table-wrap { margin-top: 14px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cr-table { width: 100%; border-collapse: collapse; font-size: 17px; line-height: 1.45; color: var(--body); }
.cr-table caption { caption-side: top; text-align: left; font-family: var(--mono); font-size: 11.5px; color: var(--muted); padding-bottom: 8px; }
.cr-table th {
  text-align: left; vertical-align: bottom; font-weight: 400;
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.03em; color: var(--muted);
  padding: 8px 12px 8px 0; border-bottom: 1px solid var(--ink);
}
.cr-table td { padding: 10px 12px 10px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.cr-table td.num, .cr-table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cr-table tr:last-child td { border-bottom: 0; }
.cr-table tr.total td { border-top: 1px solid var(--ink); font-weight: 500; color: var(--ink); }

/* Afvinklijst */
.cr-checklist { list-style: none; padding: 0 !important; }
.cr-checklist li { position: relative; padding-left: 36px; }
.cr-checklist li::before { content: ""; position: absolute; left: 0; top: 0.4em; width: 17px; height: 17px; border: 1px solid var(--ink); background: var(--photo); }

/* Ondertekening */
.cr-signoff { margin-top: 50px; }
.cr-signoff-close { font-size: 18px; color: var(--body); }
.cr-signature { margin-top: 6px; font-size: 36px; font-weight: 300; font-style: italic; line-height: 1.2; color: var(--ink); }
.cr-signoff-role { margin-top: 2px; font-family: var(--mono); font-size: 11.5px; color: var(--muted); }
.cr-ps { margin-top: 30px !important; font-size: 19px !important; line-height: 1.65 !important; font-style: italic; color: var(--body); }
.cr-ps span { font-style: normal; font-weight: 500; color: var(--red); }

/* Voetnoten */
.cr-footnotes { margin-top: 44px; padding-top: 14px; border-top: 1px solid var(--ink); font-family: var(--mono); font-size: 12px; line-height: 1.7; color: var(--sec); }
.cr-footnotes-h { font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); margin-bottom: 6px; }
.cr-footnotes ol { list-style: none; margin: 0; padding: 0; }
.cr-footnotes li { display: grid; grid-template-columns: 24px 1fr; margin-top: 5px; }
.cr-fn-no { color: var(--red); }
.cr-footnotes a { color: var(--ink); border-bottom: 1px solid var(--rule); overflow-wrap: anywhere; }
.cr-footnotes a:hover { color: var(--red); }

/* Disclaimer */
.cr-disclaimer { margin-top: 32px; padding: 18px 20px 20px; background: var(--wash); border-left: 2px solid var(--red); }
.cr-disclaimer-h { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.cr-disclaimer p { margin: 10px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--sec); }
.cr-disclaimer a { border-bottom: 1px solid var(--rule); }

/* ---------- Na de brief: uitgelijnd met de tekstkolom ---------- */
.cr-after { width: var(--frame); max-width: calc(100% - 40px); margin: 0 auto; padding-left: calc(var(--side) + var(--gap)); }

/* ---------- Bijlagen ---------- */
.cr-bijlagen { margin-top: 64px; }
.cr-bijlagen-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-bottom: 10px; border-bottom: 1px solid var(--ink); }
.cr-bijlagen-title { margin: 0; font-family: var(--mono); font-size: 12.5px; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); }
.cr-bijlagen-more { font-family: var(--mono); font-size: 12px; color: var(--muted); }
.cr-bijlage { display: grid; grid-template-columns: 56px 1fr 128px; gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--rule); align-items: baseline; }
.cr-bijlage-no { font-size: 38px; font-weight: 300; font-style: italic; line-height: 1; color: var(--red); font-variant-numeric: lining-nums; }
.cr-bijlage-no--alt { font-size: 30px; color: var(--fold); }
.cr-bijlage h3 { margin: 0; font-size: 23px; font-weight: 400; line-height: 1.24; text-wrap: pretty; }
.cr-bijlage p { margin: 6px 0 0; font-size: 16.5px; line-height: 1.5; color: var(--sec); }
.cr-bijlage-meta { font-family: var(--mono); font-size: 11.5px; line-height: 1.6; color: var(--muted); text-align: right; }
.cr-tag { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--red); border: 1px solid var(--red); padding: 1px 5px; vertical-align: middle; white-space: nowrap; }

/* ---------- Voorpagina ---------- */
.cr-readmore {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 24px;
  font-family: var(--mono); font-size: 13px; border-bottom: 1px solid var(--ink); padding-bottom: 3px;
}
.cr-readmore img { width: 14px; height: 14px; }

/* Data om te noteren */
.cr-agenda { margin-top: 56px; }
.cr-agenda-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-bottom: 10px; border-bottom: 1px solid var(--ink); }
.cr-agenda-title { margin: 0; font-family: var(--mono); font-size: 12.5px; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.cr-agenda-intro { margin: 14px 0 0; font-size: 18px; line-height: 1.6; color: var(--body); }
.cr-agenda-row { display: grid; grid-template-columns: 230px 1fr; gap: 22px; padding: 16px 0; border-bottom: 1px solid var(--rule); align-items: baseline; }
.cr-agenda-fig { font-size: 30px; font-weight: 400; line-height: 1.12; color: var(--ink); letter-spacing: -0.005em; }
.cr-agenda-fig sup { font-family: var(--mono); font-size: 11px; color: var(--red); vertical-align: super; line-height: 0; margin-left: 2px; }
.cr-agenda-txt { font-size: 17px; line-height: 1.55; color: var(--body); }
.cr-agenda-txt a { display: inline-block; margin-top: 4px; font-family: var(--mono); font-size: 12px; border-bottom: 1px solid var(--rule); }
.cr-agenda-txt a:hover { border-color: var(--red); }

/* Rubrieken als indexkaarten */
.cr-index { margin-top: 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--ink); }
.cr-index-card { display: block; padding: 18px 20px 20px 0; border-bottom: 1px solid var(--rule); }
.cr-index-card:nth-child(even) { padding-left: 22px; padding-right: 0; border-left: 1px solid var(--rule); }
.cr-index-top { display: flex; justify-content: space-between; align-items: center; font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.cr-index-top img { width: 15px; height: 15px; }
.cr-index-name { margin-top: 8px; font-size: 24px; line-height: 1.2; color: var(--ink); }
.cr-index-blurb { margin-top: 6px; font-size: 15.5px; line-height: 1.5; color: var(--sec); }
.cr-index-card:hover .cr-index-name { color: var(--red); }

/* ---------- Antwoordkaart ---------- */
.cr-card { margin-top: 64px; border: 1px dashed var(--ink); padding: 30px 32px 30px; position: relative; background: var(--paper); }
.cr-stamp {
  position: absolute; top: 22px; right: 22px; width: 92px; height: 104px; border: 1px solid var(--ink);
  outline: 1px dashed var(--rule); outline-offset: -6px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center;
  font-family: var(--mono); font-size: 9.5px; line-height: 1.35; color: var(--sec); padding: 6px;
}
.cr-stamp b { font-weight: 400; font-size: 14px; color: var(--red); }
.cr-card-label { font-family: var(--mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.cr-card-h { margin: 12px 0 0; max-width: 470px; font-size: 28px; font-weight: 400; line-height: 1.22; }
.cr-card-sub { margin: 12px 0 0; max-width: 480px; font-size: 17px; line-height: 1.55; color: var(--sec); }
.cr-form { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: end; margin-top: 26px; }
.cr-field { display: flex; flex-direction: column; gap: 6px; font-family: var(--mono); font-size: 11px; color: var(--muted); }
.cr-field input {
  font-family: var(--serif); font-size: 20px; padding: 6px 0; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0;
  background: transparent; color: var(--ink); outline: none; width: 100%; min-width: 0;
}
.cr-field input::placeholder { color: var(--fold); }
.cr-field input:focus { border-bottom-color: var(--red); }
.cr-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--mono); font-size: 13px; line-height: 1.2; padding: 14px 24px; border: 1px solid var(--ink); border-radius: 0;
  background: var(--ink); color: var(--paper); cursor: pointer;
}
.cr-btn:hover { background: var(--red); border-color: var(--red); color: var(--paper); }
.cr-btn img { width: 15px; height: 15px; }
.cr-btn--ghost { background: transparent; color: var(--ink); }
.cr-btn--ghost:hover { background: transparent; color: var(--red); border-color: var(--red); }
.cr-consent { display: flex; gap: 12px; align-items: flex-start; margin-top: 20px; font-size: 16px; line-height: 1.5; color: var(--body); cursor: pointer; }
.cr-consent input { margin: 4px 0 0; width: 18px; height: 18px; flex: none; accent-color: var(--ink); }
.cr-consent a { border-bottom: 1px solid var(--ink); }
.cr-card-fine { margin-top: 14px; font-family: var(--mono); font-size: 11px; line-height: 1.55; color: var(--muted); max-width: 520px; }
.cr-form-msg { margin-top: 10px; font-family: var(--mono); font-size: 12px; min-height: 1em; }
.cr-form-msg[data-state="err"] { color: var(--red); }
.cr-form-msg[data-state="ok"] { color: var(--ink); }

/* ---------- Gewone pagina's ---------- */
.cr-letter--page { grid-template-columns: minmax(0, var(--col)); justify-content: center; }
.cr-page { margin-top: 30px; }
.cr-page h2 { margin: 44px 0 0; font-size: 26px; font-weight: 500; line-height: 1.25; }
.cr-page h3 { margin: 28px 0 0; font-size: 21px; font-weight: 500; }
.cr-page p, .cr-page li { font-size: 18.5px; line-height: 1.68; color: var(--body); }
.cr-page p { margin: 14px 0 0; }
.cr-page ul, .cr-page ol { margin: 12px 0 0; padding-left: 1.3em; }
.cr-page li { margin-top: 6px; }
.cr-page a { border-bottom: 1px solid var(--ink); }
.cr-page a:hover { border-color: var(--red); }
.cr-page strong { font-weight: 500; color: var(--ink); }
.cr-company { margin-top: 30px; border: 1px solid var(--ink); padding: 22px 24px 24px; }
.cr-company-label { font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.cr-company-name { margin-top: 4px; font-size: 28px; font-weight: 400; line-height: 1.2; }
.cr-vat { margin-top: 14px; border-left: 3px solid var(--red); background: var(--wash); padding: 14px 18px; }
.cr-vat-label { font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); }
.cr-vat-no { display: block; font-size: 32px; font-weight: 500; letter-spacing: 0.02em; color: var(--ink); line-height: 1.2; margin-top: 2px; }
.cr-vat-reg { margin-top: 8px; font-family: var(--mono); font-size: 13px; color: var(--ink); }
.cr-dl { margin: 18px 0 0; display: grid; grid-template-columns: 200px 1fr; gap: 8px 18px; font-size: 17.5px; line-height: 1.5; color: var(--body); }
.cr-dl dt { font-family: var(--mono); font-size: 12px; color: var(--muted); padding-top: 4px; }
.cr-dl dd { margin: 0; }
.cr-dl a { border-bottom: 1px solid var(--ink); }
.cr-thanks-steps { counter-reset: st; list-style: none; padding: 0 !important; }
.cr-thanks-steps li { counter-increment: st; display: grid; grid-template-columns: 44px 1fr; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.cr-thanks-steps li::before { content: counter(st); font-size: 30px; font-weight: 300; font-style: italic; line-height: 1; color: var(--red); }

/* ---------- Voet ---------- */
.cr-footer { margin-top: 84px; border-top: 6px solid var(--ink); padding: 26px var(--gut) 34px; font-family: var(--mono); font-size: 11.5px; line-height: 1.7; color: var(--sec); }
.cr-footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.1fr; gap: 40px; }
.cr-footer-mark { color: var(--ink); font-family: var(--serif); font-size: 22px; line-height: 1.2; margin-bottom: 6px; }
.cr-footer-nav { display: flex; flex-direction: column; }
.cr-footer-nav a:hover { color: var(--red); }
.cr-footer-right { text-align: right; }
.cr-footer-note { margin: 26px 0 0; padding-top: 16px; border-top: 1px solid var(--rule); max-width: 900px; font-size: 11.5px; line-height: 1.7; color: var(--muted); }
.cr-footer-note a { border-bottom: 1px solid var(--rule); }

/* ---------- Cookiemelding ---------- */
.cr-cookie {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 40; max-width: 560px; margin: 0 auto;
  background: var(--paper); border: 1px solid var(--ink); box-shadow: 6px 6px 0 rgba(30, 44, 110, 0.18); padding: 20px 22px;
}
.cr-cookie[hidden] { display: none; }
.cr-cookie-h { font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.cr-cookie p { margin: 8px 0 0; font-size: 16px; line-height: 1.55; color: var(--body); }
.cr-cookie p a { border-bottom: 1px solid var(--ink); }
.cr-cookie-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.cr-cookie-actions .cr-btn { padding: 11px 18px; }

/* ---------- Responsief ---------- */
@media (max-width: 1100px) {
  :root { --gut: 40px; }
  .cr-letter { grid-template-columns: minmax(0, var(--col)); justify-content: center; }
  .cr-margin { display: none; }
  .cr-margin--home { display: block; border-right: 0; border-bottom: 1px solid var(--margin-line); padding: 26px 0 22px; }
  .cr-refline, .cr-letter, .cr-after { width: var(--col); }
  .cr-after { padding-left: 0; }
}
@media (max-width: 760px) {
  :root { --gut: 20px; }
  body { font-size: 19px; }
  .cr-disclosure { font-size: 11px; padding: 7px 20px; }
  .cr-letterhead { grid-template-columns: 1fr; gap: 0; padding: 22px 20px 16px; }
  .cr-sender-block { display: none; }
  .cr-wordmark { font-size: 34px; }
  .cr-sender-line { font-size: 11px; margin-top: 6px; }
  .cr-nav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0 20px; }
  .cr-nav::-webkit-scrollbar { display: none; }
  .cr-nav a { white-space: nowrap; padding: 10px 14px 9px; }
  .cr-nav-reply { margin-left: 0; padding-right: 20px !important; }
  .cr-main { padding-top: 22px; }
  .cr-refline, .cr-letter, .cr-after { max-width: calc(100% - 40px); }
  .cr-refline { grid-template-columns: repeat(4, auto); }
  .cr-refline > div { padding: 6px 8px 7px; }
  .cr-refline dt { font-size: 9px; letter-spacing: 0.06em; }
  .cr-refline dd { font-size: 11px; }
  .cr-refline > div:first-child { display: none; }
  .cr-refline > div:nth-child(2) { border-left: 0; padding-left: 0; }
  .cr-article { padding-top: 24px; }
  .cr-betreft { margin-top: 20px; font-size: 14px; }
  .cr-kicker + .cr-betreft { margin-top: 14px; }
  .cr-h1 { font-size: 33px; line-height: 1.13; }
  .cr-h1--home { font-size: 31px; }
  .cr-standfirst { font-size: 19px; margin-top: 14px; }
  .cr-adlabel { font-size: 10px; }
  .cr-prose { margin-top: 24px; }
  .cr-prose p, .cr-prose li { font-size: 19px; }
  .cr-prose h2 { font-size: 25px; margin-top: 42px; }
  .cr-pull p { font-size: 23px !important; }
  .cr-important { padding: 16px 18px; }
  .cr-table { font-size: 15.5px; }
  .cr-figure { padding: 5px 5px 0; }
  .cr-bijlage { grid-template-columns: 40px 1fr; gap: 6px 12px; padding: 18px 0; }
  .cr-bijlage-no { font-size: 30px; grid-row: span 2; }
  .cr-bijlage-meta { text-align: left; grid-column: 2; }
  .cr-bijlage h3 { font-size: 21px; }
  .cr-agenda-row { grid-template-columns: 1fr; gap: 4px; }
  .cr-agenda-fig { font-size: 26px; }
  .cr-index { grid-template-columns: 1fr; }
  .cr-index-card, .cr-index-card:nth-child(even) { padding: 16px 0 18px; border-left: 0; }
  .cr-card { padding: 24px 20px 24px; }
  .cr-stamp { width: 70px; height: 82px; font-size: 8px; top: 14px; right: 14px; }
  .cr-stamp b { font-size: 12px; }
  .cr-card-h { font-size: 24px; padding-right: 74px; }
  .cr-card-sub { font-size: 16px; }
  .cr-form { grid-template-columns: 1fr; gap: 18px; }
  .cr-btn--send { width: 100%; }
  .cr-dl { grid-template-columns: 1fr; gap: 2px 0; }
  .cr-dl dd { margin-bottom: 10px; }
  .cr-vat-no { font-size: 26px; }
  .cr-footer-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
  .cr-footer-right { text-align: left; }
  .cr-fold { display: none; }
}
@media (max-width: 420px) {
  .cr-footer-grid { grid-template-columns: 1fr; }
  .cr-h1 { font-size: 30px; }
  .cr-signature { font-size: 31px; }
}
.cr-article-note { margin-top: 34px !important; padding-top: 14px; border-top: 1px solid var(--rule); font-size: 17px !important; line-height: 1.6 !important; color: var(--sec) !important; }
.cr-index-name, .cr-index-blurb { display: block; }
.cr-bijlage-meta a:hover { color: var(--red); }
@media (max-width: 1100px) {
  .cr-margin--home { order: 2; border-bottom: 0; border-top: 1px solid var(--margin-line); margin-top: 48px; padding: 24px 0 0; }
}
/* Antwoordkaart binnen een gewone pagina */
.cr-page .cr-card h2.cr-card-h { margin: 12px 0 0; font-size: 28px; font-weight: 400; line-height: 1.22; }
.cr-page .cr-card p.cr-card-sub { margin: 12px 0 0; font-size: 17px; line-height: 1.55; color: var(--sec); }
.cr-page .cr-card .cr-consent a { border-bottom: 1px solid var(--ink); }
.cr-page .cr-thanks-steps li p { margin: 0; }
@media (max-width: 760px) { .cr-page .cr-card h2.cr-card-h { font-size: 24px; } }
.cr-article > .cr-article-note { margin: 22px 0 0; padding-top: 0; border-top: 0; font-size: 16px; line-height: 1.6; color: var(--sec); }