/* Paginas de caso de uso da rescisao (/rescisao/*), 18/10/2026.
   So o que a base nao tem. Nenhuma cor nova: tudo por var(--...) de
   /_base/base.css. Motivo de cada bloco:
   - .faq: copiado de /trabalhista/estilo.css (as perguntas frequentes da
     calculadora), para o FAQ ter a mesma cara sem carregar o estilo inteiro
     da calculadora.
   - .chamada / .btn-grande: o botao grande para a calculadora pedido na
     ordem; e o .botao da base, so maior.
   - .tabela-tipos: a tabela de comparacao tem 4 colunas; a base alinha so a
     ultima a direita.                                                       */

.faq { margin-top: 8px; }
.faq details { border-top: 1px solid var(--line-2); }
.faq details:last-of-type { border-bottom: 1px solid var(--line-2); }
.faq summary {
  cursor: pointer; list-style: none;
  display: flex; align-items: center; gap: 12px;
  min-height: 44px; padding: 12px 0;
  font-size: 18px; line-height: 1.35; color: var(--silk);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before {
  content: "+"; width: 1.1em; flex-shrink: 0;
  font-family: var(--f-dado); color: var(--copper);
}
.faq details[open] summary::before { content: "\2212"; }
.faq details p { margin: 0 0 16px 1.7em; color: var(--silk-2); }

.chamada { display: grid; gap: 12px; justify-items: start; margin-top: 28px; }
.btn-grande { min-height: 64px; padding: 18px 30px; font-size: 18px; }
.btn-grande svg { width: 22px; height: 22px; flex: 0 0 auto; stroke: currentColor; fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.chamada .garantia { margin: 0; font-family: var(--f-dado); font-size: 15px; letter-spacing: .04em; color: var(--silk-2); }

.tabela-rolagem { overflow-x: auto; margin-top: 8px; }
.tabela-tipos th, .tabela-tipos td { padding-right: 14px; }
.tabela-tipos td { text-align: right; font-family: var(--f-dado); font-variant-numeric: tabular-nums; }
.tabela-tipos thead th { color: var(--silk); font-family: var(--f-dado); font-size: 15px; letter-spacing: .04em; text-align: right; }
.tabela-tipos thead th:first-child { text-align: left; }
.tabela-tipos td.aqui, .tabela-tipos th.aqui { color: var(--copper); }
.verbas td { white-space: nowrap; padding-left: 14px; }

.fontes-lei { padding-left: 1.2em; }
.fontes-lei li { margin-bottom: 6px; overflow-wrap: anywhere; }
.fontes-lei a { color: var(--copper); text-underline-offset: 3px; }

@media (max-width: 480px) {
  .btn-grande { width: 100%; }
  .tabela { font-size: 15px; }
  .verbas td { white-space: normal; text-align: right; }
}
