:root{--blue:#193c50;--ink:#203c49;--paper:#faf8f2;--sand:#eae0cb;--gold:#a68243;font-size:18px}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.65}a{color:inherit;text-underline-offset:5px}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #ab722c;outline-offset:5px}.wrap{width:min(1280px,calc(100% - 100px));margin:auto}header{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:30px 0 22px;border-bottom:1px solid #d9d8d0}.brand{text-decoration:none;font-family:Georgia,serif;font-size:1.8rem;letter-spacing:-1px;line-height:1.1;white-space:nowrap}.brand span{display:block;font:18px Arial,sans-serif;letter-spacing:1px;margin-top:10px}nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 22px}nav a{text-decoration:none;font-size:1rem;padding:8px 0}nav a:hover,nav a[aria-current]{border-bottom:2px solid var(--gold)}#menu{display:none}.access{display:flex;gap:8px;align-items:center;justify-content:flex-end;padding-top:14px}.access span{font-size:1rem}.access button{border:1px solid #cecec4;background:transparent;min-width:44px;min-height:44px;color:var(--ink)}.access button[aria-pressed=true]{background:var(--blue);color:white}.hero{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding-top:55px;padding-bottom:75px}.eyebrow,.number{text-transform:uppercase;letter-spacing:2px;font-size:1rem;line-height:1.5}.eyebrow{color:#657784;margin:0 0 22px}h1,h2,h3,blockquote{font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.1}h1{font-size:clamp(2.5rem,4.3vw,4.4rem);letter-spacing:-2px;margin:0 0 30px}h1 em,h3 em{color:#9a743c;font-weight:400}h2{font-size:clamp(2rem,3.4vw,3.3rem);letter-spacing:-1px;margin:0 0 26px}h3{font-size:1.65rem;margin:22px 0}.lead{font-size:1.2rem;line-height:1.65;max-width:720px}p{margin-top:0;margin-bottom:1.2em}.actions{display:flex;flex-wrap:wrap;gap:25px;align-items:center;margin:35px 0}.button{border:1px solid var(--blue);padding:15px 24px;background:var(--blue);color:#fff;text-decoration:none;display:inline-flex;align-items:center;justify-content:space-between;gap:25px;line-height:1.5}.button:hover{background:#2d5266}.light{background:var(--paper);color:var(--blue);border-color:var(--paper)}.textlink{display:inline-flex;gap:18px;align-items:center;font-weight:500}.subtle{color:#657784;font-size:1rem}.portrait{margin:0;overflow:hidden}.portrait img{width:100%;height:540px;object-fit:cover;object-position:48% 35%;clip-path:inset(0 3% 0 0);transform:scale(1.065);transform-origin:left center}.portrait figcaption{position:relative;background:var(--paper);padding-top:18px;font:italic 1rem Georgia,serif}.blue{background:var(--blue);color:var(--paper);padding:70px 0}.blue .eyebrow{color:#d0c4a9}.split{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.section{padding-top:80px;padding-bottom:60px}.book-statement{background:#e9e1cf;color:var(--blue);border:1px solid #d4c3a5;padding:45px;max-width:360px;margin:auto;box-shadow:10px 12px 0 #0d26362b;aspect-ratio:.72;display:flex;flex-direction:column;justify-content:space-between}.book-statement span{font-size:1rem;letter-spacing:4px}.book-statement h3{font-size:2.7rem;line-height:1.03;margin:30px 0}.book-statement p{font-size:1rem;margin:0}.book-display{background:#eee8da;padding:45px;text-align:center}.cover{width:100%;max-width:380px;display:block;margin:auto;box-shadow:15px 20px 24px #26333b26}.sand{padding:50px;background:var(--sand)}blockquote{font-size:2.25rem;margin:0 0 25px;line-height:1.3}.sand>p:last-child{margin-bottom:0}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:44px}.three article{border-top:1px solid #9b9c91;padding-top:25px}.number{color:#697b83}.intro{padding-top:65px;max-width:1280px}.intro h1{max-width:950px}.intro .lead{max-width:850px}.editorial{width:100%;max-height:550px;object-fit:cover}.desk{filter:brightness(1.13);object-position:70% center}.building{width:100%;max-height:650px;object-fit:contain}.note{padding:23px;background:#eee7d8;border-left:3px solid var(--gold)}.note p:last-child{margin-bottom:0}.reading{max-width:760px;padding-top:50px;padding-bottom:40px}.reading p{font-family:Georgia,serif;line-height:1.85;font-size:1.12rem}.artwork{display:block;width:100%}form{display:grid;gap:12px}label{margin-top:12px}input,select,textarea{width:100%;min-width:0;background:#fffefa;border:1px solid #8e9a9d;border-radius:0;padding:12px;color:var(--ink)}textarea{resize:vertical}form button{margin-top:15px}footer{margin-top:70px;background:#eae8df;padding:45px 0}.footer{display:flex;justify-content:space-between;gap:40px}.footer p{margin:18px 0 0}.skip{position:absolute;top:-100px;background:white;padding:15px;z-index:20}.skip:focus{top:0}#size-status:empty{display:none}img{max-width:100%}button{min-height:44px}body{overflow-wrap:break-word}
@media(min-width:1600px){.hero h1{font-size:4.4rem}}@media(max-width:1100px){header{align-items:flex-start}.brand span{white-space:normal}nav{gap:8px 18px}.hero,.split{gap:50px}.hero h1{font-size:3rem}.wrap{width:calc(100% - 60px)}.portrait img{height:470px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}header{position:relative;flex-wrap:wrap;gap:20px;padding-top:24px}.brand{font-size:1.6rem}.brand span{letter-spacing:0;font-size:18px}#menu{display:block;background:transparent;border:1px solid #b1b8b6;padding:8px 12px;color:var(--ink)}nav{display:none;flex-direction:column;width:100%;gap:0}nav.open{display:flex}nav a{padding:12px 0;border-bottom:1px solid #d5d6ce}.access{justify-content:flex-start;flex-wrap:wrap;padding-top:18px}.hero,.split{grid-template-columns:1fr;gap:35px}.hero{padding-top:40px;padding-bottom:45px}.hero h1,h1{font-size:2.5rem;letter-spacing:-1px}.hero .portrait{max-width:500px}.portrait img{height:440px}.actions{gap:22px}.button{padding:14px 20px}.section{padding-top:45px;padding-bottom:35px}.blue{padding:45px 0}.book-statement{width:85%;padding:32px;max-width:330px}.book-statement h3{font-size:2.5rem}.sand{padding:28px 24px}blockquote{font-size:1.8rem}.three{grid-template-columns:1fr;gap:35px}.intro{padding-top:40px}.book-display{padding:30px}.cover{width:68%}.footer{flex-direction:column;gap:25px}footer{margin-top:40px}.reading{padding-top:35px}.lead{font-size:1.1rem}.editorial{max-height:440px}.desk{object-fit:contain}h2{font-size:2rem}}
@media(prefers-reduced-motion:no-preference){a,button{transition:background .15s,color .15s}}@media print{header,.access,footer,#menu,.actions{display:none}.wrap{width:100%}body{background:white;color:black}.reading{max-width:none}}
/* Opmerkingen Hans, 31 oktober: Arial voor website, Georgia voor leesfragmenten. */
:root{--sand:#f4f0e8;--paper:#faf8f2;--gold:#ad843e}h1,h2,h3,blockquote,.brand,.portrait figcaption{font-family:Arial,Helvetica,sans-serif}h1,h2,h3{font-weight:500}h1{line-height:1.12;letter-spacing:-1.4px}h1 em,h3 em{font-style:normal}.book-subtitle{font:400 1.5rem/1.45 Arial,Helvetica,sans-serif;max-width:730px;color:var(--blue);margin-bottom:28px}.hero{grid-template-columns:1.1fr .8fr}.hero .book-display{margin:0;padding:45px 25px;background:var(--sand)}.hero .cover{width:100%;max-width:380px}.journey-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.journey-grid img{aspect-ratio:1.5;object-fit:contain}.journey-grid article{padding-bottom:20px}.reading p,.reading blockquote{font-family:Georgia,'Times New Roman',serif}.reading h2{margin-top:40px}.reading h2:first-child{margin-top:0}.reading .source-note{font:1rem/1.6 Arial,Helvetica,sans-serif;color:#586f7a;border-top:1px solid #cbd0ce;padding-top:24px;margin-top:40px}.article-art{max-width:900px;padding-top:35px}.article-art img{max-height:500px;object-fit:contain}.three img{aspect-ratio:1.5;object-fit:contain}.fragment-nav{display:flex;flex-wrap:wrap;gap:25px;justify-content:flex-start;border-bottom:1px solid #cbd0ce;padding-bottom:22px;margin-bottom:40px}.fragment-nav a{font-family:Arial,sans-serif}.portrait img{object-position:48% 35%}
@media(max-width:760px){.hero{grid-template-columns:1fr}.hero .book-display{max-width:440px;width:100%;margin:auto}.journey-grid{grid-template-columns:1fr}.journey-grid img{max-height:340px}.book-subtitle{font-size:1.4rem}.hero h1{font-size:2.5rem}.journey-grid h3{margin-top:14px}.fragment-nav{display:flex}.article-art{padding-top:25px}}

/* Aanpassingen Hans, 1 november: koppen vet en blauw; dialoogopmaak klein met kleine kapitalen; reisblok (dialoog + aquarel boven, boektekst eronder); portret niet meer bijsnijden aan de bovenkant. */
h1,h2,h3{font-weight:700;color:var(--blue)}
.portrait img{object-position:50% 12%;transform:none;clip-path:none;height:560px}
.reis-blok{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin:36px 0 22px}
.reis-blok>div:first-child{display:flex;justify-content:center}
.reis-blok .dialoog{max-width:330px}
.reis-blok .aquarel img{width:100%;display:block}
.dialoog{margin:0}
.dialoog .r{font-family:Georgia,serif;font-size:1.02rem;line-height:1.5;color:var(--blue);margin:0 0 1px}
.dialoog .w{font-family:Arial,Helvetica,sans-serif;font-variant:small-caps;text-transform:lowercase;letter-spacing:.07em;font-size:.82rem;color:#7a8690;margin:0 0 12px}
.dialoog .n{font-family:Georgia,serif;font-style:italic;color:#7a8690;font-size:.98rem;margin:4px 0 12px}
.boektekst{max-width:650px;margin:0 auto;font-size:1.12rem;line-height:1.72}
.boektekst p{font-size:1.12rem}
@media(max-width:760px){.reis-blok{grid-template-columns:1fr;gap:22px}}

/* 1 nov (2): kleuren exact afgestemd op het boek, koppen web-leesbaar en compacter */
:root{--boekblauw:#0D1D53}
h1,h2,h3{color:var(--boekblauw)}
h1{font-size:clamp(2rem,3.2vw,2.7rem);letter-spacing:-1px}
.hero h1{font-size:clamp(1.9rem,2.6vw,2.2rem)}
h2{font-size:1.4rem;line-height:1.22;margin-bottom:14px}
h3{font-size:1.2rem}
.dialoog .r{color:var(--ink)}
.dialoog .w{color:#808080}

.luisterfoto{object-position:50% 10%}

/* 1 nov (3): koppen leesbaar op blauw; reisopmaak gecentreerd; intro gecentreerd; deel-pagina's; begeleidingsfoto */
.blue h1,.blue h2,.blue h3{color:#faf8f2}
.intro{text-align:center}
.intro .lead{margin-left:auto;margin-right:auto}
.reis-item{text-align:center}
.reis-blok>div:first-child{display:block}
.reis-blok .dialoog{max-width:360px;margin:0 auto;text-align:center}
.boektekst{text-align:center}
.editorial.desk{object-position:50% 8%}
.deel{text-align:center;padding:64px 0 26px}
.deel-num{display:inline-block;font-family:Georgia,serif;font-size:2.6rem;color:var(--boekblauw);background:#e6ecf5;width:70px;height:92px;line-height:92px;border-radius:4px}
.deel-label{letter-spacing:.22em;text-transform:uppercase;color:#8a93a3;font-size:.85rem;margin:16px 0 8px}
.deel-titel{color:var(--boekblauw);margin:0 0 8px}
.deel-sub{font-family:Georgia,serif;font-style:italic;color:#7a8690;font-size:1.1rem;margin:0 0 22px}
.deel-dialoog p{font-family:Georgia,serif;font-size:1.12rem;color:var(--ink);margin:4px 0;line-height:1.5}
.deel-dialoog .n{font-style:italic;color:#7a8690}

/* 1 nov (4): hele site gecentreerd, in lijn met De reis; koppen, leads en kaders gecentreerd. Lange leesteksten en formulieren blijven links. */
.hero{text-align:center}
.hero .lead,.hero .book-subtitle{margin-left:auto;margin-right:auto}
.hero .actions{justify-content:center}
.split{text-align:center}
.split .lead,.split .book-subtitle{margin-left:auto;margin-right:auto}
.split form{text-align:left}
.fragment-nav{justify-content:center}
.sand{text-align:center}
.reading h2{text-align:center}
/* koppen met een max-breedte ook echt centreren op brede schermen */
.intro h1,.intro .lead,.hero h1{margin-left:auto;margin-right:auto}
/* leeslinks die nog niet werken: zichtbaar maar lichter en niet aanklikbaar voor bezoekers */
.textlink.komt{color:#9aa4ac;pointer-events:none;cursor:default}
.textlink.komt:hover{text-decoration:none}
/* voorbeeldmodus (alleen voor Hans): verborgen pagina's worden klikbaar */
.preview .textlink.komt{color:var(--ink);pointer-events:auto;cursor:pointer}
.preview-flag{position:fixed;left:16px;bottom:16px;z-index:60;background:var(--boekblauw);color:#faf8f2;font:500 .82rem/1.3 Arial,Helvetica,sans-serif;padding:9px 14px;border-radius:5px;box-shadow:0 3px 12px #0003;max-width:min(92vw,320px)}
.preview-flag a{color:#cdd6ea;text-decoration:underline;margin-left:8px}
/* deel-teller op de postpagina's: gecentreerd, als rustig label */
.deelteller{text-align:center;margin:6px 0 24px}
.deelteller span{display:inline-block;background:#e6ecf5;color:var(--boekblauw);font:600 .8rem/1 Arial,Helvetica,sans-serif;letter-spacing:.09em;text-transform:uppercase;padding:8px 16px;border-radius:999px}

/* nog niet verschenen: tekst lichter, aquarel blijft vol */
.komt-kaart h3,.komt-kaart p{color:#9aa4ac}

/* één lettergrootte voor de tekstblokken, gelijk aan de intro */
.hero p:not([class]),.split p:not([class]){font-size:1.2rem;line-height:1.65}

/* omslag-flip op de boekpagina */
.flipcard{position:relative;width:100%;max-width:380px;margin:0 auto;perspective:1400px}
.flipcard-inner{position:relative;width:100%;transition:transform .7s ease;transform-style:preserve-3d}
.flipcard.flipped .flipcard-inner{transform:rotateY(180deg)}
.flipcard-face{display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.flipcard-front .cover,.flipcard-back .cover{width:100%;max-width:none;margin:0;display:block}
.flipcard-back{position:absolute;inset:0;transform:rotateY(180deg)}
.flip-btn{display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin:24px auto 0;border-radius:50%;border:1px solid var(--boekblauw);background:var(--paper);color:var(--boekblauw);cursor:pointer;transition:background .15s,color .15s}
.flip-btn:hover{background:var(--boekblauw);color:#faf8f2}
/* afwisselende reis: even hoofdstukken dialoog rechts, aquarel links */
@media(min-width:761px){.reis-item.alt .reis-blok>div:first-child{order:2}.reis-item.alt .reis-blok>div:last-child{order:1}}
/* colofon / credits, heel klein */
.colofon{max-width:760px;margin:30px auto 0;font-size:.72rem;line-height:1.55;color:#8a93a3;text-align:center}

/* flip op de homepage even groot als de hero-omslag */
.hero .flipcard{width:100%;max-width:380px}

@media(min-width:761px){.split.alt>*:first-child{order:2}.split.alt>*:last-child{order:1}}

.tweeluik h2{font-size:clamp(1.9rem,2.6vw,2.2rem);letter-spacing:-1px}

.afsluiter{background:var(--sand);padding:46px 44px;max-width:760px;margin:46px auto 0;text-align:center}
.afsluiter .vraag{font:italic 1.5rem/1.45 Georgia,'Times New Roman',serif;color:var(--boekblauw,#0d1d53);margin:0 0 16px}
.afsluiter .bridge{font-size:1.1rem;line-height:1.6;color:var(--ink);margin:0 auto 28px;max-width:560px}
.afsluiter .actions{display:flex;gap:26px;justify-content:center;align-items:center;flex-wrap:wrap}
@media(max-width:760px){.afsluiter{padding:34px 24px}}

.reading figure{margin:34px 0;text-align:center}
.reading figure img{max-width:100%;height:auto;display:block;margin:0 auto;border:1px solid #e4ded0}
.reading figure.model img{max-width:430px}
.reading ul{margin:0 0 22px;padding-left:24px;font-family:Georgia,'Times New Roman',serif}
.reading li{margin-bottom:8px;line-height:1.6}