/* article-typography.css — tipografia mobile do single de post/FAQ + índice do blog.
 * Enfileirado em single-post / single-article / single-faq e na listagem (page-blog),
 * depois do bundle.css (ThemeAssets::styles).
 *
 * 1) Título do single → 22px (1.375rem) nos dois breakpoints. No mobile (≤640px) o
 *    bundle.css força `h1:not(#conteudo *){1.75rem!important}`; vencemos por
 *    especificidade `.vnv-article-title:not(#conteudo *)` = (1,1,0) > (1,0,1) + !important.
 * 2) Corpo do post no mobile: parágrafos sobem de 0.875rem (14px) p/ 1rem (16px).
 * 3) Excerpt dos cards do índice do blog no mobile: sobe de 0.75rem (12px) p/ 0.8125rem (13px).
 * 4) Índice "Nesta página" no mobile: itens sobem de 0.75rem (12px) p/ 0.875rem (14px).
 *    (alinhamento à esquerda é via `text-left` no wrapper do toc.blade.php.) */

.vnv-article-title:not(#conteudo *) {
  font-size: 1.375rem !important;
  line-height: 1.25 !important;
}

@media (max-width: 640px) {
  /* Corpo editorial: parágrafos SEM classe vindos do contentHtml. O `:not([class])`
     evita a caixa do autor / tags / disclaimer, que têm classes utilitárias próprias.
     Especificidade (1,1,1) sobrescreve a herança de #conteudo.vnv-entry-content (14px). */
  #conteudo p:not([class]) {
    font-size: 1rem;
    line-height: 1.7;
  }

  /* Excerpt dos cards do índice do blog (1 coluna no mobile, sobra largura).
     Único <p> do card; (1,1,1) vence o utilitário .text-xs (0.75rem). */
  #vnv-blog-grid .vnv-card-clickable p {
    font-size: 0.8125rem;
  }

  /* Itens do índice "Nesta página" no header mobile. `nav .vnv-toc-link`
     (0,1,1) vence o utilitário .text-xs (0,1,0) sem depender da ordem de
     enfileiramento. Escopo de mobile pela media query — o sidebar do desktop
     (hidden lg:block) fica em text-xs. */
  nav .vnv-toc-link {
    font-size: 0.875rem;
  }
}
