/* Camila Scarpin — blog (artigos evergreen) */

.artigo-hero { background: var(--creme-2); border-bottom: 1px solid var(--borda); padding: 46px 0 40px; }
.artigo-hero .wrap { max-width: 820px; }
.artigo-hero h1 { font-size: clamp(1.95rem, 3.4vw, 2.9rem); line-height: 1.08; margin-bottom: 14px; }
.artigo-hero .meta { font-size: 0.78rem; color: var(--cinza); display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.artigo-hero .meta span { display: inline-flex; align-items: center; gap: 6px; }
.artigo-hero .meta i { width: 4px; height: 4px; border-radius: 50%; background: #B9AF99; display: inline-block; }

.artigo { padding: 46px 0 70px; }
.artigo .wrap { max-width: 820px; }
.artigo p, .artigo li { font-size: 1rem; line-height: 1.72; color: #34413A; }
.artigo p { margin: 0 0 18px; }
.artigo h2 { font-size: clamp(1.35rem, 2.1vw, 1.72rem); margin: 42px 0 14px; line-height: 1.24; }
.artigo h3 { font-size: 1.1rem; font-family: var(--sans); font-weight: 600; letter-spacing: -0.015em; margin: 26px 0 8px; }
.artigo ul, .artigo ol { margin: 0 0 20px; padding-left: 22px; }
.artigo li { margin-bottom: 8px; }
.artigo a { color: var(--verde); }
.artigo strong { color: var(--tinta); }

.artigo .destaque {
  background: var(--papel); border-left: 3px solid var(--dourado);
  padding: 18px 22px; margin: 26px 0; border-radius: 0 4px 4px 0;
}
.artigo .destaque p { margin: 0; font-size: 0.95rem; }
.artigo .destaque strong { display: block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.16em; color: var(--dourado); margin-bottom: 6px; }

.artigo .sumario { border: 1px solid var(--borda); border-radius: 5px; padding: 18px 22px; margin: 0 0 30px; background: #FBF7EE; }
.artigo .sumario p { margin: 0 0 8px; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.18em; color: #55645B; font-weight: 500; }
.artigo .sumario ol { margin: 0; padding-left: 18px; }
.artigo .sumario li { margin: 0 0 6px; font-size: 0.9rem; }
.artigo .sumario a { text-decoration: none; }
.artigo .sumario a:hover { text-decoration: underline; }

.artigo-cta {
  background: var(--verde); color: var(--creme); border-radius: 6px;
  padding: 28px 30px; margin: 38px 0; display: flex; gap: 24px; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.artigo-cta h3 { font-family: var(--sans); font-weight: 500; font-size: 1.26rem; color: #fff; margin: 0 0 6px; letter-spacing: -0.02em; }
.artigo-cta p { color: rgba(247,242,231,.82); margin: 0; font-size: 0.88rem; max-width: 44ch; }
.artigo-cta .btn--creme { flex: none; }

.artigo-autor { border-top: 1px solid var(--borda); margin-top: 40px; padding-top: 22px; display: flex; gap: 16px; align-items: center; }
.artigo-autor img.rosto { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; }
.artigo-autor .assinatura-img { height: 34px; width: auto; }
.artigo-autor p { margin: 2px 0 0; font-size: 0.8rem; color: var(--cinza); }

.relacionados { background: var(--creme-2); padding: 54px 0 60px; }
.relacionados h2 { font-size: 1.5rem; margin-bottom: 24px; }
.relacionados ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.relacionados a {
  display: block; background: var(--papel); border: 1px solid var(--borda); border-radius: 5px;
  padding: 20px 20px 22px; text-decoration: none; height: 100%;
}
.relacionados a:hover { border-color: var(--verde); }
.relacionados strong { display: block; font-family: var(--sans); font-weight: 500; font-size: 1.04rem; color: var(--tinta); line-height: 1.3; margin-bottom: 8px; letter-spacing: -0.02em; }
.relacionados span { font-size: 0.8rem; color: var(--cinza); line-height: 1.5; display: block; }

.blog-lista { padding: 52px 0 72px; }
.blog-lista article { border-top: 1px solid var(--borda); padding: 30px 0; display: grid; grid-template-columns: 1fr 190px; gap: 28px; align-items: start; }
.blog-lista article:first-of-type { border-top: 0; padding-top: 0; }
.blog-lista h2 { font-size: 1.42rem; margin: 0 0 10px; }
.blog-lista h2 a { color: var(--tinta); text-decoration: none; }
.blog-lista h2 a:hover { color: var(--verde); }
.blog-lista p { color: var(--cinza); font-size: 0.94rem; margin: 0 0 12px; }
.blog-lista .meta { font-size: 0.74rem; color: var(--cinza); text-transform: uppercase; letter-spacing: 0.12em; }
.blog-lista .ler { font-size: 0.82rem; font-weight: 600; color: var(--verde); text-decoration: none; }
.blog-lista .ler:hover { text-decoration: underline; }
.blog-lista .num { font-family: var(--sans); font-weight: 500; font-size: 2.4rem; color: #C9BFA9; text-align: right; line-height: 1; }

@media (max-width: 900px) {
  .relacionados ul { grid-template-columns: 1fr; }
  .blog-lista article { grid-template-columns: 1fr; gap: 10px; }
  .blog-lista .num { display: none; }
}
@media (max-width: 620px) {
  .artigo-cta { padding: 22px 20px; }
  .artigo-cta .btn { width: 100%; }
}
