/* Caixa de Ferramentas Damasceno — base visual comum às 6 ferramentas */
:root {
  /* Paleta de guilhermedamasceno.adv.br */
  --navy: #0F1B2D;
  --navy-2: #1A2B44;
  --cobre: #D4AE58;        /* dourado: fundos, filetes, destaques */
  --ouro-texto: #8A6A1F;   /* dourado legível sobre branco */
  --cobre-claro: #F6EEDB;
  --creme: #F3F5F8;
  --tinta: #2E3A4B;
  --tinta-2: #5B6779;
  --linha: #DCE1E8;
  --branco: #ffffff;
  --ok: #1f7a4d;   --ok-bg: #e7f4ec;
  --alerta: #a86a00; --alerta-bg: #fff4dc;
  --risco: #b42318; --risco-bg: #fdecea;
  --na: #6b7280;   --na-bg: #f1f2f4;
  --raio: 10px;
  --sombra: 0 1px 2px rgba(27,42,74,.06), 0 4px 16px rgba(27,42,74,.06);
  --serif: "Playfair Display", "Times New Roman", Georgia, serif;
  --sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--creme); color: var(--tinta); font: 15px/1.55 var(--sans); }
h1, h2, h3 { font-family: var(--serif); color: var(--navy); line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 1.9rem; } h2 { font-size: 1.4rem; } h3 { font-size: 1.1rem; }
a { color: var(--navy-2); }
small, .muted { color: var(--tinta-2); }

/* Cabeçalho e rodapé */
.topo { background: var(--navy); color: #E9ECF1; border-bottom: 3px solid var(--cobre); }
.topo .wrap { display: flex; align-items: center; gap: 14px; padding: 10px 16px; }
.topo img { height: 56px; width: auto; }
.topo .marca { display: flex; flex-direction: column; line-height: 1.15; padding-right: 14px; border-right: 1px solid rgba(255,255,255,.35); }
.topo .marca b { font: 700 1.2rem var(--serif); color: #fff; }
.topo .marca span { font: 600 .9rem var(--sans); color: var(--cobre); }
.topo .titulo { font: 600 .95rem var(--sans); color: #AEB9C9; }
.topo .voltar { margin-left: auto; background: var(--cobre); border-color: var(--cobre); color: var(--navy); }
.topo .voltar:hover { background: #e0bf72; }
@media (max-width: 640px) { .topo .marca { display: none; } .topo img { height: 44px; } }
.rodape { text-align: center; font-size: .8rem; color: var(--tinta-2); padding: 24px 16px 40px; }
.lema { font: 700 1.05rem var(--serif); color: var(--navy); margin-bottom: 6px; }
.lema em { font-style: normal; color: var(--ouro-texto); letter-spacing: .04em; }
.wrap { max-width: 960px; margin: 0 auto; padding: 0 16px; }
main.wrap { padding-top: 24px; padding-bottom: 24px; }

/* Faixa de destaque */
.hero { background: linear-gradient(135deg, var(--navy), var(--navy-2)); color: #fff; border-radius: var(--raio); padding: 28px 24px; margin-bottom: 20px; }
.hero h1, .hero h2 { color: #fff; }
.hero p { color: #dfe5f1; margin: 0; }

/* Cartões e grade */
.card { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); box-shadow: var(--sombra); padding: 20px; margin-bottom: 16px; }
.grade { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.grade-2 { display: grid; gap: 12px 16px; grid-template-columns: 1fr 1fr; }
@media (max-width: 640px) { .grade-2 { grid-template-columns: 1fr; } h1 { font-size: 1.5rem; } }

/* Formulários */
label { display: block; font-weight: 600; font-size: .88rem; margin: 0 0 4px; color: var(--navy); }
input, select, textarea { width: 100%; padding: 9px 11px; border: 1px solid #cfd5df; border-radius: 8px; font: inherit; background: #fff; color: var(--tinta); }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--cobre); outline-offset: 1px; border-color: var(--cobre); }
input[type=checkbox], input[type=radio] { width: auto; }
.campo { margin-bottom: 12px; }
.ajuda { font-size: .8rem; color: var(--tinta-2); margin-top: 3px; }

/* Botões */
.btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 8px; border: 1px solid var(--navy); background: var(--navy); color: #fff; font: 600 .92rem var(--sans); cursor: pointer; text-decoration: none; }
.btn:hover { background: var(--navy-2); }
.btn.sec { background: #fff; color: var(--navy); }
.btn.sec:hover { background: var(--creme); }
.btn.cobre { background: var(--cobre); border-color: var(--cobre); color: var(--navy); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.acoes { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; margin-top: 16px; }

/* Etapas do assistente */
.etapas { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.etapas button { flex: 1 1 auto; border: 1px solid var(--linha); background: #fff; border-radius: 999px; padding: 6px 12px; font: 500 .82rem var(--sans); color: var(--tinta-2); cursor: pointer; }
.etapas button.ativa { background: var(--navy); color: #fff; border-color: var(--navy); }
.etapas button.feita { border-color: var(--ok); color: var(--ok); }
.progresso { height: 6px; background: var(--linha); border-radius: 999px; overflow: hidden; margin-bottom: 16px; }
.progresso > i { display: block; height: 100%; background: var(--cobre); transition: width .2s; }

/* Item de checklist com Sim / Não / N/A */
.item { border-bottom: 1px solid var(--linha); padding: 12px 0; }
.item:last-child { border-bottom: 0; }
.item .txt { font-weight: 500; }
.item .base { font-size: .78rem; color: var(--tinta-2); margin-top: 2px; }
.item .dica { font-size: .82rem; background: var(--cobre-claro); border-radius: 6px; padding: 6px 10px; margin-top: 6px; display: none; }
.item.aberto .dica { display: block; }
.escolha { display: inline-flex; gap: 6px; margin-top: 8px; }
.escolha button { min-width: 56px; padding: 5px 12px; border-radius: 6px; border: 1px solid #cfd5df; background: #fff; font: 600 .85rem var(--sans); cursor: pointer; }
.escolha button[data-v=sim].on { background: var(--ok); border-color: var(--ok); color: #fff; }
.escolha button[data-v=nao].on { background: var(--risco); border-color: var(--risco); color: #fff; }
.escolha button[data-v=na].on { background: var(--na); border-color: var(--na); color: #fff; }

/* Selos e alertas */
.selo { display: inline-block; padding: 2px 9px; border-radius: 999px; font: 700 .72rem var(--sans); letter-spacing: .03em; text-transform: uppercase; }
.selo.alto { background: var(--risco-bg); color: var(--risco); }
.selo.medio { background: var(--alerta-bg); color: var(--alerta); }
.selo.baixo { background: var(--ok-bg); color: var(--ok); }
.alerta { border-radius: 8px; padding: 10px 14px; margin: 10px 0; font-size: .9rem; border: 1px solid; }
.alerta.risco { background: var(--risco-bg); border-color: var(--risco); }
.alerta.atencao { background: var(--alerta-bg); border-color: var(--alerta); }
.alerta.ok { background: var(--ok-bg); border-color: var(--ok); }
.alerta.info { background: #eef2f9; border-color: var(--navy-2); }

/* Números de resultado */
.kpis { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin: 12px 0; }
.kpi { background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px; text-align: center; }
.kpi b { display: block; font: 700 1.6rem var(--serif); color: var(--navy); }
.kpi span { font-size: .8rem; color: var(--tinta-2); }

/* Tabelas */
table { width: 100%; border-collapse: collapse; font-size: .9rem; }
th { background: var(--navy); color: #fff; text-align: left; padding: 8px 10px; font-weight: 600; }
td { padding: 8px 10px; border-bottom: 1px solid var(--linha); vertical-align: top; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.tabela-rolagem { overflow-x: auto; }

/* Documento gerado (contrato, regimento) — prévia em tela */
.documento { background: #fff; border: 1px solid var(--linha); padding: 40px 48px; font: 12pt/1.6 "Times New Roman", serif; color: #000; }
.documento h1, .documento h2, .documento h3 { font-family: "Times New Roman", serif; color: #000; text-align: center; }
.documento p { text-align: justify; margin: 0 0 10px; }
@media (max-width: 640px) { .documento { padding: 20px 16px; } }

.oculto { display: none !important; }
.aviso-legal { font-size: .78rem; color: var(--tinta-2); border-top: 1px solid var(--linha); margin-top: 20px; padding-top: 10px; }

/* Impressão: só o que tem .imprimir (ou o main inteiro, se nada marcado) */
@media print {
  body { background: #fff; font-size: 11pt; }
  .topo .voltar, .no-print, .etapas, .progresso, .acoes, .rodape { display: none !important; }
  .card { box-shadow: none; border-color: #ccc; break-inside: avoid; }
  .documento { border: 0; padding: 0; }
  a { color: #000; text-decoration: none; }
}
