/* Hojas tamaño carta, en pantalla y en papel.
   Las usan la vista previa del editor (firmas.html) y el documento final
   (documento.html). La página se pagina DE VERDAD en el navegador —bloque
   por bloque, midiendo— porque Chrome no sabe poner «Página 2 de 5» en el
   margen por su cuenta: los cuadros de margen de @page no existen ahí. */

.hoja-carta{
  position:relative;
  width:8.5in;
  height:11in;
  background:#fff;
  color:#111927;
  font-family:Georgia,"Times New Roman",serif;
  font-size:15.5px;
  line-height:1.7;
  padding:18mm 20mm 16mm;
  margin:0 auto 26px;
  box-shadow:0 10px 40px rgba(0,0,0,.35);
  box-sizing:border-box;
}
.hoja-cont{
  height:calc(11in - 18mm - 26mm);
  overflow:hidden;
}
.hoja-pie{
  position:absolute;
  left:20mm; right:20mm; bottom:7mm;
  display:flex; justify-content:space-between; gap:12px;
  border-top:1px solid #25314233;
  padding-top:6px;
  font-family:"Inter","Segoe UI",-apple-system,system-ui,Arial,sans-serif;
  font-size:10px; color:#8A94A0;
}
.hoja-pie .pagina{font-variant-numeric:tabular-nums;white-space:nowrap}

/* bloques del documento */
.hoja-carta h1{font-family:inherit;font-size:19px;letter-spacing:.02em;
  text-transform:uppercase;text-align:center;margin:0 0 6px;line-height:1.35}
.hoja-carta .lugar{text-align:center;color:#4A5568;font-size:13.5px;margin:0 0 30px}
.hoja-carta .parr{margin:0;text-align:justify;white-space:pre-wrap;word-wrap:break-word;min-height:1.2em}
.hoja-carta .parr-html{margin:0;text-align:justify;word-wrap:break-word;min-height:1.2em}
.hoja-carta .firmantes-tit{font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:#4A5568;border-top:1.5px solid #111927;margin-top:34px;padding-top:12px;
  font-family:"Inter","Segoe UI",-apple-system,system-ui,Arial,sans-serif}
.fila-firmas{display:grid;grid-template-columns:1fr 1fr;gap:22px 40px;margin-top:20px}
.fila-firmas .bloque{min-width:0}
.bloque .img{height:64px;display:flex;align-items:flex-end}
.bloque img{max-height:64px;max-width:100%}
.bloque .linea{border-top:1px solid #111927;margin-top:4px;padding-top:5px}
.bloque .nombre{font-size:14px;font-weight:700;font-family:"Inter","Segoe UI",sans-serif}
.bloque .cc{font-size:13px;color:#4A5568;font-family:"Inter","Segoe UI",sans-serif}
.bloque .cuando{font-size:10.5px;color:#98A2AE;font-family:"Inter","Segoe UI",sans-serif;margin-top:2px}
.bloque .num{float:right;font-size:11px;color:#9AA4B0;font-family:ui-monospace,Consolas,monospace}
.hoja-carta .cierre{margin-top:34px;color:#9AA4B0;font-size:10.5px;
  font-family:"Inter","Segoe UI",-apple-system,system-ui,Arial,sans-serif;line-height:1.5}
.hoja-carta .cierre.con-qr{display:flex;gap:14px;align-items:flex-start}
.hoja-carta .cierre.con-qr img{width:88px;height:88px;flex:none;border:1px solid #E3E0D8;padding:4px;background:#fff}

/* la previsual del editor: hojas reales, escaladas para caber en la columna */
.previsual{overflow:hidden}
.previsual .lienzo-hojas{transform-origin:top left}

@media print{
  .hoja-carta{box-shadow:none;margin:0;page-break-after:always}
  .hoja-carta:last-child{page-break-after:auto}
  @page{size:letter;margin:0}
}