/* blog.css — aanvullende styling voor bloggenerator (build-blog.js) Alleen blog-specifieke klassen. Kleuren en fonts erven van vera.css. */ /* Tag-chips op overzichtskaarten (fallback als use-case-tag elders gebonden is) */ .blog-tags { display: flex; flex-wrap: wrap; gap: 8px; } .num-card .use-case-tag { display: inline-block; } /* Artikelinhoud op postpagina's */ .blog-article { max-width: 720px; } .blog-article p { margin-bottom: 1.25em; } .blog-article h2 { margin: 1.8em 0 0.6em; font-size: 1.6rem; } .blog-article h3 { margin: 1.5em 0 0.5em; font-size: 1.25rem; } .blog-article ul, .blog-article ol { margin: 0 0 1.25em 1.4em; } .blog-article li { margin-bottom: 0.4em; } .blog-article a { text-decoration: underline; text-underline-offset: 3px; } .blog-article blockquote { margin: 1.5em 0; padding-left: 1.2em; border-left: 3px solid currentColor; opacity: 0.85; } .blog-article code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.9em; } .blog-article img { max-width: 100%; height: auto; } /* Compactere hero op blogpagina's (scoped via .page-blog op ) */ .page-blog .hero { min-height: 0; padding-top: 140px; /* fixed nav (±80px) + ademruimte; verlaag richting 120px voor strakker */ padding-bottom: 36px; /* ruimte onder datum/auteur-regel */ } .page-blog .hero-content { min-height: 0; } .page-blog .hero + section { padding-top: 24px; /* ruimte tussen hero en artikelkaart */ }