/* Compacte kop en kleurrijk overzicht van het familiearchief. */
.hof-banner img{height:clamp(145px,16vw,230px);max-height:230px;object-fit:cover;object-position:center 62%}
.hof-banner figcaption{padding:5px 6%;font-size:13px;line-height:1.45;background:#153f43}
.hof-banner figcaption span{font-size:11px;color:#e6d4ae}
header{height:72px}.brand{font-size:22px}.mark{font-size:32px}
.mainmenu{margin-top:12px;gap:5px}
.mainmenu button,.mainmenu .book-menu-link{flex:1 1 122px;padding:8px 10px;border:1px solid #aebfba;border-radius:5px;font:11px/1.5 system-ui,sans-serif;background:#f9fcf8;color:#214b4b;text-align:center;text-decoration:none}
.mainmenu button:hover,.mainmenu .book-menu-link:hover{background:#e0eee7}
.mainmenu button.active{background:#175760;border-color:#175760;color:white}
.mainmenu .book-menu-link{background:#f2ddb4;border-color:#d6b46e;color:#593f15;font-weight:650}
.usage-notice{margin-top:16px;padding:10px 16px;background:rgba(255,251,241,.96);border-left-color:#ba833e;line-height:1.5}
.usage-notice p{margin:3px 0}
.intro{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);column-gap:30px;align-items:start;min-height:0;padding:22px 28px;margin:20px 0 26px;border:1px solid #2b7174;border-left:5px solid #ddb36c;border-radius:12px;background:linear-gradient(115deg,#153f43 5%,#1c6167 76%,#2b7576);box-shadow:0 8px 24px #153f4310;color:#fffaf0}
.intro>.eyebrow,.intro>h1,.intro>p{grid-column:1}
.intro>.eyebrow{color:#f2d59b;font-size:9px;letter-spacing:1.7px}
.intro h1{font-size:clamp(31px,3.1vw,47px);line-height:1.08;letter-spacing:-.9px;margin:9px 0 10px;color:#fffaf0}
.intro h1 em{color:#f1cc89}
.intro p{color:#dfefeb;font-size:13px;line-height:1.6;margin:0;max-width:520px}
.intro p br{display:none}
.intro .stats{position:static;grid-column:2;grid-row:1/4;align-self:center;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
.intro .stats>div{padding:15px 10px 12px;border:1px solid #c2ded344;border-top:3px solid #f0ce8e;border-radius:8px;background:#ffffff0f;min-width:0}
.intro .stats strong{font:clamp(23px,2.3vw,34px)/1.2 Georgia,serif;color:#fff9e8;white-space:nowrap}
.intro .stats span{display:block;margin-top:6px;font-size:8px;letter-spacing:1.2px;color:#dfefeb}
.book-reader{background:#eef3ee}.book-reader header{margin:0;padding:0 5%;background:#173f43;color:#fff9e9;border:0;height:76px}
.book-reader .brand small{color:#e6d5af}.book-reader .language-switch a{font-size:11px}
.book-main{max-width:1600px;padding:22px 5% 35px}.book-back{font-size:12px;color:#245a58;text-underline-offset:3px}
.book-heading{display:flex;align-items:center;justify-content:space-between;gap:30px;margin:16px 0 20px;padding:22px 26px;background:#fffaf0;border:1px solid #d8dfd4;border-left:5px solid #c69b54;border-radius:10px}
.book-heading h1{font:clamp(28px,3.6vw,43px)/1.14 Georgia,serif;letter-spacing:-.6px;margin:8px 0 10px;color:#173f43}
.book-heading p{max-width:750px;font-size:13px;margin:7px 0;color:#4b615b}.book-info{font-size:11px!important;color:#81704b!important}
.book-open{display:inline-block;flex-shrink:0;padding:12px 18px;border:1px solid #175760;border-radius:5px;background:#175760;color:white;text-decoration:none;font:13px/1.5 system-ui,sans-serif;text-align:center;cursor:pointer}
.book-viewer{display:block;width:100%;height:78dvh;min-height:520px;border:1px solid #9eafaa;background:#d6ddda;border-radius:8px}
.book-mobile-hint,.book-permission{font-size:11px;color:#52675f}.book-permission{margin-top:24px}.book-permission a{color:#245a58}.book-unavailable,.book-manage{background:#fffaf0;padding:20px;border:1px solid #d5ded3;border-radius:8px}.book-manage{margin-top:22px}.book-manage summary{cursor:pointer;font-weight:650}.book-manage form{display:flex;gap:16px;flex-wrap:wrap;align-items:end}.book-manage label{display:flex;flex-direction:column;gap:6px;font-size:12px}.book-manage input{padding:9px;max-width:100%}.book-manage #book-status{flex-basis:100%}
@media(max-width:900px){.intro{column-gap:20px;padding:20px}.intro .stats{gap:6px}.intro .stats>div{padding:12px 7px}.intro .stats strong{font-size:25px}.intro .stats span{font-size:7px;letter-spacing:.8px}.book-heading{align-items:flex-start;flex-direction:column;gap:10px}}
@media(max-width:700px){.hof-banner img{height:135px;object-position:center 62%}.hof-banner figcaption{font-size:11px}.hof-banner figcaption span{font-size:10px}header{height:auto;min-height:70px;padding:12px 0;gap:10px}.brand{font-size:19px;letter-spacing:2px}.brand small{font-size:7px;padding-left:8px}.intro{grid-template-columns:1fr;padding:20px;margin:16px 0 20px}.intro h1{font-size:36px}.intro .stats{grid-column:1;grid-row:auto;margin-top:18px;gap:10px}.intro .stats>div{padding:10px}.intro .stats strong{font-size:27px}.intro .stats span{font-size:8px}.intro p{font-size:12px}.book-reader header{height:auto;min-height:72px;padding:12px 5%}.book-reader .brand small{display:none}.book-main{padding:18px 4%}.book-heading{padding:18px}.book-heading h1{font-size:30px}.book-viewer{height:70dvh;min-height:420px}.book-open{width:100%}.mainmenu button,.mainmenu .book-menu-link{flex-basis:110px;font-size:10px;padding:7px 8px}}
@media print{.book-reader header,.book-back,.book-manage,.book-mobile-hint{display:none}.intro{box-shadow:none}}
.book-viewer{height:auto;min-height:420px;background:#dfe5e0;overflow:visible}.book-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px;background:#fbfcf8;border-bottom:1px solid #a8bab1;border-radius:8px 8px 0 0;position:sticky;top:0;z-index:2;font-size:12px}.book-toolbar button{padding:8px 12px;color:#174e52;border:1px solid #afc1b7;background:white;border-radius:4px;font-size:12px}.book-toolbar button:disabled{opacity:.45;cursor:default}.book-toolbar form,.book-toolbar label{display:flex;align-items:center;gap:7px}.book-toolbar input{padding:6px;flex:none;width:66px;font-size:12px}.book-toolbar select{padding:7px 9px;font-size:12px}.book-toolbar p{font-size:11px;color:#5c7166;margin:0 0 0 auto}.book-canvas-frame{padding:18px;overflow-x:auto;min-height:420px}.book-canvas-frame canvas{display:block;margin:0 auto;background:white;box-shadow:0 3px 14px #173f4322}.book-canvas-frame canvas[hidden]{display:none}.book-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:700px){.book-toolbar{gap:8px;padding:10px}.book-toolbar p{flex-basis:100%;margin:0}.book-toolbar button{padding:7px 9px}.book-toolbar select{max-width:145px}}
.book-toolbar #book-wide{background:#175760;border-color:#175760;color:white;cursor:pointer}
.book-wide-open{overflow:hidden}
.book-viewer.book-viewer-wide{position:fixed;inset:0;z-index:1000;width:100%;height:100dvh;min-height:0;display:flex;flex-direction:column;border:0;border-radius:0}
.book-viewer-wide .book-toolbar{position:static;flex:none;border-radius:0}
.book-viewer-wide .book-canvas-frame{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}