/* Página de texto (modelo): título, data de atualização, índice curto e seções de texto corrido. Prefixo tx-.
   Primeira página do modelo: Política de privacidade (/politica-de-privacidade/). Nada aqui é só dela: outra página de texto liga esta folha.
   A base vem do previa.css e não é copiada: .pg-topo, .migalhas e .resposta (topo das internas), .indice (a lista do índice e o estado
   .atual, que o previa.js liga pelo atributo data-indice) e .artigo (tipografia de texto longo: títulos, listas e links). */

/* ---------- 1. topo: uma coluna só (título, data e abertura) ---------- */
.tx-topo .caixa{grid-template-columns:minmax(0,1fr);padding-bottom:clamp(36px,5vw,56px)}
.tx-data{margin-top:14px;font-size:14.5px;line-height:1.4;color:var(--fg2)}
.tx-topo .resposta{margin-top:16px}

/* ---------- 2. corpo: o texto à esquerda, na mesma margem do título, e o índice à direita, acompanhando a rolagem ---------- */
.tx-corpo{padding-top:clamp(36px,5vw,64px)}
.tx-grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,272px);column-gap:clamp(32px,6vw,88px);align-items:start}
/* no código o índice vem antes do texto; no computador ele vai para a segunda coluna */
.tx-grade > .tx-indice{grid-column:2;grid-row:1}
.tx-grade > .tx-texto{grid-column:1;grid-row:1}

/* índice: o número numa coluna e o título na outra, para a segunda linha do título não voltar para baixo do número */
.tx-indice a{display:grid;grid-template-columns:2em minmax(0,1fr)}
.tx-indice a > span:first-child{font-variant-numeric:tabular-nums}

/* ---------- 3. seções de texto ---------- */
.tx-texto{max-width:68ch}
/* o menu fica fixo no alto: a seção para abaixo dele quando o índice leva até ela */
.tx-secao{scroll-margin-top:100px}
.tx-texto > .tx-secao + .tx-secao{margin-top:clamp(40px,5vw,56px)}
.tx-secao > * + *{margin-top:1.05em}
.tx-texto .tx-secao > h2{margin-top:0}
.tx-texto li + li{margin-top:.6em}

@media (max-width:980px){
  /* uma coluna: o índice primeiro, numa caixa (regra de .indice no previa.css), e o texto embaixo */
  .tx-grade{grid-template-columns:minmax(0,1fr);row-gap:clamp(28px,6vw,40px)}
  .tx-grade > .tx-indice,.tx-grade > .tx-texto{grid-column:1;grid-row:auto}
  .tx-indice{max-width:560px;padding:16px 18px 4px;font-size:15px}
  .tx-indice > p{margin-bottom:6px}
  /* cada linha do índice tem 44px de altura para o dedo, separada da seguinte por um fio */
  .tx-indice ol{gap:0;border-left:0}
  .tx-indice a{margin-left:0;padding:12px 0;border-left:0;border-top:1px solid var(--linha)}
  .tx-indice a.atual{font-weight:400;color:var(--fg2)}
}