/* Lidera SST — tipografia e layout de artigos do blog */

.article-wrap { max-width: 760px; margin: 0 auto; }

/* Corpo do artigo (prosa) */
.article-prose { font-size: 1.0625rem; line-height: 1.8; color: #3a4453; }
.article-prose > p { margin: 0 0 1.35rem; }
.article-prose h2 {
    font-size: 1.6rem; line-height: 1.25; font-weight: 800; color: #101a29;
    margin: 2.6rem 0 1rem; letter-spacing: -0.01em; scroll-margin-top: 90px;
}
.article-prose h3 {
    font-size: 1.22rem; line-height: 1.3; font-weight: 700; color: #101a29;
    margin: 2rem 0 .7rem;
}
.article-prose ul, .article-prose ol { margin: 0 0 1.35rem; padding-left: 1.3rem; }
.article-prose li { margin-bottom: .55rem; }
.article-prose ul > li { list-style: none; position: relative; padding-left: 1.4rem; }
.article-prose ul > li::before {
    content: ''; position: absolute; left: 0; top: .62em; width: 7px; height: 7px;
    border-radius: 50%; background: #0066b2;
}
.article-prose ol { list-style: decimal; padding-left: 1.5rem; }
.article-prose ol > li { padding-left: .2rem; }
.article-prose a { color: #0066b2; text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.article-prose a:hover { color: #004e8a; }
.article-prose strong { color: #101a29; font-weight: 700; }

/* Destaque / callout */
.article-prose .callout {
    background: #f4f7fd; border-left: 4px solid #0066b2; border-radius: 12px;
    padding: 1.1rem 1.25rem; margin: 1.8rem 0; font-size: 1rem; color: #3a4453;
}
.article-prose .callout.club { border-left-color: #5b47e0; background: #f4f2ff; }
.article-prose .callout strong { display: block; margin-bottom: .25rem; color: #101a29; }

/* Lead / introdução */
.article-lead { font-size: 1.2rem; line-height: 1.7; color: #4b5566; font-weight: 500; }

/* Sumário opcional */
.article-toc { background: #f4f7fd; border: 1px solid #e2eaf7; border-radius: 16px; padding: 1.25rem 1.4rem; margin: 0 0 2rem; }
.article-toc h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .12em; color: #4b5566; margin: 0 0 .7rem; }
.article-toc a { display: block; color: #0066b2; text-decoration: none; font-weight: 600; font-size: .95rem; padding: .2rem 0; }
.article-toc a:hover { text-decoration: underline; }
