@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Condensed:wght@400;600;700&family=Noto+Serif:wght@400;500&display=swap');
:root{--wine:#853b4c;--ink:#383431;--muted:#706862;--sand:#f7eddf;--line:#e5ddd4}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#fff;font:17px/1.8 'Noto Serif',Georgia,serif}a{color:var(--wine);text-underline-offset:5px}a:hover{color:#512232}a:focus-visible,summary:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--wine);outline-offset:5px}.shell{width:min(1120px,calc(100% - 64px));margin:auto}.demo{background:var(--wine);color:white;text-align:center;font:14px/1.4 Arial,sans-serif;padding:8px 16px}.header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:120px}header{border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:16px;text-decoration:none}.brand img{width:90px;height:auto}.brand span{font:600 17px/1.3 'Noto Sans Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.07em}nav{display:flex;gap:25px;align-items:center}header nav{font:16px 'Noto Sans Condensed',Arial,sans-serif}header nav>a{text-decoration:none;color:var(--ink)}.menu{position:relative}.menu summary{cursor:pointer;color:var(--wine);font-weight:700;padding:16px 0}.menu>div{position:absolute;z-index:10;right:0;top:100%;width:290px;box-shadow:0 8px 25px #0002;background:white;border-top:3px solid var(--wine);padding:10px}.menu a{display:block;padding:12px;text-decoration:none;line-height:1.5}.menu a:hover{background:var(--sand)}form{display:flex;border-bottom:1px solid #b8afa5;max-width:135px}input{width:100%;min-width:0;border:0;font:16px 'Noto Sans Condensed',Arial;background:transparent;padding:6px}button{border:0;background:transparent;cursor:pointer;font:25px Arial;color:var(--wine)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}h1,h2,h3{font-family:'Noto Sans Condensed',Arial,sans-serif;line-height:1.2;font-weight:600}h1{font-size:clamp(36px,4.5vw,56px);color:var(--wine);margin:13px 0 24px}h2{font-size:32px}h3{font-size:25px}.eyebrow{font:600 14px/1.4 'Noto Sans Condensed',Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--wine)}.intro{padding:60px 0 45px;max-width:860px}.intro p{max-width:780px}.lead{font-size:23px;line-height:1.6}.section-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:10px 0}.section-heading h2{margin:10px 0}.section-heading a{font:18px 'Noto Sans Condensed',Arial}.post-card{display:grid;grid-template-columns:35% 1fr;gap:55px;align-items:center;padding:40px 0;border-bottom:1px solid var(--line)}.post-card h2{font-size:32px;text-transform:uppercase;margin:10px 0 18px}.post-card h2 a{color:var(--ink);text-decoration:none}.post-card p{margin:12px 0 22px}.visual img{display:block;width:100%;max-height:290px;object-fit:contain}.read,.back{display:inline-block;font:600 16px/1.6 'Noto Sans Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;padding:8px 0}.missing-image{min-height:210px;display:flex;flex-direction:column;justify-content:center;text-align:center;background:var(--sand);color:var(--muted);padding:25px;font:20px/1.6 'Noto Sans Condensed',Arial}.missing-image small{font-size:15px}.abc-teaser{padding:40px;margin-top:55px;margin-bottom:70px;background:var(--sand)}.abc-teaser p{max-width:800px}.abc-teaser h2{margin:14px 0}footer{display:flex;gap:26px;flex-wrap:wrap;justify-content:space-between;border-top:1px solid var(--line);padding:30px 0;font:15px/1.6 'Noto Sans Condensed',Arial;color:var(--muted)}.article-wrap{max-width:790px;margin:40px auto 75px;padding:0 28px}.article-wrap .back{margin-bottom:30px}.reference{font-size:16px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:25px}figure{margin:35px 0 45px}figure img{max-width:100%;max-height:450px;display:block;margin:auto;object-fit:contain}.prose{font-size:18px;line-height:1.9}.prose h2{margin:55px 0 23px;color:var(--wine);border-top:1px solid var(--line);padding-top:28px;font-size:32px}.prose h3{margin:32px 0 15px}.prose p{margin:0 0 20px}.prose blockquote{margin:30px 0;padding:15px 25px;border-left:3px solid var(--wine);background:var(--sand)}.prose blockquote p{margin:0}.notice{font:15px/1.6 Arial;padding:18px;background:#f6f1eb;color:#62564f}.keywords{border-top:1px solid var(--line);margin-top:50px;padding-top:20px}.keywords h2{font-size:25px}.keywords>div{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:25px}.keywords a{font:16px/1.5 'Noto Sans Condensed',Arial;border:1px solid var(--line);padding:6px 14px;text-decoration:none}.abc-list{max-width:860px;margin-bottom:80px}.letters{flex-wrap:wrap;gap:10px;padding-bottom:25px}.letters a{width:43px;text-align:center;background:var(--sand);text-decoration:none;font:600 20px/43px 'Noto Sans Condensed',Arial}.letter-section{display:grid;grid-template-columns:75px 1fr;gap:22px;border-top:1px solid var(--line);padding:20px 0;scroll-margin-top:20px}.letter-section h2{color:var(--wine);font-size:42px;margin:0}.keyword-row{display:grid;grid-template-columns:35% 1fr;gap:15px;padding:15px 0;text-decoration:none;border-bottom:1px solid #eee9e3}.keyword-row strong{font:600 22px/1.4 'Noto Sans Condensed',Arial}.keyword-row span{font-size:15px;color:var(--muted)}.keyword-row:hover strong{text-decoration:underline}@media(max-width:850px){.header{flex-wrap:wrap;padding:20px 0;gap:12px}.header nav{width:100%;justify-content:space-between;gap:14px}.brand img{width:70px}.intro{padding-top:35px}.post-card{gap:30px}}@media(max-width:580px){body{font-size:16px}.shell{width:calc(100% - 36px)}.brand span{font-size:16px}.header nav{flex-wrap:wrap}.header nav>a{font-size:14px}form{max-width:100px}.menu>div{right:-100px;max-width:calc(100vw - 36px)}.post-card{grid-template-columns:1fr;gap:18px;padding:30px 0}.visual img{max-height:240px}.post-card h2{font-size:29px}.section-heading{align-items:start;gap:20px}.section-heading h2{font-size:26px}.section-heading a{padding-top:13px;white-space:nowrap;font-size:16px}.lead{font-size:20px}.abc-teaser{padding:25px}.article-wrap{padding:0 20px}.prose{font-size:17px}.keyword-row{grid-template-columns:1fr;gap:4px}.letter-section{grid-template-columns:40px 1fr;gap:15px}footer{flex-direction:column;gap:10px}}

.abc-subtitle{font:400 17px/1.6 'Noto Sans Condensed',Arial,sans-serif;color:var(--muted);margin:-8px 0 30px}.abc-introduction{max-width:720px}.abc-introduction h2{font-size:25px;color:var(--ink);margin:0 0 10px}.abc-introduction p{font-size:18px;line-height:1.8;margin:0}@media(max-width:580px){.abc-introduction h2{font-size:23px}.abc-introduction p{font-size:17px}.abc-subtitle{margin-bottom:24px}}

.abc-hero{max-width:1120px;text-align:center;padding-top:48px;padding-bottom:40px}.abc-hero h1{font-size:clamp(28px,3.4vw,43px);text-transform:uppercase;letter-spacing:.025em;line-height:1.22;margin:0 0 30px}.abc-hero .abc-introduction{margin:auto;max-width:790px}.abc-hero .abc-introduction h2{font-family:'Noto Serif',Georgia,serif;font-size:22px;font-weight:400;margin-bottom:10px}.abc-hero .abc-introduction p{margin:auto}.abc-directory-title{font-size:22px;color:var(--muted);font-weight:400;margin:0 0 22px}@media(max-width:580px){.abc-hero{padding-top:34px;padding-bottom:32px}.abc-hero h1{font-size:28px}.abc-hero .abc-introduction h2{font-size:20px}.abc-directory-title{font-size:20px}}

.keyword-row{display:block}.keyword-row strong{font-weight:400}.letter-section:has(.keyword-row){min-height:90px}

.letters{gap:6px;padding-bottom:20px}.letters a,.letters .letter-empty{display:inline-block;width:32px;text-align:center;font:400 16px/34px 'Noto Sans Condensed',Arial,sans-serif}.letters .letter-empty{color:#85807b;background:#f5f3f0;cursor:default}.letter-section{grid-template-columns:50px 1fr;gap:16px;padding:12px 0}.letter-section:has(.keyword-row){min-height:0}.letter-section h2{font-size:30px}.keyword-row{padding:9px 0}.keyword-row strong{font-size:18px;line-height:1.5}.abc-directory-title{font-size:20px}.abc-hero h1{font-size:clamp(26px,3vw,36px)}@media(max-width:580px){.letter-section{grid-template-columns:35px 1fr;gap:12px}.letter-section h2{font-size:26px}.keyword-row strong{font-size:17px}}

.welcome-hero{background:#f8ecd9;border-top:3px solid #383431;text-align:center;padding:62px 0 70px}.welcome-hero .shell{max-width:1220px}.welcome-hero .eyebrow{font-size:16px;margin:0 0 26px;color:#993f51}.welcome-hero h1{font-family:Arial,sans-serif;font-weight:700;font-size:clamp(30px,3.6vw,48px);line-height:1.2;text-transform:uppercase;letter-spacing:.02em;color:#993f51;margin:0 0 40px}.welcome-hero p:not(.eyebrow){max-width:1030px;margin:0 auto;font-size:clamp(18px,2vw,25px);line-height:1.8}.welcome-hero p strong{font-weight:400}.welcome-hero .welcome-action{margin-top:25px!important}.welcome-button{display:block;max-width:820px;margin:auto;background:#be303e;color:white;border-radius:999px;padding:12px 26px;font-size:18px;font-weight:600;line-height:1.5;text-decoration:none}.welcome-button:hover{background:#a62432;color:white}@media(max-width:580px){.welcome-hero{padding:38px 0 44px}.welcome-hero .eyebrow{font-size:14px;margin-bottom:20px}.welcome-hero h1{font-size:30px;margin-bottom:24px}.welcome-hero p:not(.eyebrow){font-size:18px;line-height:1.75}.welcome-button{font-size:16px;padding:13px 20px}}

.abc-hero{max-width:1220px;background:#f2e5cd;border-top:3px solid #383431;padding:24px 34px 30px;margin-bottom:36px;color:#993f51}.abc-hero h1{color:#993f51;font-size:clamp(26px,3vw,38px);line-height:1.25;margin-bottom:28px}.abc-hero .abc-introduction{max-width:1050px}.abc-hero .abc-introduction h2{color:#993f51;font-size:23px;margin-bottom:24px}.abc-hero .abc-introduction p{color:#993f51;font-size:21px;line-height:1.7;max-width:none}@media(max-width:580px){.abc-hero{padding:25px 18px 30px;margin-bottom:26px}.abc-hero h1{font-size:26px;margin-bottom:23px}.abc-hero .abc-introduction h2{font-size:20px;margin-bottom:16px}.abc-hero .abc-introduction p{font-size:17px}}

body:has(.article-wrap){background:#f8ecd9}body:has(.article-wrap) header,body:has(.article-wrap) .demo{background:#fff}body:has(.article-wrap) .demo{background:var(--wine)}.article-wrap h1,.article-wrap h2,.article-wrap h3{color:#993f51}.article-wrap h1{font-size:clamp(32px,4vw,46px)}.article-wrap .prose h2{font-size:29px}.article-wrap .prose h3{font-size:23px}.article-wrap .prose{color:#383431}.article-wrap .reference{color:#70605a}.article-wrap .prose blockquote{background:#f2e5cd;border-left-color:#993f51}.article-wrap .keywords a{border-color:#d9c6ab;background:#f2e5cd;color:#853b4c}.article-wrap .keywords a:hover{background:#ead7b9}.article-wrap .reference,.article-wrap .prose h2,.article-wrap .keywords{border-color:#dfcdb5}@media(max-width:580px){.article-wrap h1{font-size:32px}.article-wrap .prose h2{font-size:26px}.article-wrap .prose h3{font-size:22px}}

.post-card h2,.post-card h2 a,.section-heading h2,.abc-teaser h2{color:#993f51}.post-card h2 a:hover{color:#7b3041}@media(min-width:581px){.post-card{grid-template-columns:40% minmax(0,1fr);gap:40px}}.article-wrap figure:has(img[src*='schildkroeten']){width:min(860px,calc(100vw - 40px));max-width:none;position:relative;left:50%;transform:translateX(-50%)}.article-wrap figure img[src*='schildkroeten']{width:100%;height:auto;max-height:none}

/* Match the reference: a 40% image column with natural image proportions. */
.overview{max-width:1000px}
.overview .post-card{grid-template-columns:40% minmax(0,1fr);gap:0;align-items:center;padding:36px 0}
.overview .post-card .visual{width:100%;margin:0;padding:0;background:transparent;align-self:center}
.overview .post-card .visual img{display:block;width:100%;height:auto;max-width:100%;max-height:none;margin:0}
.overview .post-card>div:last-child{min-width:0;padding:0 8%;align-self:center}
.overview .post-card>div:last-child>.eyebrow{margin:0 0 14px}
.overview .post-card h2{margin:0 0 18px}
.overview .post-card p{margin:0 0 20px}
@media(max-width:580px){.overview .post-card{grid-template-columns:1fr;gap:24px;padding:28px 0}.overview .post-card>div:last-child{padding:0}}

/* Slightly enlarge Burnout while preserving the shared text alignment. */
@media(min-width:581px){.overview .post-card .visual img[src*="burnout"]{width:105%;max-width:105%}}

.prose ul{padding-left:1.5em;margin:18px 0 26px;list-style-type:disc}.prose li{padding-left:.25em;margin:8px 0}.prose li p:last-child{margin-bottom:0}.reading-time{font-size:15px;color:var(--muted);margin:12px 0 24px}

.prose ol{padding-left:1.7em;margin:22px 0;list-style-type:decimal}.prose ol>li{padding-left:.35em;margin:22px 0}.prose li>h3:first-child{margin-top:0}.prose .section-reading-time{font-size:15px;margin:-8px 0 24px}.prose ul li::marker,.prose ol li::marker{color:var(--wine)}
