/* Ontwerp A2 — de Monografie (A) met het logo en het olijfgroen van de oude site en een kopbeeld per hoofdstuk. */
:root{--papier:#f7f3ea;--inkt:#1c1a17;--grijs:#6a655c;--lijn:#d9d2c3;--rood:#4f5608;--olijf:#6a7007;
      --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;}
*{box-sizing:border-box}
html{background:var(--papier)}
body{margin:0;color:var(--inkt);font-family:var(--serif);font-size:1.125rem;line-height:1.65;-webkit-text-size-adjust:100%}
a{color:var(--rood)}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;background:var(--inkt);color:#fff;padding:.5rem 1rem;z-index:9}
:focus-visible{outline:2px solid var(--rood);outline-offset:3px}

.boek{display:grid;grid-template-columns:19rem minmax(0,1fr);min-height:100vh}
.inhoud{border-right:1px solid var(--lijn);padding:3.75rem 1.75rem 2.5rem;position:sticky;top:0;height:100vh;overflow:auto;font-size:.9rem}
.inhoud__titel{display:block;text-decoration:none;color:var(--inkt);margin-bottom:2rem;line-height:1;text-align:center}
.inhoud__logo{display:block;width:15.5rem;height:auto;margin:0 auto}
.inhoud__k{display:block;font-size:1.3rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400;white-space:nowrap}
.inhoud__mob{display:none}
.taal{position:absolute;top:1rem;right:1rem;font-size:.75rem;letter-spacing:.08em;line-height:1;z-index:5}
.taal summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .85rem;border:1px solid var(--lijn);border-radius:999px;color:var(--grijs);background:var(--papier,#f7f3ea);user-select:none}
.taal summary::-webkit-details-marker{display:none}
.taal summary::after{content:"";width:.4em;height:.4em;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-.15em) rotate(45deg)}
.taal[open] summary::after{transform:translateY(.1em) rotate(-135deg)}
.taal summary:hover,.taal[open] summary{color:var(--inkt);border-color:var(--grijs)}
.taal ul{list-style:none;margin:.4rem 0 0;padding:.3rem 0;position:absolute;right:0;min-width:9.5rem;background:#fffdf7;border:1px solid var(--lijn);border-radius:.5rem;box-shadow:0 .4rem 1.2rem rgba(0,0,0,.08)}
.taal li a{display:block;padding:.55rem .9rem;color:var(--inkt);text-decoration:none;letter-spacing:0;font-size:.9rem}
.taal li a:hover{background:#f1ece0}.taal li a[aria-current]{font-weight:600}
.taal li a[aria-current]::after{content:" ✓";color:var(--rood)}

.toc,.toc ol{list-style:none;margin:0;padding:0}
.toc__deel{margin-bottom:1.25rem}
.toc__nr{display:inline-block;width:1.6rem;color:var(--rood);font-variant-numeric:lining-nums}
.toc__naam{font-variant:small-caps;letter-spacing:.06em}
.toc__deel ol{margin:.35rem 0 0 1.6rem;border-left:1px solid var(--lijn);padding-left:.75rem}
.toc a{color:var(--grijs);text-decoration:none;display:block;padding:.15rem 0;line-height:1.35}
.toc a:hover{color:var(--inkt)}.toc a[aria-current]{color:var(--inkt);font-weight:600}
.toc a[aria-current]::before{content:"›";position:absolute;margin-left:-.9rem;color:var(--olijf)}

.blad{padding:4rem clamp(1.5rem,6vw,6rem) 3rem}
.prose{max-width:36rem;overflow-wrap:anywhere}   /* lange URL's in de tekst mogen afbreken */
.prose p{margin:0 0 1.2em;hyphens:auto}   /* links uitgelijnd: uitvullen geeft gaten bij links en smalle kolommen */
.prose h2{font-size:1.15rem;font-variant:small-caps;letter-spacing:.08em;font-weight:600;margin:2.6em 0 .6em}
.prose h3{font-size:1.05rem;font-style:italic;font-weight:400;margin:2em 0 .5em}
.prose img{max-width:100%;height:auto;display:block;margin:2rem auto .5rem}
.prose .bijschrift{font-size:.9rem;color:var(--grijs);font-style:italic;text-align:center;margin-top:-.25rem}
.prose ul,.prose ol{padding-left:1.4rem}
.prose blockquote{margin:1.5rem 2rem;font-style:italic}
.klein-kop{font-size:.875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grijs);font-weight:400;margin:0 0 1rem}

.voorwoord{margin-bottom:4rem}
.toc-groot{max-width:44rem;margin:0;border-top:1px solid var(--lijn);padding-top:2rem}
.toc-groot__deel{margin-bottom:2.25rem}
.toc-groot h3{font-size:1.4rem;font-weight:400;margin:0 0 .25rem}.toc-groot h3 span{color:var(--rood);margin-right:.5rem}
.toc-groot__intro{font-style:italic;color:var(--grijs);margin:0 0 .6rem}
.toc-groot ol{list-style:none;margin:0;padding:0 0 0 2.4rem;columns:2;column-gap:2rem}
.toc-groot li{break-inside:avoid;padding:.15rem 0}
.toc-groot a{color:var(--inkt);text-decoration:none;border-bottom:1px dotted var(--lijn)}.toc-groot a:hover{color:var(--rood)}

.loopkop{font-size:.875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grijs);margin:0 0 2rem}
.loopkop span{color:var(--rood);margin-right:.5rem}
.ondertitel{font-size:1.05rem;color:var(--grijs);margin:0 0 1.5rem;font-style:italic}
.hoofdstuk h1{font-size:clamp(2rem,4vw,2.9rem);font-weight:400;line-height:1.1;margin:0 0 .5rem;letter-spacing:-.01em}
.tijdvak{font-style:italic;color:var(--grijs);margin:0 0 2rem;font-size:1.1rem;hyphens:manual}
/* het kopbeeld van een hoofdstuk: een plaat vóór de tekst, zoals in een monografie */
.plaat{margin:0 0 2.5rem;max-width:44rem}
.plaat img{width:100%;height:auto;max-height:26rem;object-fit:cover;display:block;filter:sepia(.18) contrast(1.03)}
.plaat--heel img{max-height:none;object-fit:contain}
.plaat figcaption{font-size:.9rem;color:var(--grijs);font-style:italic;margin-top:.5rem}
.tekst{margin-top:2rem}
.tekst--initiaal>p:first-of-type::first-letter{float:left;font-size:4.2em;line-height:.82;padding:.08em .08em 0 0;color:var(--rood)}
.bladzij{clear:both;display:flex;justify-content:space-between;gap:2rem;margin-top:4rem;padding-top:1.5rem;border-top:1px solid var(--lijn);max-width:36rem}
.bladzij a{text-decoration:none;color:var(--inkt);font-style:italic}.bladzij a small{display:block;font-style:normal;font-size:.75rem;letter-spacing:.15em;color:var(--rood)}
.bladzij .rechts{text-align:right}
.verder{clear:both;margin-top:3rem;border-top:1px solid var(--lijn);padding-top:1.5rem;max-width:36rem}
.verder ol{list-style:none;padding:0;margin:0;columns:2;column-gap:2rem}.verder li{padding:.15rem 0}
.verder a{text-decoration:none;color:var(--grijs)}.verder a[aria-current]{color:var(--inkt);font-weight:600}
.lijst__naam{white-space:nowrap}.lijst__datum{display:block;font-size:.85em;font-style:italic;color:var(--grijs);line-height:1.3;margin-bottom:.25rem}.verder li,.toc-groot li{break-inside:avoid}.verder a[aria-current] .lijst__datum{font-weight:400}
.gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1.25rem;margin:2rem 0;max-width:44rem}
.gal figure{margin:0}.gal img{width:100%;height:auto;display:block;filter:sepia(.15)}.gal figcaption{font-size:.9rem;color:var(--grijs);font-style:italic;margin-top:.4rem}
.video{aspect-ratio:16/9;margin:2rem 0}.video iframe{width:100%;height:100%;border:0}
.colofon{clear:both;margin-top:6rem;padding-top:1.5rem;border-top:1px solid var(--lijn);font-size:.9rem;color:var(--grijs);font-style:italic}

@media(max-width:58rem){
  .inhoud__titel{text-align:center;margin-bottom:.75rem}
  .inhoud__logo{width:min(19rem,80vw);display:block;margin:0 auto}
  .inhoud__mob summary{text-align:center;list-style-position:inside}
  .boek{grid-template-columns:minmax(0,1fr)}   /* 1fr alleen zou de kolom laten meegroeien met een brede tabel */
  .inhoud{position:static;height:auto;border-right:0;border-bottom:1px solid var(--lijn);padding:1.25rem 1.5rem}
  .inhoud__titel{margin-bottom:.75rem}.inhoud__k{display:inline;font-size:1.3rem;margin-right:.4rem}
  .inhoud__mob{display:block}.inhoud__mob summary{cursor:pointer;font-variant:small-caps;letter-spacing:.08em}
  .inhoud__lijst--desk{display:none}.inhoud__mob .inhoud__lijst{margin-top:1rem}
  .inhoud{position:relative}.inhoud .taal{top:.9rem}
  .blad{padding:2rem 1.5rem}
  .toc-groot ol,.verder ol{columns:1}
  .toc-groot ol.lijst--datums,.verder ol.lijst--datums{columns:2;column-gap:1.5rem}
}

/* figuren in de tekst */
.fig{margin:2rem 0 1.5rem}.fig img{width:100%;height:auto;display:block;filter:sepia(.12)}.fig a{display:block}
.fig figcaption{font-size:.9rem;color:var(--grijs);font-style:italic;margin-top:.5rem;line-height:1.4}
.prose .fig--breed{max-width:44rem}
.prose .fig--zij{float:right;width:16rem;margin:.3rem 0 1rem 2rem}
.prose .fig-duo{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;max-width:44rem;margin:2rem 0 1.5rem}
.fig-duo .fig{margin:0}
.prose h2{clear:both}
@media(max-width:44rem){.prose .fig--zij{float:none;width:100%;margin:1.5rem 0}.prose .fig-duo{grid-template-columns:1fr}}

/* tabellen (aantallen per land): drukwerkstijl, en op smalle schermen zijwaarts scrollen in plaats van uitlopen */
.prose table{border-collapse:collapse;font-size:.95rem;margin:1.5rem 0;min-width:16rem}
.prose th,.prose td{text-align:left;padding:.35rem .9rem .35rem 0;border-bottom:1px solid var(--lijn);vertical-align:top}
.prose th{font-variant:small-caps;letter-spacing:.06em;font-weight:600;border-bottom-color:var(--grijs)}
.prose th,.prose td{overflow-wrap:normal;hyphens:manual}.prose th{white-space:nowrap}.prose td:not(:last-child){white-space:nowrap}
.prose table.getallen td:last-child,.prose table.getallen th:last-child{text-align:right;font-variant-numeric:tabular-nums}
.prose .tabel{overflow-x:auto;max-width:36rem}
/* De Kinkhoorn: regel met downloadkoppelingen boven een nummer */
.downloads{font-size:.95rem;background:#fffdf7;border:1px solid var(--lijn);border-radius:.4rem;padding:.6rem .9rem;margin:0 0 2rem}
.downloads a{color:var(--rood)}
/* beeld met een grotere versie achter een klik */
a.vergroot{display:block;line-height:0;position:relative}
a.vergroot:focus-visible{outline:2px solid var(--rood);outline-offset:3px}
a.vergroot picture{display:block}
.prose a.vergroot img,.beeldbijlage a.vergroot img{width:100%;height:auto}
.kh-inhoud{background:#fffdf7;border:1px solid var(--lijn);border-radius:.5rem;padding:1rem 1.25rem;margin:0 0 2rem;max-width:36rem}
.kh-inhoud ol{margin:.4rem 0 0;padding-left:1.4rem}
.prose .kh-inhoud li{padding:.1rem 0}
.rubriekskop{margin:0 0 .6rem}.prose .rubriekskop img{width:min(22rem,100%);height:auto;display:block;margin:0 0 .4rem}
.auteur{font-style:italic;color:var(--grijs);margin:0 0 1.4rem}
.kh-inhoud a{color:var(--inkt);text-decoration:none;border-bottom:1px dotted var(--lijn)}.kh-inhoud a:hover{color:var(--rood)}
/* het bestuur: portretten in een raster, naam en functie eronder */
.prose .personen{display:grid;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));gap:1.5rem 1.25rem;margin:1.5rem 0 2rem;max-width:44rem}
.persoon{margin:0;text-align:center}
.persoon img{width:7.5rem;height:7.5rem;border-radius:50%;object-fit:cover;margin:0 auto .6rem;display:block;filter:sepia(.12)}
.persoon figcaption{font-size:.95rem;line-height:1.35}.persoon b{font-weight:600;display:block}
.persoon .jaren{display:block;font-size:.85rem;font-style:italic;color:var(--grijs);font-variant-numeric:lining-nums}

/* kaderstuk in een Kinkhoorn-artikel (bijv. een korte biografie) */
.prose .kader{background:#fffdf7;border:1px solid #e4ddcd;border-radius:.5rem;padding:1rem 1.25rem;margin:1.75rem 0}
.prose .kader h3{margin-top:0}
.prose .kader p:last-child{margin-bottom:0}

/* genealogische lijstjes (Kinkhoorn 16–19): geen lijnen, smalle nummerkolom */
.prose table.genealogie{border-collapse:collapse;margin:.5rem 0 1rem}
.prose table.genealogie td{border:0;padding:.1rem .6rem .1rem 0;vertical-align:top}
.prose table.genealogie td:first-child{white-space:nowrap}
.prose table.genealogie td p{margin:0}
.prose img.teken{display:inline;height:2.4em;width:auto;vertical-align:middle;margin:0 .25em;filter:none}

/* de interactieve stamboom vindbaar (2026-09-14): uitgelichte menuregel, uitnodiging op de beginpagina, verwijzingen onder verhalen */
.uitgelicht-nav{display:flex;align-items:center;gap:.6rem;margin:0 0 1.5rem;padding:.6rem .85rem;border:1px solid var(--lijn);border-radius:.5rem;background:#fffdf7;color:var(--inkt);text-decoration:none;font-size:.95rem;line-height:1.2}
.uitgelicht-nav:hover{border-color:var(--olijf);color:var(--rood)}
.uitgelicht-nav.is-hier{border-color:var(--olijf);background:#f1f0e2}
.uitgelicht-nav__boom{width:1.35rem;height:1.35rem;flex:none;fill:none;stroke:var(--olijf);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.uitgelicht-nav__tekst{flex:1;font-variant:small-caps;letter-spacing:.06em}
.nieuw-pil{flex:none;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:var(--olijf);border-radius:999px;padding:.2rem .5rem .15rem;line-height:1}
.mnav__paneel .uitgelicht-nav{margin:.75rem 0 1.25rem}
.uitnodiging{display:flex;align-items:center;gap:1rem;max-width:36rem;margin:0 0 3.5rem;padding:1rem 0;border-top:1px solid var(--lijn);color:var(--inkt);text-decoration:none;line-height:1.35}
.uitnodiging:hover b{color:var(--rood)}
.uitnodiging__boom{width:1.75rem;height:1.75rem;flex:none;fill:none;stroke:var(--olijf);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.uitnodiging__tekst{flex:1;font-size:1.05rem}.uitnodiging b{font-weight:600}
.uitnodiging__sub{display:block;color:var(--grijs);font-style:italic;font-size:.95rem}
.uitnodiging__pijl{flex:none;color:var(--rood);font-size:1.5rem;line-height:1}
.uitnodiging .nieuw-pil{vertical-align:.2em;margin-left:.15rem}
@media(max-width:44rem){.uitnodiging{margin-bottom:2.5rem}}
.in-stamboom{clear:both;max-width:36rem;margin:2.5rem 0 0;padding:1rem 1.25rem 1.1rem;border:1px solid var(--lijn);border-radius:.5rem;background:#fffdf7}
.in-stamboom .klein-kop{margin-bottom:.5rem}
.in-stamboom ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem .5rem}
.in-stamboom li a{display:inline-block;padding:.3rem .7rem;border:1px solid var(--lijn);border-radius:999px;color:var(--inkt);text-decoration:none;font-size:.95rem;background:var(--papier)}
.in-stamboom li a:hover{border-color:var(--olijf);color:var(--rood)}
.in-stamboom li a small{color:var(--grijs);font-style:italic;margin-left:.2rem}
.in-stamboom__meer{margin:.75rem 0 0;font-size:.9rem;font-style:italic}.in-stamboom__meer a{color:var(--rood);text-decoration:none}
