/* Isquierdo Dahlem · ajustes de UX/UI (revisão de 12/11/2026)
   Contraste mínimo AA (4,5:1 para texto comum), nenhum texto abaixo de 12 px,
   áreas de toque de 44 px no celular, tabelas legíveis em tela estreita. */

/* ---------- contraste: o cinza de apoio passava raspando (4,49:1) */
:root { --ink-3: #4f6a6d; }                 /* 5,6:1 no branco · 5,1:1 no #f3f6f6 */
.foot-legal, .rx .foot-legal { color: #8b9998; font-size: 12.5px; line-height: 1.7; }
.rx .foot-legal a { color: #b9c4c3; }
.law small { color: var(--ink-3); font-size: 12px; letter-spacing: 0; text-transform: none; }
.hv-panel .crumbs, .page-h .crumbs, .vaga-hero .crumbs, .perfil-hero .crumbs { color: rgba(247, 246, 245, .7); }

/* ---------- tamanhos mínimos (nada abaixo de 12 px) */
.crumbs { font-family: var(--sans); font-size: 13px; letter-spacing: 0; }
.mono, .arow .mono, .vrow .mono, .rotas .mono, .metodo .mono, .fx-tl .mono, .strip-row .mono { font-size: 12.5px; letter-spacing: .01em; }
.tag-r { font-size: 11.5px; padding: 2px 7px; letter-spacing: 0; }
.tese-src { font-size: 12.5px; letter-spacing: 0; text-transform: none; }
.tabs sup { font-size: 11px; }
.aq-n { font-size: 12.5px; letter-spacing: .01em; text-transform: none; }
.fx-hint .demo, .fx-demo { font-size: 11.5px; letter-spacing: 0; text-transform: none; }
.fx-n { font-size: 12px; letter-spacing: .02em; }
.disc { font-size: 12.5px; line-height: 1.6; }
.hx-busca kbd { font-size: 11px; }
.prose ol li::before { font-size: 12px; padding-top: 3px; }
.min, .arow .min { font-size: 12.5px; }
.k, .k kbd { font-size: 12.5px; }

/* ---------- listas numeradas do texto: número + parágrafo, com respiro */
.prose ol li { grid-template-columns: 36px minmax(0, 1fr); padding: 14px 0; font-size: 16px; line-height: 1.6; color: var(--ink-2); }
.prose ol li > span { min-width: 0; }
.prose ul li { font-size: 16px; line-height: 1.6; }

/* ---------- tabelas: em tela estreita, rolam para o lado em vez de espremer as colunas */
.tbl { -webkit-overflow-scrolling: touch; }
@media (max-width: 640px) {
  .tbl table { min-width: 560px; font-size: 13.5px; }
  .tbl::after { content: "Deslize para ver a tabela inteira"; display: block; padding: 8px 14px; font-size: 12px; color: var(--ink-3); background: var(--paper-3); border-top: 1px solid var(--line); position: sticky; left: 0; }
}

/* ---------- celular: áreas de toque de 44 px e textos de leitura confortável */
@media (max-width: 640px) {
  .hx-util-in { height: 40px; gap: 14px; }
  .hx-util a, .hx-busca { display: inline-flex; align-items: center; min-height: 40px; }
  .rx ul { gap: 0; }
  .rx li a { display: inline-flex; align-items: center; min-height: 40px; }
  .toc li { padding: 0; }
  .toc a { display: block; padding: 9px 0; }
  .lnk { padding-top: 10px; }
  .tabs button, .bib-tabs button, .eq-tabs button { min-height: 44px; }
  .sol-tabs button, .tm-b { min-height: 44px; }
  .fx-back { padding: 12px 0; }
  .tm-c h3 a { display: inline-block; padding: 6px 0; }
  .mega-r a, .idx-col li a { min-height: 44px; }
  .prose p { font-size: 16.5px; }
  .reader { padding-top: 40px; }
  .reader-guia h1 { font-size: 32px; line-height: 1.08; }
  .defn dd { font-size: 16px; }
  .resumo li { font-size: 15.5px; }
  .faq summary, .faq-art summary { font-size: 19px; padding: 18px 0; }
}

/* ---------- celular: o botão flutuante cobria texto; vira uma pílula curta e a página ganha folga no fim */
@media (max-width: 640px) {
  .fab-b { height: 44px; padding: 0 16px 0 14px; font-size: 0; gap: 8px; }
  .fab-b::after { content: "Contato"; font-size: 14px; }
  .rx { padding-bottom: 96px; }
}

/* ---------- segunda rodada da auditoria */
.hx-busca kbd { font-size: 12px; }
.vaga-hero .vaga-kv dt { color: rgba(247, 246, 245, .74); }
@media (max-width: 640px) {
  .lnk { padding-top: 14px; padding-bottom: 6px; }
  .rx h2 a { display: inline-flex; align-items: center; min-height: 44px; }
  [data-tab] { min-height: 44px; }
  .tabs-pf button, .tabs button { min-height: 44px; }
  a[href*="/pessoas/"]:not(.logo) { display: inline-block; padding: 8px 0; }
}

/* ---------- opções dos formulários: cartões estáveis (antes o item mudava de recuo ao ser escolhido) */
.opts, .opts.cols { border-top: 0; display: grid; gap: 8px; }
.opts.cols { column-gap: 10px; }
.opt, .opts.cols .opt:nth-child(-n+2) { border: 0; border-radius: 10px; padding: 15px 16px 15px 14px; margin: 0; background: #fff;
  box-shadow: inset 0 0 0 1px var(--line-2); -webkit-tap-highlight-color: transparent;
  transition: background-color .2s, box-shadow .2s, color .2s; }
.opt:hover { background: var(--paper-3); box-shadow: inset 0 0 0 1px var(--ink-3); }
.opt:active { background: var(--paper-4); }
.opt:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.opt.sel { padding-left: 14px; color: var(--ink); background: var(--paper-3); box-shadow: inset 0 0 0 2px var(--ink); }
.opt kbd { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; font-size: 12px; color: var(--ink-3); box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .2s, color .2s; }
.opt.sel kbd { background: var(--ink); color: #fff; box-shadow: none; }
@media (max-width: 640px) { .opt { padding: 14px 14px 14px 12px; font-size: 15.5px; } }

/* ---------- menu do celular: o painel cobria o cabeçalho e escondia o botão de fechar */
.menu { z-index: 55; padding-top: 128px; }
body.menu-on { overflow: hidden; }
body.menu-on .hx { box-shadow: none; background: #fff; }

/* ---------- equipe no celular: dois cartões por tela, o segundo quase inteiro (convida a deslizar) */
@media (max-width: 640px) {
  .tm { grid-auto-columns: 43%; gap: 14px; }
  .tm-ph { margin-bottom: 10px; }
  .tm-c h3 { font-size: 14.5px; line-height: 1.3; }
  .tm-cargo { font-size: 13px; }
  .tm-bio { font-size: 13.5px; }
  .tm-vaga h3 { font-size: 18px; }
  .tm-vaga .tm-mais { font-size: 64px; }
}