/* CSS não-crítico. O crítico (above-the-fold) é inlinado em cada página por
   scripts/render.py; este arquivo carrega de forma assíncrona e cobre o resto. */

/* Listas de CONTEÚDO. Duas decisões aqui:
   - escopo em `main`: sem ele, a regra atingia o <ul> da nav e o margin-bottom
     de 16px empurrava o menu para cima da linha do logo no header;
   - `:where()` zera a especificidade, então toda lista com estilo próprio
     (.related, .takeaways, .sources, .towns, .datalist) mantém o seu
     espaçamento sem precisar competir. */
:where(main ul, main ol) { margin-left: 20px; margin-bottom: 16px; max-width: 70ch; }
:where(main li) { margin-bottom: 6px; }
:where(main ul li)::marker { color: var(--orange-act); }

h2 { scroll-margin-top: 90px; }

.facts tbody tr:last-child th,
.facts tbody tr:last-child td { border-bottom: 0; }
.facts tbody tr:hover { background: var(--panel); }

details.faq summary:focus-visible,
a:focus-visible,
.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.card { transition: border-color .15s ease; }
.card:hover { border-color: var(--accent); }

@media print {
  header.site, footer.site, .crumb, .cta, .related { display: none; }
  body { font-size: 12pt; background: #fff; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10pt; color: #555; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* ---- Tabelas de dataset (/data/) ----
   Tabelas longas precisam de cabeçalho fixo e coluna de identificação legível
   durante o scroll horizontal no mobile. */
table.facts.data { font-size: 14px; }
table.facts.data thead th {
  position: sticky; top: 0; z-index: 2;
  background: var(--panel); color: var(--ink); font-weight: 700;
  width: auto; white-space: nowrap;
}
table.facts.data th, table.facts.data td { padding: 8px 12px; }
table.facts.data tbody td:first-child { font-weight: 600; white-space: nowrap; }
table.facts.data tbody td:nth-child(n+3) { text-align: right; font-variant-numeric: tabular-nums; }
.tablewrap { max-height: 70vh; overflow: auto; border: 1px solid var(--line); }
.tablewrap table { margin: 0; }

/* Downloads */
main ul li a[download] { font-weight: 600; }

/* Primeira coluna fixa: com 7-8 colunas a tabela rola na horizontal, e sem isto
   o leitor perde a referência de qual município/condado está lendo. */
table.facts.data thead th:first-child,
table.facts.data tbody td:first-child {
  position: sticky; left: 0; z-index: 1;
  background: var(--bg);
  box-shadow: 1px 0 0 var(--line);
}
table.facts.data thead th:first-child { z-index: 3; background: var(--panel); }
table.facts.data tbody tr:hover td:first-child { background: var(--panel); }

/* Células de dados não são links — cor explícita para não sugerir que sejam. */
table.facts.data tbody td { color: var(--ink); }
table.facts.data tbody td:nth-child(2) { color: var(--muted); }
