/* Blog V1 Analytics. Só o que o blog precisa além de tokens.css e components.css.
   Nenhum hex aqui: cor, raio, sombra e movimento vêm dos tokens. Viewports testados: 1280 e 390. Temas: claro (padrão) e escuro.
   Movimento: transição com propriedade explícita, curva --motion-ease-out, toque em 160 ms. Hover só com mouse de verdade. */

/* ---------- Moldura: cabeçalho e rodapé ---------- */
/* Cópia do bloco <style> da home (index.html) para o blog ficar igual sem build. Se a moldura da home mudar, mude aqui também. */
.topo { position: sticky; top: 0; z-index: 30; background: color-mix(in srgb, var(--bg) 78%, transparent); backdrop-filter: blur(16px) saturate(160%); -webkit-backdrop-filter: blur(16px) saturate(160%); border-bottom: 1px solid var(--border); }
.topo__nav { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); height: 64px; }
.marca { display: flex; align-items: center; text-decoration: none; }
.marca img { height: 26px; width: auto; display: block; }
.marca .escuro, [data-theme="dark"] .marca .claro, .inverso .marca .claro { display: none; }
[data-theme="dark"] .marca .escuro, .inverso .marca .escuro { display: block; }
.topo__links { display: flex; gap: 28px; list-style: none; margin: 0; padding: 0; font-size: var(--font-size-sm); color: var(--text-muted); }
.topo__links a { text-decoration: none; transition: color var(--motion-duration-press) var(--motion-ease-out); }
.topo__links a[aria-current] { color: var(--text); }
.topo__acao { display: flex; align-items: center; gap: 10px; }
.tema { width: 38px; height: 38px; display: inline-grid; place-items: center; border: 0; border-radius: var(--radius-full); background: transparent; color: var(--text-muted); cursor: pointer; transition: background-color var(--motion-duration-press) var(--motion-ease-out), transform var(--motion-duration-press) var(--motion-ease-out); }
.tema:active { transform: scale(.9); }
.tema svg { width: 18px; height: 18px; }
.tema .lua, [data-theme="dark"] .tema .sol { display: none; }
[data-theme="dark"] .tema .lua { display: block; }
.rodape { padding-block: 40px 32px; border-top: 1px solid var(--border); }
.rodape__grade { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-muted); }
.rodape .marca img { height: 20px; }
.rodape nav { display: flex; gap: 20px; }
.rodape a { text-decoration: none; transition: color var(--motion-duration-press) var(--motion-ease-out); }
@media (hover: hover) and (pointer: fine) {
  .topo__links a:hover, .rodape a:hover { color: var(--text); }
  .tema:hover { background: var(--bg-suave); color: var(--text); }
}
@media (max-width: 620px) {
  .topo__links, .topo__acao .btn--fantasma { display: none; }
  .rodape__grade { flex-direction: column; align-items: flex-start; }
}
@media (pointer: coarse), (max-width: 980px) {
  .topo__links a, .rodape a, .marca { display: inline-flex; align-items: center; min-height: var(--size-touch); }
  .btn--sm, .tema { height: var(--size-touch); }
}

/* ---------- Entrada do topo ---------- */
/* Um fade com subida de 8 px nos filhos diretos do bloco .entra, com 60 ms entre irmãos. Só opacidade e translate. */
.entra > * { transition: opacity 500ms var(--motion-ease-out), translate 500ms var(--motion-ease-out); }
.entra > :nth-child(2) { transition-delay: 60ms; } .entra > :nth-child(3) { transition-delay: 120ms; } .entra > :nth-child(4) { transition-delay: 180ms; } .entra > :nth-child(5) { transition-delay: 240ms; }
@starting-style { .entra > * { opacity: 0; translate: 0 8px; } }

/* ---------- Listagem: topo ---------- */
.blog-topo { padding-block: clamp(56px, 8vw, 96px) clamp(32px, 5vw, 56px); text-align: center; }
.blog-topo .titulo { max-width: 22ch; margin: var(--space-5) auto 0; }
.blog-topo .lede { margin: var(--space-6) auto 0; }

/* ---------- Metadados ---------- */
.post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: var(--font-size-xs); color: var(--text-muted); }
.post-meta__item + .post-meta__item::before { content: "·"; margin-right: 10px; color: var(--text-subtle); }

/* ---------- Cartão em destaque (clicável) ---------- */
.blog-destaque { padding-bottom: clamp(56px, 8vw, 104px); }
.post-destaque { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); border-radius: var(--radius-xl); background: var(--bg-card); box-shadow: var(--shadow-card); overflow: hidden; color: var(--text); text-decoration: none; transition: transform var(--motion-duration-press) var(--motion-ease-out), box-shadow var(--motion-duration-ui) var(--motion-ease-out); }
.post-destaque:focus-visible { border-radius: var(--radius-xl); box-shadow: var(--focus-ring), var(--shadow-card); }
.post-destaque:active { transform: scale(.98); }
.post-destaque__midia { position: relative; min-height: 280px; background: var(--bg-suave); }
.post-destaque__midia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.post-destaque__corpo { display: grid; align-content: center; justify-items: start; gap: var(--space-3); padding: clamp(24px, 3vw, 40px); }
.post-destaque__titulo { font-family: var(--font-family-display); font-size: clamp(1.4rem, 2vw, 1.75rem); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-snug); letter-spacing: var(--font-tracking-titulo); text-wrap: balance; }
.post-destaque__resumo { color: var(--text-muted); font-size: var(--font-size-md); line-height: var(--font-line-height-normal); }
.post-destaque__ler { display: inline-flex; align-items: center; gap: 8px; min-height: var(--size-touch); margin-top: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--accent-strong); }
.post-destaque__ler svg { width: 16px; height: 16px; transition: translate var(--motion-duration-press) var(--motion-ease-out); }
@media (hover: hover) and (pointer: fine) {
  .post-destaque:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); }
  .post-destaque:hover .post-destaque__ler svg { translate: 3px 0; }
}

/* ---------- Grade de cartões (artigos publicados e "Em breve") ---------- */
.post-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.post-card { display: grid; grid-template-rows: auto 1fr; border-radius: var(--radius-lg); background: var(--bg-card); box-shadow: var(--shadow-card); overflow: hidden; }
/* Capa do cartão: toda postagem tem uma (img/blog/<slug>), com o assunto por cima. */
.post-card__midia { position: relative; aspect-ratio: 1200 / 630; background: var(--bg-suave); }
.post-card__midia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.post-card__midia .chip { position: absolute; top: var(--space-4); left: var(--space-4); }
.post-card__corpo { display: grid; align-content: start; gap: var(--space-3); padding: var(--space-6); }
.post-card__titulo { font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-snug); letter-spacing: -0.02em; text-wrap: balance; }
.post-card__resumo { font-size: var(--font-size-sm); line-height: var(--font-line-height-normal); color: var(--text-muted); }
.post-card__rodape { align-self: end; padding-top: var(--space-2); }
/* Cartão clicável (a.post-card): mesmo gesto do destaque. O "Em breve" continua sendo article.post-card, sem link. */
a.post-card { color: var(--text); text-decoration: none; transition: transform var(--motion-duration-press) var(--motion-ease-out), box-shadow var(--motion-duration-ui) var(--motion-ease-out); }
a.post-card:focus-visible { box-shadow: var(--focus-ring), var(--shadow-card); }
a.post-card:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) { a.post-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); } }

/* ---------- Chamada (bloco escuro, usar com .inverso) ---------- */
/* Mesmo recurso visual do CTA da home: card escuro arredondado com luz índigo no canto. */
.blog-cta { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: var(--space-8); padding: clamp(28px, 5vw, 56px); border-radius: var(--radius-xl); background: radial-gradient(60% 130% at 92% 0%, color-mix(in srgb, var(--color-indigo-700) 36%, transparent), transparent 70%), var(--bg); box-shadow: 0 0 0 1px var(--border) inset, var(--shadow-elevated); }
.blog-cta__texto { max-width: 520px; display: grid; gap: var(--space-3); }
.blog-cta__titulo { font-family: var(--font-family-display); font-size: clamp(1.6rem, 3vw, 2.25rem); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-snug); letter-spacing: var(--font-tracking-titulo); text-wrap: balance; }
.blog-cta__resumo { font-size: var(--font-size-md); line-height: var(--font-line-height-normal); color: var(--text-muted); }
.blog-cta .btn { flex: none; }
.blog-cta-secao { padding-bottom: clamp(56px, 8vw, 104px); }

/* ---------- Artigo: cabeçalho ---------- */
.container--post { width: min(960px, calc(100% - 48px)); }
.post-cabeca { padding-block: clamp(24px, 4vw, 48px) clamp(28px, 4vw, 48px); }
.post-voltar-topo { display: inline-flex; align-items: center; gap: 6px; min-height: var(--size-touch); margin-left: -4px; font-size: var(--font-size-sm); color: var(--text-muted); text-decoration: none; transition: color var(--motion-duration-press) var(--motion-ease-out); }
.post-voltar-topo svg { width: 16px; height: 16px; }
.post-cabeca__bloco { display: grid; justify-items: start; gap: var(--space-5); margin-top: var(--space-6); }
.post-titulo { max-width: 22ch; font-family: var(--font-family-display); font-size: clamp(1.9rem, 4.2vw, 3rem); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-tight); letter-spacing: var(--font-tracking-titulo); text-wrap: balance; }
.post-sub { max-width: 52ch; font-size: var(--font-size-lg); line-height: var(--font-line-height-normal); color: var(--text-muted); text-wrap: pretty; }
.post-cabeca .post-meta { padding-top: var(--space-5); width: 100%; border-top: 1px solid var(--border); }
/* Capa do artigo: toda postagem tem uma (img/blog/<slug>), 1200x630. */
.post-capa { margin: var(--space-10) 0 0; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-card); background: var(--bg-suave); }
.post-capa img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; }
@media (hover: hover) and (pointer: fine) { .post-voltar-topo:hover { color: var(--text); } }

/* ---------- Artigo: layout com sumário ---------- */
.post-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-8); padding-bottom: clamp(56px, 8vw, 96px); }
.toc { padding: var(--space-5) var(--space-6); border-radius: var(--radius-lg); background: var(--bg-suave); }
.toc__titulo { margin-bottom: var(--space-2); }
.toc ol { list-style: none; margin: 0; padding: 0; }
.toc a { display: flex; align-items: center; min-height: var(--size-touch); font-size: var(--font-size-sm); line-height: var(--font-line-height-snug); color: var(--text-muted); text-decoration: none; transition: color var(--motion-duration-press) var(--motion-ease-out); }
@media (hover: hover) and (pointer: fine) { .toc a:hover { color: var(--text); } }
@media (min-width: 1024px) {
  .post-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 56px; }
  .toc { position: sticky; top: 96px; align-self: start; padding: 0; border-radius: 0; background: none; }
  .toc ol { border-left: 1px solid var(--border); }
  .toc a { margin-left: -1px; padding-left: 16px; border-left: 2px solid transparent; }
}

/* ---------- Artigo: texto ---------- */
.prosa { max-width: 36em; font-size: var(--font-size-md); line-height: var(--font-line-height-relaxed); letter-spacing: var(--font-tracking-corpo); }
@media (min-width: 1024px) { .prosa { max-width: 684px; font-size: var(--font-size-lg); } }
.prosa > * { margin: 0; }
.prosa > * + * { margin-top: var(--space-5); }
.prosa > :first-child { margin-top: 0; }
.prosa p { text-wrap: pretty; }
.prosa h2, .prosa h3, .prosa [id] { scroll-margin-top: 88px; }
.prosa h2 { margin-top: var(--space-16); font-family: var(--font-family-display); font-size: clamp(1.5rem, 2.6vw, var(--font-size-xl)); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-snug); letter-spacing: var(--font-tracking-titulo); text-wrap: balance; }
.prosa h2 + * { margin-top: var(--space-4); }
.prosa h3 { margin-top: var(--space-10); font-family: var(--font-family-display); font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-snug); letter-spacing: -0.02em; }
.prosa h3 + * { margin-top: var(--space-3); }
.prosa strong { font-weight: var(--font-weight-semibold); }
.prosa a:not([class]) { color: var(--link); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, var(--link) 35%, transparent); transition: text-decoration-color var(--motion-duration-press) var(--motion-ease-out); }
@media (hover: hover) and (pointer: fine) { .prosa a:not([class]):hover { text-decoration-color: currentColor; } }
.prosa ul { padding-left: 1.25em; }
.prosa ul li + li { margin-top: var(--space-2); }
.prosa li::marker { color: var(--accent); }

/* Citação */
.prosa blockquote { position: relative; margin-inline: 0; padding-left: var(--space-6); font-family: var(--font-family-display); font-size: clamp(var(--font-size-lg), 3vw, var(--font-size-xl)); font-weight: var(--font-weight-medium); line-height: var(--font-line-height-snug); letter-spacing: var(--font-tracking-titulo); text-wrap: balance; }
.prosa blockquote::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 4px; border-radius: var(--radius-full); background: var(--gradient-marca); }

/* Tabela */
.tabela-wrap { overflow-x: auto; border-radius: var(--radius-lg); background: var(--bg-card); box-shadow: var(--shadow-card); }
.tabela-wrap:focus-visible { box-shadow: var(--focus-ring), var(--shadow-card); border-radius: var(--radius-lg); }
.tabela-wrap .tabela { font-size: var(--font-size-sm); line-height: var(--font-line-height-normal); }
.tabela caption { caption-side: top; padding: var(--space-4) var(--space-4) var(--space-2); text-align: left; font-size: var(--font-size-xs); color: var(--text-muted); }
.tabela-wrap .tabela th, .tabela-wrap .tabela td { padding: 12px 16px; }
.tabela-wrap .tabela th:nth-child(2), .tabela-wrap .tabela td:nth-child(2) { text-align: right; }
.tabela__base td { background: var(--bg-suave); font-weight: var(--font-weight-medium); }
/* Tabela só de texto (comparativos): a 2ª coluna não é número, então fica à esquerda. */
.tabela-wrap .tabela--texto { min-width: 640px; font-size: var(--font-size-xs); }
.tabela-wrap .tabela--texto th:nth-child(2), .tabela-wrap .tabela--texto td:nth-child(2) { text-align: left; }
.tabela-wrap .tabela--texto td { vertical-align: top; }

/* Destaque de dado */
.dados { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-8); }
.dado { margin: 0; display: grid; align-content: start; gap: var(--space-3); padding: var(--space-6); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--accent) 5%, var(--bg-card)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent) inset; }
.dado__num { font-family: var(--font-family-display); font-size: clamp(var(--font-size-3xl), 8vw, var(--font-size-4xl)); font-weight: var(--font-weight-semibold); line-height: var(--font-line-height-tight); letter-spacing: var(--font-tracking-titulo); background: var(--gradient-marca); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
[data-theme="dark"] .dado__num { background: none; -webkit-text-fill-color: currentColor; color: var(--accent); }
.dado figcaption { display: grid; gap: var(--space-2); }
.dado__legenda { font-size: var(--font-size-md); line-height: var(--font-line-height-normal); color: var(--text); }
.dado__fonte { font-size: var(--font-size-xs); line-height: var(--font-line-height-normal); color: var(--text-muted); }

/* Aviso */
.prosa .alerta { grid-template-columns: 22px minmax(0, 1fr); gap: var(--space-3); padding: 16px 18px; line-height: var(--font-line-height-normal); }
.prosa .alerta p { color: var(--text); margin-top: 4px; }

/* Passos numerados */
.passos-lista { list-style: none; padding: 0; display: grid; gap: var(--space-5); }
.passos-lista li { display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: var(--space-4); row-gap: 2px; counter-increment: passo; }
.passos-lista { counter-reset: passo; }
.passos-lista li + li { margin-top: 0; }
.passos-lista li::before { content: counter(passo); grid-row: 1 / span 2; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--primary); color: var(--on-primary); font-family: var(--font-family-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); line-height: 1; }
.passos-lista strong { display: block; align-self: center; }
.passos-lista span { color: var(--text-muted); font-size: var(--font-size-md); }

/* Checklist: caixas marcadas, uma por ajuste */
.prosa .checklist { list-style: none; padding: 0; display: grid; gap: var(--space-3); }
.checklist li { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: var(--space-4); row-gap: 2px; padding: var(--space-4) var(--space-5); border-radius: var(--radius-lg); background: var(--bg-card); box-shadow: var(--shadow-card); }
.checklist li + li { margin-top: 0; }
.checklist li::before { content: ""; grid-row: 1 / span 2; width: 24px; height: 24px; border-radius: var(--radius-sm); background: var(--positive); }
.checklist li::after { content: ""; position: absolute; left: calc(var(--space-5) + 9px); top: calc(var(--space-4) + 5px); width: 6px; height: 11px; border: solid var(--on-primary); border-width: 0 2px 2px 0; rotate: 45deg; }
.checklist strong { display: block; align-self: center; }
.checklist span { color: var(--text-muted); font-size: var(--font-size-sm); line-height: var(--font-line-height-normal); }

/* Ferramenta: título numerado e ficha (lista de definição: rótulo à esquerda, valor à direita) */
.ferramenta__titulo { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-3); }
.ferramenta__num { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--primary); color: var(--on-primary); font-family: var(--font-family-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); line-height: 1; letter-spacing: 0; }
.ficha { display: grid; border-radius: var(--radius-lg); background: var(--bg-card); box-shadow: var(--shadow-card); overflow: hidden; font-size: var(--font-size-sm); line-height: var(--font-line-height-normal); }
.ficha--destaque { background: color-mix(in srgb, var(--accent) 5%, var(--bg-card)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent) inset; }
.ficha__linha { display: grid; grid-template-columns: 148px minmax(0, 1fr); align-items: baseline; gap: var(--space-4); padding: 12px var(--space-5); }
.ficha__linha + .ficha__linha { border-top: 1px solid var(--border); }
.ficha dt { font-size: var(--font-size-2xs); font-weight: var(--font-weight-medium); letter-spacing: var(--font-tracking-label); text-transform: uppercase; color: var(--text-muted); }
.ficha dd { margin: 0; text-wrap: pretty; }
.ficha__linha--forte dt::before, .ficha__linha--limite dt::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; vertical-align: middle; }
.ficha__linha--forte dt::before { background: var(--positive); }
.ficha__linha--limite dt::before { background: var(--warning); }

/* Chamada dentro do texto: empilhada, na largura da coluna */
.prosa .blog-cta { flex-direction: column; align-items: flex-start; margin-top: var(--space-16); padding: clamp(24px, 4vw, 40px); font-size: var(--font-size-md); }
.prosa .blog-cta .blog-cta__titulo { margin: 0; font-size: clamp(1.6rem, 3vw, 2rem); }
.prosa .blog-cta .blog-cta__resumo { margin: 0; }

/* Fontes */
.fontes ol { list-style: none; padding: 0; counter-reset: fonte; font-size: var(--font-size-sm); line-height: var(--font-line-height-normal); }
.fontes li { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; min-height: var(--size-touch); padding-block: 8px; border-top: 1px solid var(--border); counter-increment: fonte; }
.fontes li + li { margin-top: 0; }
.fontes li::before { content: counter(fonte); font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-subtle); }

/* Voltar ao blog */
.voltar { display: inline-flex; align-items: center; gap: 8px; min-height: var(--size-touch); margin-top: var(--space-8); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--accent-strong); text-decoration: none; }
.voltar svg { width: 16px; height: 16px; transition: translate var(--motion-duration-press) var(--motion-ease-out); }
@media (hover: hover) and (pointer: fine) { .voltar:hover svg { translate: -3px 0; } }

/* Leia também */
.leia-tambem .secao__topo { margin-bottom: var(--space-8); }
.leia-tambem .titulo { font-size: clamp(1.6rem, 3vw, 2.25rem); }

/* ---------- Seção "Próximos artigos" ---------- */
.blog-proximos .titulo, .blog-artigos .titulo { font-size: clamp(1.6rem, 3vw, 2.25rem); }
/* Seção "Artigos": o destaque acima já traz o respiro de cima. */
.blog-artigos { padding-bottom: clamp(56px, 8vw, 104px); }

/* ---------- Responsivo ---------- */
@media (max-width: 880px) {
  .post-destaque { grid-template-columns: minmax(0, 1fr); }
  .post-destaque__midia { min-height: 0; aspect-ratio: 1200 / 630; }
  .post-grade { grid-template-columns: minmax(0, 1fr); }
  .blog-cta { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 760px) {
  .container--post { width: calc(100% - 32px); }
}
@media (max-width: 560px) {
  .ficha__linha { grid-template-columns: minmax(0, 1fr); gap: 2px; padding-inline: var(--space-4); }
  .dados { grid-template-columns: minmax(0, 1fr); }
  .tabela-wrap .tabela th, .tabela-wrap .tabela td { padding: 12px; }
  .post-cabeca .post-meta__item + .post-meta__item::before { display: none; }
  .post-cabeca .post-meta { gap: 2px 16px; }
}

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  .entra > * { translate: none; transition: opacity 200ms ease; transition-delay: 0ms; }
  @starting-style { .entra > * { translate: none; } }
  .post-destaque, .post-destaque__ler svg, .voltar svg { transition: none; }
  a.post-card { transition: none; }
  .post-destaque:hover, .post-destaque:active, .tema:active, a.post-card:hover, a.post-card:active { transform: none; }
  .post-destaque:hover .post-destaque__ler svg, .voltar:hover svg { translate: none; }
}

/* ---------- Assuntos (filtro da listagem e chips do artigo) ---------- */
[hidden] { display: none !important; }
.temas { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); margin-top: var(--space-8); }
.temas a { display: inline-flex; align-items: center; min-height: var(--size-touch); padding-inline: 18px; border-radius: var(--radius-full); background: var(--bg-card); box-shadow: 0 0 0 1px var(--border-forte) inset; color: var(--text); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); text-decoration: none; transition: transform var(--motion-duration-press) var(--motion-ease-out), background-color var(--motion-duration-ui) ease, color var(--motion-duration-ui) ease; }
.temas a:active { transform: scale(.97); }
.temas a[aria-current="page"] { background: var(--primary); color: var(--on-primary); box-shadow: none; }
.temas-vazio { margin-top: var(--space-6); color: var(--text-muted); }
.temas-vazio a { color: var(--link); }
.post-temas { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.post-temas a { text-decoration: none; }
@media (hover: hover) and (pointer: fine) {
  .temas a:not([aria-current]):hover, .post-temas a:hover { background: var(--bg-suave); }
}
@media (prefers-reduced-motion: reduce) {
  .temas a { transition: none; }
  .temas a:active { transform: none; }
}