/* ==========================================================================
   solitpmt · /static/css/termos.css — Termos de Uso (termos.html, rota /termos)
   Carregue depois de /static/css/solit.css. Só a composição do texto longo:
   os números das cláusulas fazem parte do texto (4.2, a), b)…), então as
   listas não têm marcador próprio. Nenhuma cor nova: só tokens.
   ========================================================================== */

.termos { padding-block: clamp(40px, 6vw, 96px) var(--respiro); }

.termos__corpo { max-width: 48rem; }

.termos__versao {
  margin-top: var(--esp-3);
  font-size: var(--tam-pequeno);
  color: var(--texto-suave);
}

.termos__lead { margin-top: var(--esp-4); }

.termos__resumo { margin-top: var(--esp-7); }
.termos__resumo-lista {
  margin-top: var(--esp-2);
  padding-left: 1.25rem;
  list-style: disc;
  font-size: var(--tam-pequeno);
  line-height: 1.6;
}
.termos__resumo-lista li + li { margin-top: var(--esp-1); }
.termos__resumo .alerta__texto { margin-top: var(--esp-3); }

.termos__secao { margin-top: var(--esp-9); }
.termos__secao > p { margin-top: var(--esp-3); line-height: 1.7; }

.termos__itens {
  margin-top: var(--esp-3);
  padding: 0;
  list-style: none;
  line-height: 1.7;
}
.termos__itens > li + li { margin-top: var(--esp-3); }
.termos__itens .termos__itens { margin-top: var(--esp-2); padding-left: var(--esp-5); }
.termos__itens .termos__itens > li + li { margin-top: var(--esp-1); }

.termos__num {
  font-weight: 600;
  color: var(--tinta);
  font-variant-numeric: tabular-nums;
}

.termos__aberto { color: var(--texto-suave); }

.termos__definicoes { margin-top: var(--esp-3); }
.termos__definicoes > div {
  display: grid;
  grid-template-columns: minmax(8rem, 11rem) 1fr;
  gap: var(--esp-2) var(--esp-5);
  padding-block: var(--esp-3);
  border-top: 1px solid var(--linha);
}
.termos__definicoes > div:last-child { border-bottom: 1px solid var(--linha); }
.termos__definicoes dt { font-weight: 600; color: var(--tinta); }
.termos__definicoes dd { margin: 0; line-height: 1.6; }

@media (max-width: 34rem) {
  .termos__definicoes > div { grid-template-columns: 1fr; gap: var(--esp-1); }
}