/* /blog/ (#1693). Loaded after ../styles.css; uses the site tokens only. */
.blog-article,.blog-hub{max-width:760px;padding:56px 0 72px;display:block}
.blog-article h1,.blog-hub h1{font-size:clamp(32px,5vw,48px);line-height:1.08;margin:0 0 var(--s4)}
.blog-crumbs,.blog-cat,.blog-meta,.blog-disclaimer,.blog-toc-h{font-size:14px;color:var(--muted);margin:0 0 var(--s3)}
.blog-crumbs a{color:inherit}
.blog-cat{font-weight:600;text-transform:none}
.blog-answer{font-size:20px;line-height:1.45;margin:var(--s5) 0 var(--s6)}
.blog-toc{border:1px solid var(--hair);border-radius:var(--r-card);padding:20px 24px;margin:0 0 var(--s6)}
.blog-toc ol{margin:0;padding-left:20px;display:grid;gap:6px}
.blog-body h2{font-size:26px;line-height:1.2;margin:var(--s7) 0 var(--s3)}
.blog-body h3{font-size:20px;margin:var(--s5) 0 var(--s2)}
.blog-body p,.blog-body ul,.blog-body ol{font-size:17px;line-height:1.6;margin:0 0 var(--s4)}
.blog-body ul,.blog-body ol{padding-left:22px}
.blog-body a,.blog-answer a,.blog-related a,.blog-list a{color:inherit;text-decoration:underline;text-underline-offset:3px}
figure{margin:var(--s5) 0}
figure img{max-width:100%;height:auto;display:block;border-radius:var(--r-card)}
figcaption{font-size:14px;color:var(--muted);margin-top:var(--s2)}
.blog-cta{background:var(--band);border:1px solid var(--hair);border-radius:var(--r-card);padding:28px;margin:var(--s7) 0;display:flex;flex-direction:column;gap:var(--s3);align-items:flex-start}
.blog-cta[hidden],.blog-cta-inline[hidden]{display:none}
.blog-cta h2{font-size:24px;margin:0}
.blog-cta p{margin:0}
.blog-cta-inline{font-size:16px;border-left:3px solid var(--ink);padding:4px 0 4px 14px;margin:0 0 var(--s4)}
.blog-related{margin:var(--s6) 0}
.blog-related h2,.blog-author h2{font-size:20px;margin:0 0 var(--s2)}
.blog-related ul{padding-left:20px;margin:0}
.blog-author p{font-size:15px;line-height:1.55}
.blog-section{margin:var(--s7) 0 0}
.blog-section h2{font-size:24px;margin:0 0 var(--s3)}
.blog-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--s5)}
.blog-list h3{font-size:20px;margin:0 0 var(--s2)}
.blog-list p{margin:0 0 var(--s2)}
@media(max-width:520px){.blog-article,.blog-hub{padding:40px 0 56px}.blog-answer{font-size:18px}.blog-cta{padding:22px}}
