/* ============================================================
   STINT · blog (paginas publicas: listagem, artigo, categoria, autor, busca, 404 e 410)
   Direcao A2 "editorial escuro": topo compacto no bloco .deep (a virada da home), barra de categorias e busca ACIMA do titulo,
   destaque dentro do bloco escuro, grade clara em colunas com fio no topo (sem card com sombra).
   Depende de tokens.css e base.css. So os tokens da casa. Cada componente usa uma classe so; cor sempre via var(--...).
   ============================================================ */

/* ---------- topo compacto (bloco escuro) ---------- */
.blog-topo { position: relative; isolation: isolate; overflow: hidden; padding-block: 16px clamp(20px, 2.4vw, 32px); }
.blog-topo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 60% at 0 0, rgba(119,228,13,.09), transparent 60%); }
/* simbolo da marca em escala gigante, so um sussurro (o favicon e branco: nao precisa inverter) */
.blog-topo__wall { position: absolute; inset: 0; z-index: -1; background: url("/assets/favicon.svg") no-repeat 104% 30% / auto 160%; opacity: .045; }
.blog-eyebrow { display: flex; gap: 4px 14px; align-items: baseline; flex-wrap: wrap; margin-bottom: 8px; min-width: 0; }
.blog-topo .blog-eyebrow > .label { margin: 0; }
.blog-trilha { color: var(--muted-2); font-size: .8rem; overflow-wrap: anywhere; min-width: 0; }
.blog-trilha a:hover { color: var(--text); }
.blog-trilha span { color: var(--muted); }
.blog-topo--artigo .blog-trilha span { display: inline-block; max-width: 34ch; vertical-align: bottom; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.blog-topo .label a { color: inherit; }
.blog-topo .label a:hover { text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }

/* titulo + descricao lado a lado */
.blog-cab { display: grid; gap: 10px 48px; align-items: end; margin-top: 14px; }
.blog-cab h1 { font-size: clamp(1.9rem, 1rem + 3.6vw, 3.7rem); line-height: .98; letter-spacing: -.03em; max-width: 14ch; overflow-wrap: anywhere; }
.blog-cab h1 .verde { color: var(--accent); }
.blog-cab .lead { font-size: .98rem; line-height: 1.55; max-width: 46ch; margin: 0; }
.blog-cab .lead a { text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }
.blog-cab--artigo h1 { font-size: clamp(1.7rem, .9rem + 2.6vw, 3rem); line-height: 1; max-width: none; }
.blog-cab--artigo .lead { font-size: 1rem; max-width: 40ch; }
.blog-autor__foto { border-radius: 50%; object-fit: cover; width: 56px; height: 56px; }
@media (min-width: 900px) {
  .blog-cab { grid-template-columns: auto minmax(0, 1fr); justify-content: space-between; }
  .blog-cab .lead { justify-self: end; padding-bottom: 6px; }
  .blog-cab--artigo { grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr); }
}
@media (max-width: 719px) {
  .blog-cab .lead { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: .9rem; }
  .blog-cab--artigo .lead { -webkit-line-clamp: 3; }
}

/* barra: categorias (links reais, sem JS) + busca, acima do titulo */
.blog-barra { display: flex; align-items: center; justify-content: space-between; gap: 2px 28px; padding-block: 2px; border-bottom: 1px solid var(--border); }
.blog-filtro { display: flex; flex-wrap: wrap; gap: 0 22px; min-width: 0; }
.blog-filtro a { display: inline-flex; align-items: baseline; gap: 5px; padding: 11px 0; border-bottom: 2px solid transparent; font-size: var(--fs-label); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); transition: color var(--dur) var(--ease); }
.blog-filtro a:hover { color: var(--text); }
.blog-filtro a[aria-current="page"] { color: var(--text); border-bottom-color: var(--accent); }
.blog-filtro__n { font-size: .62rem; letter-spacing: 0; color: var(--muted-2); }
.blog-busca { flex: 0 1 340px; max-width: 340px; margin: 0 0 0 auto; }   /* sempre a direita da barra, com ou sem filtros de categoria */
.blog-busca__rotulo { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.blog-busca__linha { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; padding: 3px 3px 3px 12px; border: 1px solid var(--border-2); border-radius: var(--r-sm); background: rgba(255,255,255,.05); }
.blog-busca__linha:focus-within { box-shadow: var(--focus-ring); }
.blog-busca__ico { flex: none; color: var(--muted-2); }
.blog-busca__campo { flex: 1 1 auto; min-width: 0; min-height: 36px; padding: 0 4px; border: 0; background: transparent; color: var(--text); font: inherit; font-size: .95rem; outline: 0; }
.blog-busca__campo::placeholder { color: var(--muted-2); }
.blog-busca__linha .btn { flex: none; }
@media (max-width: 719px) {
  .blog-barra { flex-direction: column-reverse; align-items: stretch; padding-block: 0 2px; }
  .blog-busca { flex: none; max-width: none; margin: 0 0 4px; }
  .blog-filtro { flex-wrap: nowrap; overflow-x: auto; gap: 0 22px; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  .blog-filtro::-webkit-scrollbar { display: none; }
  .blog-filtro a { white-space: nowrap; flex: none; }
}

/* ---------- destaque dentro do bloco escuro ---------- */
.blog-topo .blog-card--destaque { display: grid; gap: 16px; margin-top: 16px; padding-top: 18px; border-top: 1px solid var(--border); }
@media (min-width: 900px) {
  .blog-topo .blog-card--destaque { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(24px, 3.4vw, 52px); align-items: center; }
}
.blog-topo .blog-card--destaque .blog-card__capa .capa-auto,
.blog-topo .blog-card--destaque .blog-card__capa img { aspect-ratio: 16 / 9; }
.blog-card__tag { background: var(--accent); color: #08211A; padding: 3px 8px; border-radius: 3px; margin-right: 6px; }
.blog-card--destaque .blog-card__titulo { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(1.4rem, 1rem + 1.6vw, 2.4rem); line-height: 1.04; letter-spacing: -.02em; }
.blog-card--destaque .blog-card__resumo { -webkit-line-clamp: 4; font-size: .98rem; line-height: 1.55; }
.blog-card__cta { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; margin: var(--sp-3) 0 0; font-size: var(--fs-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--accent); border-bottom: 1px solid var(--accent-line); padding-bottom: 4px; }
.blog-card--destaque:hover .blog-card__titulo a { color: var(--accent); }

/* ---------- grade clara: colunas com fio no topo, sem card ---------- */
.blog-lista { padding-top: clamp(32px, 4vw, 56px); }
.blog-grade { display: grid; gap: var(--sp-7) var(--sp-6); grid-template-columns: minmax(0, 1fr); margin-top: var(--sp-6); }
.blog-lista .blog-grade { margin-top: 0; }
@media (min-width: 720px) { .blog-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .blog-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.blog-grade > * { min-width: 0; }
.blog-card { position: relative; display: flex; flex-direction: column; border-top: 2px solid var(--text); padding-top: var(--sp-4); }
.blog-topo .blog-card { border-top: 0; }
.blog-card__capa { display: block; margin-bottom: var(--sp-4); background: var(--deep); }
.blog-topo .blog-card__capa { margin-bottom: 0; }
.blog-card__capa img, .blog-card__capa .capa-auto { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.blog-card__capa img { display: block; }
.blog-card__corpo { display: flex; flex-direction: column; gap: var(--sp-2); flex: 1 1 auto; min-width: 0; }
.blog-card .label { margin: 0; }
.blog-card__topo { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-3); }
.blog-card__data { color: var(--muted); font-size: .78rem; white-space: nowrap; }
.blog-card__titulo { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.15rem, 1rem + .5vw, 1.4rem); line-height: 1.12; letter-spacing: -.02em; text-transform: uppercase; margin: var(--sp-1) 0 0; overflow-wrap: anywhere; }
.blog-card__titulo a { color: inherit; background: linear-gradient(var(--accent), var(--accent)) 0 100% / 0 2px no-repeat; transition: background-size var(--dur) var(--ease); }
.blog-card__titulo a::after { content: ""; position: absolute; inset: 0; z-index: 2; }   /* cartao inteiro clicavel */
.blog-card:hover .blog-card__titulo a, .blog-card:focus-within .blog-card__titulo a { background-size: 100% 2px; }
.blog-card__resumo { color: var(--muted); font-size: var(--fs-sm); margin: 0; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.blog-card__meta { margin-top: auto; padding-top: var(--sp-2); color: var(--muted); font-size: .8125rem; }
.blog-card .label a { position: relative; z-index: 3; }
.blog-paginacao { display: flex; gap: var(--sp-5); align-items: center; justify-content: space-between; margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: 1px solid var(--border); flex-wrap: wrap; }
.blog-vazio { border: 1px dashed var(--border-2); border-radius: var(--r-lg); background: var(--card); padding: var(--sp-8) var(--sp-5); text-align: center; }
.blog-vazio .lead { margin-inline: auto; }
.blog-secao { margin-bottom: 0; font-size: var(--fs-label); font-weight: 600; letter-spacing: var(--ls-label); color: #2F6B04; }

/* capa automatica: artigo sem foto de capa (simbolo, brilho verde e o nome da categoria). So CSS: nao pesa nem pede arquivo novo alem do favicon.svg */
.capa-auto { position: relative; display: flex; align-items: flex-end; overflow: hidden; background: var(--bg); }
.capa-auto::before { content: ""; position: absolute; inset: 0; background: url("/assets/favicon.svg") no-repeat 108% 30% / auto 150%; opacity: .16; }
.capa-auto::after { content: ""; position: absolute; inset: 0; background: radial-gradient(90% 80% at 0 0, rgba(119,228,13,.2), transparent 60%); }
.capa-auto > span { position: relative; z-index: 1; max-width: 100%; overflow-wrap: anywhere; text-wrap: balance; padding: 14px 16px; font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; line-height: 1; color: var(--accent); font-size: clamp(1.1rem, .8rem + 1.2vw, 1.8rem); }

/* ---------- artigo: topo compacto, meta + compartilhar na mesma linha, capa a cavalo entre o escuro e o osso ---------- */
.blog-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 28px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.blog-linha .blog-compartilhar { margin: 0 0 0 auto; }
.blog-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-5); margin: 0; padding: 0; border: 0; color: var(--muted); }
.blog-meta a { color: var(--text); font-weight: 600; text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }
.blog-meta__autor { display: inline-flex; align-items: center; gap: var(--sp-2); color: var(--muted); }
.blog-meta__autor img { border-radius: 50%; object-fit: cover; }
.blog-meta__tempo { display: inline-flex; align-items: center; gap: 6px; }
@media (max-width: 719px) { .blog-linha .blog-compartilhar { margin-left: 0; } }
.blog-capa-faixa { background: linear-gradient(180deg, var(--deep) 50%, var(--bg) 50%); }
.blog-capa { margin: 0; }   /* de borda a borda do contêiner do topo (o mesmo do título e da linha de compartilhar), sem teto próprio */
.blog-capa img { width: 100%; height: auto; background: var(--surface); }
.blog-capa .capa-auto { aspect-ratio: 21 / 9; }
.blog-capa .capa-auto > span { font-size: clamp(1.5rem, 1rem + 2vw, 3rem); padding: 20px 24px; }
.blog-artigo { padding-top: clamp(24px, 3vw, 40px); }

/* ---------- sumario ---------- */
.blog-toc { position: relative; background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: var(--sp-5) var(--sp-5) var(--sp-5); margin: 0 0 var(--sp-7); }
.blog-toc::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; border-radius: var(--r-lg) var(--r-lg) 0 0; background: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%); }
.blog-toc ol { list-style: none; counter-reset: toc; margin: var(--sp-3) 0 0; padding: 0; display: grid; gap: var(--sp-2); }
.blog-toc li { counter-increment: toc; display: flex; gap: var(--sp-3); align-items: baseline; }
.blog-toc li::before { content: counter(toc, decimal-leading-zero); font-family: var(--font-display); font-weight: 800; font-size: var(--fs-sm); color: var(--accent); flex: 0 0 auto; }
.blog-toc a { color: var(--text); font-weight: 500; font-size: var(--fs-sm); line-height: 1.45; overflow-wrap: anywhere; border-bottom: 1px solid transparent; }
.blog-toc a:hover { border-bottom-color: var(--accent); }

/* ---------- corpo do artigo ---------- */
.blog-corpo { font-size: 1.0625rem; line-height: 1.78; }
.blog-corpo > * { max-width: none; min-width: 0; }
.blog-corpo p { color: rgba(11,11,12,.86); max-width: none; overflow-wrap: break-word; }
.blog-corpo p + p { margin-top: 0; }
.blog-corpo p, .blog-corpo ul, .blog-corpo ol, .blog-corpo blockquote, .blog-corpo figure, .blog-corpo > section, .blog-corpo > aside { margin-top: var(--sp-5); }
.blog-corpo > :first-child { margin-top: 0; }
.blog-corpo h2 { font-size: clamp(1.45rem, 1.1rem + 1.4vw, 2.1rem); margin-top: var(--sp-8); scroll-margin-top: 88px; overflow-wrap: anywhere; position: relative; padding-top: var(--sp-4); }
.blog-corpo h2::before { content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 3px; background: var(--accent); }
.blog-corpo h3 { font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem); margin-top: var(--sp-7); scroll-margin-top: 88px; overflow-wrap: anywhere; }
.blog-corpo h2 + *, .blog-corpo h3 + * { margin-top: var(--sp-4); }
.blog-corpo a { color: var(--text); font-weight: 500; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; overflow-wrap: anywhere; }
.blog-corpo a:hover { text-decoration-color: var(--accent-p); background: var(--accent-dim); }
.blog-corpo strong { font-weight: 700; color: var(--text); }
.blog-corpo ul, .blog-corpo ol { list-style: revert; padding-left: 1.4em; color: rgba(11,11,12,.86); }
.blog-corpo li { padding-left: .25em; }
.blog-corpo li + li { margin-top: var(--sp-2); }
.blog-corpo li::marker { color: var(--accent-p); font-weight: 700; }
.blog-corpo li > p { margin-top: var(--sp-2); }
.blog-corpo blockquote { border-left: 3px solid var(--accent); padding: var(--sp-2) 0 var(--sp-2) var(--sp-5); font-family: var(--font-serif); font-size: clamp(1.2rem, 1.05rem + .6vw, 1.5rem); line-height: 1.45; color: var(--text); }
.blog-corpo blockquote p { color: inherit; margin-top: var(--sp-3); }
.blog-corpo blockquote > :first-child { margin-top: 0; }
.blog-figura { margin-top: var(--sp-6); }
.blog-corpo figure img { width: 100%; height: auto; border-radius: var(--r-lg); border: 1px solid var(--border); background: var(--surface); }
.blog-corpo figcaption { font-size: .8125rem; color: var(--muted-2); margin-top: var(--sp-2); text-align: center; line-height: 1.5; }

/* chamada dentro do texto */
.blog-cta { margin-top: var(--sp-7); padding: var(--sp-5); border: 1px solid var(--border); border-top: 2px solid var(--accent); border-radius: var(--r-lg); background: var(--card); text-align: center; }
.blog-corpo .btn { color: var(--on-accent); text-decoration: none; font-weight: 600; max-width: 100%; text-align: center; line-height: 1.3; }
.blog-corpo .btn:hover { background: var(--accent-h); }

/* leia tambem */
.blog-leia-tambem { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-2) var(--sp-3); margin-top: var(--sp-6); padding: var(--sp-4) var(--sp-5); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: var(--r); background: var(--card); }
.blog-leia-tambem span { font-size: var(--fs-label); font-weight: 700; letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--label); }
.blog-corpo .blog-leia-tambem a { font-weight: 600; text-decoration-thickness: 1px; }

/* perguntas frequentes */
.blog-faq { margin-top: var(--sp-8); }
.blog-faq__titulo { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; font-size: var(--fs-h3); line-height: 1.15; color: var(--text) !important; margin-top: 0 !important; padding-bottom: var(--sp-4); }
.blog-faq details { border-top: 1px solid var(--border-2); }
.blog-faq details:last-child { border-bottom: 1px solid var(--border-2); }
.blog-faq summary { cursor: pointer; list-style: none; padding: var(--sp-4) 0; display: flex; gap: var(--sp-4); align-items: center; font-family: var(--font-display); font-weight: 700; font-size: 1rem; line-height: 1.35; transition: color var(--dur) var(--ease); }
.blog-faq summary::-webkit-details-marker { display: none; }
.blog-faq summary::after { content: "+"; margin-left: auto; flex: 0 0 auto; font-family: var(--font-body); font-weight: 400; font-size: 1.4rem; line-height: 1; color: var(--muted-2); }
.blog-faq summary:hover, .blog-faq details[open] > summary { color: var(--accent-p); }
.blog-faq details[open] > summary::after { content: "\00d7"; color: var(--accent-p); }
.blog-faq details > div { padding-bottom: var(--sp-5); font-size: var(--fs-body); color: var(--muted); line-height: 1.7; }

/* chamada final (bloco escuro, uso pontual como na home) */
.blog-cta-final { margin-top: var(--sp-8); padding: clamp(28px, 4vw, 48px); border-radius: var(--r-lg); position: relative; overflow: hidden; }
.blog-cta-final::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; background: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%); }
.blog-cta-final h2 { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2rem); margin-top: var(--sp-3); max-width: 20ch; }
.blog-cta-final p { color: var(--muted); max-width: 52ch; }
.blog-cta-final h2 + p { margin-top: var(--sp-3); }
.blog-cta-final p:last-child { margin-top: var(--sp-5); }

/* assinatura no fim */
.blog-bio { display: flex; gap: var(--sp-4); align-items: center; margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: 1px solid var(--border); }
.blog-bio > img, .blog-bio__marca { width: 64px; height: 64px; flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.blog-bio__marca { display: inline-flex; align-items: center; justify-content: center; background: var(--surface); border: 1px solid var(--border); }
.blog-bio__marca img { width: 32px; height: 32px; }
.blog-bio a { text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; }

.blog-relacionados { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 0; }
.blog-relacionados .blog-grade { margin-top: var(--sp-5); }

/* faixa de previa (link de revisao) */
.blog-previa { background: var(--warn); color: #fff; text-align: center; padding: var(--sp-3) var(--gutter); font-size: var(--fs-sm); }

/* erro 404 e 410 */
.blog-erro .blog-cab h1 { max-width: 20ch; }
.blog-erro__acoes { display: flex; gap: var(--sp-3); flex-wrap: wrap; margin-top: var(--sp-6); }
.blog-erro + .section { padding-top: var(--sp-8); }
.blog-erro__acoes { margin-top: var(--sp-5); }

/* contraste AA (Lighthouse): rotulos verdes e textos de apoio um tom mais escuros so dentro do blog */
.blog-card .label, .blog-toc .label, .blog-leia-tambem span { color: #2F6B04; }
.deep .blog-card .label, .blog-cta-final .label { color: var(--label); }   /* sobre o escuro, o verde claro da casa */
.blog-cta-final .label { color: var(--label); }
.blog-corpo figcaption, .blog-card__meta, .blog-meta, .blog-trilha { color: var(--muted); }
.blog-bio__marca img { width: 32px; height: 32px; object-fit: contain; }

/* ---------- fase 2: busca, compartilhar e newsletter (mesmos tokens, nada novo) ---------- */
.blog-news__rotulo { display: block; font-size: var(--fs-label); font-weight: 700; letter-spacing: var(--ls-label); text-transform: uppercase; color: #2F6B04; margin-bottom: var(--sp-2); }
.blog-news__linha { display: flex; gap: var(--sp-2); align-items: stretch; flex-wrap: wrap; }
.blog-news__campo { flex: 1 1 220px; min-width: 0; min-height: 44px; padding: 0 var(--sp-4); border: 1px solid var(--border-2); border-radius: var(--r); background: var(--card); color: var(--text); font: inherit; font-size: 1rem; }
.blog-news__campo:hover { border-color: var(--accent-line); }
.blog-busca__aviso { margin-top: 0; }

.blog-compartilhar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); margin-top: var(--sp-5); position: relative; }
.blog-compartilhar__titulo { font-size: var(--fs-label); font-weight: 700; letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--muted); margin-right: var(--sp-2); }
.blog-compartilhar__botao { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border: 1px solid var(--border-2); border-radius: var(--r-pill); background: var(--card); color: var(--text); font: inherit; font-size: var(--fs-sm); font-weight: 500; line-height: 1; cursor: pointer;
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease); }
.blog-compartilhar__botao:hover { border-color: var(--accent); background: var(--accent-dim); }
.blog-compartilhar__botao[hidden], .blog-compartilhar__campo[hidden] { display: none; }
.blog-compartilhar__aviso { color: #2F6B04; font-weight: 600; min-height: 1em; }
.blog-compartilhar__campo { flex: 1 1 100%; min-width: 0; min-height: 40px; padding: 0 var(--sp-3); border: 1px solid var(--border-2); border-radius: var(--r); background: var(--card); color: var(--text); font: inherit; font-size: var(--fs-sm); }
.blog-corpo + .blog-compartilhar { margin-top: var(--sp-7); }
.blog-artigo .blog-compartilhar:last-of-type { margin-top: var(--sp-7); }

.blog-news-bloco { margin-top: var(--sp-8); padding: clamp(20px, 3vw, 32px); border: 1px solid var(--border); border-top: 2px solid var(--accent); border-radius: var(--r-lg); background: var(--card); }
.blog-news__titulo { font-size: clamp(1.25rem, 1.05rem + .9vw, 1.6rem); margin: 0 0 var(--sp-4); }
.blog-news__consentimento { color: var(--muted); max-width: 60ch; margin: 0 0 var(--sp-4); line-height: 1.55; }
.blog-news__consentimento a { color: var(--text); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; white-space: nowrap; }
.blog-news__erro { color: var(--error); font-weight: 600; margin: var(--sp-3) 0 0; }
.blog-news__campo[aria-invalid="true"] { border-color: var(--error); }
.blog-news__ninho { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.blog-erro .blog-news-bloco { margin-top: var(--sp-6); text-align: left; }
.blog-lista .blog-news-bloco { margin-top: var(--sp-8); }
@media (max-width: 480px) {
  .blog-news__linha .btn { width: 100%; }
}
.blog-bio__marca--inicial { font-family: var(--font-display); font-weight: 800; font-size: 1.5rem; color: var(--muted); }

/* faixa escura da newsletter na listagem (so aparece com a flag ligada, como antes): titulo a esquerda, formulario a direita */
.blog-news-faixa { padding-block: var(--section-y); background: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%) top center / 100% 2px no-repeat, var(--bg); color: var(--text); }
.blog-news-faixa .blog-news-bloco { display: grid; gap: var(--sp-5); align-items: end; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; }
.blog-news-faixa .blog-news__titulo { font-size: var(--fs-h2); max-width: 16ch; margin: 0; }
.blog-news-faixa .blog-news__rotulo { color: var(--muted); }
.blog-news-faixa .blog-news__campo { background: rgba(255,255,255,.06); }
@media (min-width: 860px) { .blog-news-faixa .blog-news-bloco { grid-template-columns: 1fr 1fr; gap: var(--sp-8); } }
.deep .blog-compartilhar__aviso { color: var(--accent); }
.blog-linha .blog-compartilhar__botao { min-height: 36px; }
.site-nav__links a[aria-current="page"] { color: var(--text); border-bottom-color: var(--accent); }
@media (max-width: 719px) { .blog-linha .blog-compartilhar__titulo { display: none; } .blog-linha .blog-meta { gap: 2px 18px; } }
.blog-busca__aviso { margin-bottom: var(--sp-6); }

/* nome de categoria comprido na capa automatica: reduz e quebra em ate 2 linhas, sem cortar (categoria tem no maximo 60 caracteres) */
.capa-auto--media > span { font-size: clamp(.95rem, .75rem + .9vw, 1.35rem); line-height: 1.05; }
.capa-auto--longa > span { font-size: clamp(.8rem, .65rem + .6vw, 1.05rem); line-height: 1.1; }
.blog-capa .capa-auto--media > span { font-size: clamp(1.1rem, .9rem + 1.3vw, 2rem); }
.blog-capa .capa-auto--longa > span { font-size: clamp(.95rem, .8rem + .9vw, 1.4rem); }
/* 5: rotulo do campo de e-mail fica acessivel (leitor de tela) e junto do campo; o texto visivel e o placeholder */
.blog-news__rotulo { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.blog-news__linha { position: relative; }
.blog-news__campo::placeholder { color: var(--muted-2); }
/* 3: topo do artigo, meta e compartilhar numa linha so quando cabe (links de texto, sem pilulas) */
.blog-linha .blog-compartilhar { gap: 2px 14px; }
.blog-linha .blog-compartilhar__botao { border: 0; background: none; padding: 0; min-height: 36px; border-radius: 0; color: var(--muted); }
.blog-linha .blog-compartilhar__botao:hover { background: none; color: var(--text); }
@media (min-width: 1180px) { .blog-linha { flex-wrap: nowrap; } .blog-linha .blog-meta { flex-wrap: nowrap; white-space: nowrap; } .blog-linha .blog-compartilhar { flex-wrap: nowrap; white-space: nowrap; } }
/* 8: em telas estreitas o botao da busca encolhe e o placeholder cabe inteiro */
@media (max-width: 380px) {
  .blog-busca__linha { padding-left: 10px; gap: 6px; }
  .blog-busca__linha .btn { padding: 8px 10px; }
  .blog-busca__campo { font-size: .875rem; padding: 0 2px; }
}
@media (max-width: 380px) { .blog-cab .lead { -webkit-line-clamp: 4; } }   /* em 320px a frase inteira do topo da listagem cabe em 4 linhas */