/* ── Blog-Artikel – baut auf person.css auf ── */
.article { max-width: 720px; margin: 0 auto; padding: clamp(44px,8vh,104px) 0 clamp(40px,6vh,72px); }
.article .eyebrow { font-size:.7rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; }
.article h1 { font-size:clamp(2rem,4.4vw,3.4rem); font-weight:300; letter-spacing:-.035em; line-height:1.08; margin-bottom:16px; }
.article-meta { font-size:.8rem; color:var(--muted); display:flex; gap:12px; align-items:center; margin-bottom:clamp(28px,5vh,44px); }
.article-meta .dot { width:3px; height:3px; border-radius:50%; background:#cbcbcb; }
.article-lead { font-size:1.15rem; line-height:1.65; color:#333; font-weight:300; margin-bottom:clamp(28px,4vh,40px); }
.article h2 { font-size:clamp(1.3rem,2.4vw,1.7rem); font-weight:400; letter-spacing:-.02em; margin:clamp(30px,5vh,48px) 0 14px; }
.article h3 { font-size:1.02rem; font-weight:500; margin:24px 0 8px; }
.article p { font-size:1rem; line-height:1.75; color:#333; margin-bottom:16px; }
.article ul, .article ol { margin:0 0 18px; padding-left:0; list-style:none; }
.article ul li, .article ol li { font-size:1rem; line-height:1.7; color:#333; padding:5px 0 5px 26px; position:relative; }
.article ul li::before { content:'–'; position:absolute; left:4px; color:var(--muted); }
.article ol { counter-reset:step; }
.article ol li { counter-increment:step; }
.article ol li::before { content:counter(step); position:absolute; left:0; top:5px; width:18px; height:18px; background:var(--fg); color:#fff; border-radius:50%; font-size:.66rem; font-weight:600; display:flex; align-items:center; justify-content:center; }
.article strong { color:var(--fg); font-weight:500; }

/* Hinweis-/Warnbox */
.callout { border:1px solid var(--border); border-left:3px solid #2f6bff; border-radius:12px; padding:16px 18px; margin:22px 0; background:#fafaf8; }
.callout.warn { border-left-color:#f59e0b; }
.callout.good { border-left-color:#22c55e; }
.callout h3 { margin:0 0 6px; font-size:.95rem; }
.callout p { font-size:.92rem; margin:0; color:#444; }

/* CTA-Box am Ende */
.article-cta { border:1px solid var(--border); border-radius:18px; padding:clamp(24px,4vw,36px); margin-top:clamp(36px,6vh,56px); display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; background:#fafaf8; }
.article-cta h2 { font-size:1.3rem; font-weight:400; margin:0 0 4px; }
.article-cta p { font-size:.88rem; color:var(--muted); margin:0; max-width:360px; }
.article-cta .btns { display:flex; gap:10px; flex-wrap:wrap; }

/* Weiterlesen */
.more { border-top:1px solid var(--border); padding-top:clamp(28px,4vh,40px); margin-top:clamp(36px,6vh,56px); }
.more .section-label { font-size:.7rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; }
.more a { display:block; padding:12px 0; border-top:1px solid var(--border); text-decoration:none; color:inherit; transition:opacity .15s; }
.more a:first-of-type { border-top:none; }
.more a:hover { opacity:.6; }
.more .d { font-size:.7rem; color:var(--muted); margin-bottom:2px; }
.more .t { font-size:.95rem; font-weight:500; }