
.folha{
  --doc-tinta:#111;--doc-cinza:#555;--doc-linha:#ccc;
  --doc-campo:#fff2a8;--doc-campo-borda:#e0c200;
  --doc-nota-bg:#fff8e1;--doc-nota-borda:#c9a227;--doc-nota-tinta:#7a5000;
  background:#fff;color:var(--doc-tinta);
  font-family:Arial,Helvetica,"Segoe UI",sans-serif;font-size:10.5pt;line-height:1.5;
  width:21cm;max-width:100%;min-height:29.7cm;margin:0 auto;padding:2cm 2.5cm;
  box-sizing:border-box}
.folha *{box-sizing:border-box}
.folha h1{font-size:15pt;text-align:center;margin:0 0 4px;line-height:1.3;
  font-weight:bold}
.folha .subtitulo{text-align:center;font-style:italic;color:var(--doc-cinza);
  font-size:11pt;margin:0 0 18px}
.folha .secao{text-align:center;font-weight:bold;font-size:11pt;margin:20px 0 8px;
  padding-bottom:4px;border-bottom:1px solid var(--doc-linha)}
.folha .clausula{font-weight:bold;margin:16px 0 4px;page-break-after:avoid;
  break-after:avoid}
.folha p{margin:0 0 7px;text-align:justify;overflow-wrap:anywhere}
.folha p.pp{margin-left:0.8cm}
.folha ul.itens{list-style:none;margin:0 0 8px;padding:0}
.folha ul.itens li{margin:0 0 4px 1.4cm;text-indent:-0.7cm;text-align:justify}
.folha .nota{background:var(--doc-nota-bg);border:1px solid var(--doc-nota-borda);
  color:var(--doc-nota-tinta);font-size:9.5pt;font-style:italic;border-radius:4px;
  padding:8px 10px;margin:10px 0}
.folha .campo{background:var(--doc-campo);border-bottom:1px solid var(--doc-campo-borda);
  font-weight:bold;padding:0 2px;border-radius:2px;scroll-margin:120px}
.folha.sem-realce .campo{background:transparent;border-bottom:1px solid var(--doc-linha);
  font-weight:bold}
.folha.sem-notas .nota{display:none}
.folha .campo.preenchido{background:#dff3e0;border-bottom-color:#69b36f}
.folha.sem-realce .campo.preenchido{background:transparent;border-bottom:0}
.folha .campo.alvo{outline:2px solid #3b82f6;outline-offset:2px;background:#cfe4ff}
.folha .rolagem{overflow-x:auto;margin:0 0 10px}
.folha table{border-collapse:collapse;width:100%;font-size:9.5pt}
.folha th,.folha td{border:1px solid #999;padding:4px 6px;text-align:left;
  vertical-align:top}
.folha th{background:#e8e8e8;text-align:center}
.folha .localdata{text-align:right;margin:24px 0}
.folha .assinatura{text-align:center;margin-top:30px}
.folha .assinatura .linha{border-top:1px solid #000;width:min(80%,11cm);
  margin:0 auto 4px}
.folha .assinatura .papel{font-weight:bold;font-size:9.5pt}
.folha .assinatura .ident{font-size:9.5pt}
.folha .testemunhas{margin-top:26px}
.folha .testemunhas .tit{font-weight:bold;margin-bottom:6px}
.folha .testemunhas .grade{display:grid;grid-template-columns:1fr 1fr;gap:16px;
  font-size:9.5pt}
.folha .quebra{page-break-before:always;break-before:page}
.folha hr{border:0;border-top:1px solid var(--doc-linha);margin:10px 0}
.folha .espaco{height:12px}
.folha [contenteditable="true"]:focus{outline:2px solid #3b82f6;outline-offset:3px}
@media (max-width:820px){
  .folha{width:100%;padding:1.2cm 1cm;min-height:0;font-size:11pt}
  .folha h1{font-size:14pt}
  .folha .testemunhas .grade{grid-template-columns:1fr}
}
@media print{
  .folha{width:auto;max-width:none;min-height:0;margin:0;padding:0;
    box-shadow:none!important;zoom:1!important;font-size:10.5pt}

  /* As caixas de instrucao sao andaime de preenchimento — o proprio texto
     delas manda apaga-las antes de assinar. Nunca vao para o papel. */
  .folha .nota{display:none!important}

  /* O realce amarelo tambem e andaime: serve para achar o que falta na tela.
     No papel, o dado preenchido precisa parecer parte do contrato. */
  .folha .campo{background:transparent!important;border-bottom:0!important;
    outline:0!important;padding:0}
  .folha .campo.preenchido{font-weight:inherit}   /* dado real: peso normal */
  /* campo ainda vazio segue em negrito com os colchetes a vista, para quem
     imprime pela metade enxergar o que falta completar a caneta */

  .folha p,.folha li{orphans:3;widows:3}
  .folha .clausula,.folha h1,.folha .secao{page-break-after:avoid}
  .folha .assinatura,.folha table{page-break-inside:avoid}
}
