/* ============================================================
   CABAS REALTOR — hoja de informe / PDF (diseño PREMIUM común)
   ------------------------------------------------------------
   Una sola hoja para TODOS los informes que ven los clientes:
   las calculadoras (comprar, vender, inversión, informe de
   compra) y el generador de /informes-mercado/ enlazan este
   mismo archivo, para que el diseño no vuelva a divergir.

   Diseño: fondo BLANCO, logo circular dorado SIN caja, sin
   cabecera ni pie negros, filetes y acentos en el dorado de la
   marca (#b28e44), tablas con relleno crema (#efe4c8) y cebreado
   suave, tipografía Cormorant (títulos) + Inter (cifras).
   ============================================================ */

.hoja{background:#fff;color:#1A1712;max-width:900px;margin:0 auto;box-shadow:0 20px 60px rgba(0,0,0,.4)}

/* ---- Cabecera: blanca, logo circular sin caja, filete dorado ---- */
.i-header{background:#fff;color:#1A1712;padding:1.8rem 2.4rem;display:flex;justify-content:space-between;gap:2rem;align-items:center;border-bottom:2px solid var(--oro)}
.i-logo-box{flex:0 0 auto;border:none;border-radius:0;padding:0;width:auto;height:auto;display:flex;align-items:center;justify-content:center}
.i-logo-box img{width:92px;height:auto}
.i-header-main{flex:1}
.i-eyebrow{color:#b28e44;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:700}
.i-titulo{font-size:2.1rem;margin:.25rem 0 .35rem;color:#b28e44;font-family:var(--serif);font-weight:600}
.i-subtitulo{color:#5c5446;font-size:.98rem}
.i-vivienda{color:#5c5446;font-size:.86rem;margin-top:.6rem;font-weight:600}
.i-fecha{text-align:right;flex:0 0 auto;font-size:.78rem;color:#5c5446;white-space:nowrap}
.i-fecha strong{display:block;color:#b28e44;font-size:.85rem;margin-bottom:.2rem}

.i-body{padding:2rem 2.4rem}
.i-seccion-titulo{color:#b28e44;text-transform:uppercase;letter-spacing:.1em;font-size:.76rem;font-weight:700;border-bottom:1px solid #E3D9C2;padding-bottom:.5rem;margin-bottom:1.1rem;margin-top:1.8rem}
.i-seccion-titulo:first-child{margin-top:0}

.i-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.i-stat{padding:0 1.2rem;border-left:1px solid #E3D9C2}
.i-stat:first-child{border-left:none;padding-left:0}
.i-stat-label{color:#b28e44;text-transform:uppercase;letter-spacing:.06em;font-size:.68rem;font-weight:700;margin-bottom:.3rem;line-height:1.25;min-height:2.5em}
.i-stat-valor{font-family:var(--sans);font-size:1.7rem;font-weight:700;color:#1A1712;font-variant-numeric:tabular-nums}
.i-stat-cap{color:#6b6356;font-size:.74rem;margin-top:.15rem}
@media (max-width:640px){.i-stats{grid-template-columns:1fr 1fr;row-gap:1rem}.i-stat{border-left:none;padding-left:0}}

.i-tabla-cab{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.6rem}
.i-tabla-cab .plazo-label{font-weight:700;font-size:.9rem}
.i-tabla-cab .tin-label{color:#6b6356;font-size:.78rem}
table.i-tabla{width:100%;border-collapse:collapse;margin-bottom:.5rem}
table.i-tabla th{background:#efe4c8;color:#7a5b18;text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;padding:.6rem .7rem;font-weight:700;border-bottom:1.5px solid var(--oro)}
table.i-tabla th.num,table.i-tabla td.num{text-align:right;font-variant-numeric:tabular-nums}
table.i-tabla th.centro,table.i-tabla td.centro{text-align:center}
table.i-tabla td{padding:.65rem .7rem;font-size:.86rem;border-bottom:1px solid #EDE7D8;color:#1A1712}
table.i-tabla tr:nth-child(even) td{background:#f7f4ee}
table.i-tabla tr.recomendada td{background:#f3ead4;color:#6B5115;font-weight:700}
table.i-tabla td.aportacion{font-weight:700}
.i-tabla-nota{font-style:italic;color:#6b6356;font-size:.78rem;margin-bottom:1.4rem}

.i-dos-col{display:grid;grid-template-columns:1.3fr 1fr;gap:1.5rem;margin-top:1.6rem}
@media (max-width:640px){.i-dos-col{grid-template-columns:1fr}}
.i-lectura ul{list-style:none}
.i-lectura li{position:relative;padding-left:1.1rem;margin-bottom:.65rem;font-size:.88rem;line-height:1.5;color:#1A1712}
.i-lectura li::before{content:'';position:absolute;left:0;top:.5em;width:5px;height:5px;border-radius:50%;background:var(--oro)}

/* Caja destacada (p. ej. la cuota): crema con filete dorado, cifra en dorado. */
.i-equilibrado{background:#faf6ea;color:#1A1712;border:1px solid var(--oro);border-radius:6px;padding:1.4rem 1.5rem}
.i-equilibrado .lbl{color:#b28e44;text-transform:uppercase;letter-spacing:.08em;font-size:.68rem;font-weight:700}
.i-equilibrado .cifra{font-family:var(--sans);font-size:2.3rem;font-weight:700;color:#b28e44;margin:.3rem 0;font-variant-numeric:tabular-nums;
  /* Reset: la clase .cifra también la usan los cuadros de inicio (fondo claro);
     aquí es solo un número dentro de la caja, sin recuadro propio. */
  background:none;border:none;padding:0;max-width:none;flex:0 1 auto;box-shadow:none;transform:none}
.i-equilibrado .cap{color:#6b6356;font-size:.78rem;margin-bottom:.9rem}
.i-equilibrado .fila{display:flex;justify-content:space-between;border-top:1px solid rgba(178,142,68,.3);padding-top:.7rem;font-size:.82rem;margin:0}
.i-equilibrado .fila strong{color:#1A1712}

.i-callout{background:#faf6ea;border-left:4px solid var(--oro);padding:1rem 1.3rem;border-radius:4px;margin-top:1.6rem;font-size:.86rem;color:#1A1712}
.i-callout strong.tit{display:block;color:#b28e44;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;font-weight:700;margin-bottom:.4rem}

.i-hipotesis{color:#544e43;font-size:.78rem;line-height:1.6;margin-top:1.6rem}
.i-hipotesis strong{color:#1A1712}
.i-disclaimer{color:#6b6356;font-size:.74rem;font-style:italic;margin-top:.7rem;line-height:1.5}

/* ---- Pie: blanco, filete dorado arriba (sin pie negro) ---- */
.i-footer{background:#fff;color:#1A1712;padding:1rem 2.4rem;display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;border-top:1px solid var(--oro)}
.i-footer strong{color:#b28e44}
.i-footer .contacto{color:#5c5446}

/* Agrupa hipótesis + disclaimer + pie para que se muevan juntos entre
   páginas al imprimir, en vez de quedar el pie solo y aislado. */
.i-cierre-texto{padding:0 2.4rem}

/* ---------- Impresión: solo se ve la hoja marcada, el resto de la
   página (nav, secciones, formularios) queda oculto ---------- */
body.modo-impresion-informe > *:not(.hoja-imprimible-wrap){display:none !important}
.hoja-imprimible-wrap{display:none}
body.modo-impresion-informe .hoja-imprimible-wrap{display:block !important}

@media print{
  html,body{background:#fff}
  nav.nav, footer.footer, header.section-negro, .pantalla-solo, #pantalla-form{display:none !important}
  /* Ocultar en la impresión/PDF los elementos flotantes: chatbot Kitty,
     botón de WhatsApp y widgets de Google Translate (si no, se colaban). */
  #kitty-root, .whatsapp, #google_translate_element, .skiptranslate,
  div[id^="goog-gt"], .VIpgJd-ZVi9od-aZ2wEe-wOHMyf{display:none !important}
  .hoja{box-shadow:none;max-width:none}
  @page{size:A4;margin:10mm}
  /* Rellenos crema / dorados: imprimir el color tal cual (sin este ajuste
     los navegadores los omiten para ahorrar tinta). */
  .i-header, table.i-tabla th, .i-equilibrado, .i-footer,
  table.i-tabla tr.recomendada td, table.i-tabla tr:nth-child(even) td,
  .i-callout{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .i-logo-box img{width:68px}
  /* UNA sola cara A4: los bloques FLUYEN (no se fuerza ningún salto entre el
     desglose y la financiación). Solo se evita PARTIR por dentro los elementos
     pequeños; si de verdad no cabe, el contenido salta por sí solo. */
  .i-tabla-grupo{page-break-inside:avoid}
  .i-stats{page-break-inside:avoid}
  .i-equilibrado{page-break-inside:avoid}
  .i-footer{page-break-inside:avoid}
  .i-seccion-titulo{page-break-after:avoid}
  /* Compactación de márgenes y espacios para caber en una cara. */
  .i-body{padding:.75rem .85rem}
  .i-header{padding:.8rem .85rem}
  .i-footer{padding:.7rem .85rem}
  .i-cierre-texto{padding:0 .85rem}
  .i-titulo{font-size:1.6rem;margin:.1rem 0 .25rem}
  .i-stat-valor{font-size:1.45rem}
  .i-stat-label{font-size:.64rem;letter-spacing:.03em;min-height:0}
  .i-seccion-titulo{margin-top:.8rem;margin-bottom:.45rem}
  .i-dos-col{margin-top:.7rem;gap:.9rem}
  .i-callout{margin-top:.7rem;padding:.7rem 1rem}
  .i-hipotesis{margin-top:.7rem}
  .i-equilibrado{padding:.6rem .9rem}
  .i-equilibrado .cifra{font-size:1.6rem;margin:.1rem 0}
  .i-equilibrado .cap{margin-bottom:.4rem}
  .i-equilibrado .fila{padding-top:.35rem;font-size:.74rem}
  .i-tabla-nota{margin-bottom:.5rem}
  .i-lectura li{margin-bottom:.4rem;font-size:.82rem}
  table.i-tabla th{padding:.4rem .55rem}
  table.i-tabla td{padding:.32rem .55rem;font-size:.8rem}
}

/* Segunda hoja del informe comparativo (3 plazos): en pantalla va separada;
   al imprimir empieza en una cara nueva, con su propia cabecera y pie. */
.hoja-cont{margin-top:2rem}
@media print{ .hoja-cont{page-break-before:always} }

/* Informe comparativo (informe-compra, hoja #hoja + su continuación .hoja-cont):
   compactar fuerte para DOS caras — todas las tablas menos la última en la
   primera, y la última tabla + las conclusiones en la segunda. Scoped por #hoja
   y .hoja-cont: no afecta a las otras hojas. */
@media print{
  #hoja .i-header, .hoja-cont .i-header{padding:.4rem .85rem}
  #hoja .i-logo-box img, .hoja-cont .i-logo-box img{width:40px}
  #hoja .i-titulo, .hoja-cont .i-titulo{font-size:1.05rem;margin:.02rem 0 .06rem}
  #hoja .i-subtitulo, .hoja-cont .i-subtitulo{font-size:.74rem}
  #hoja .i-vivienda, .hoja-cont .i-vivienda{font-size:.72rem;margin-top:.15rem}
  #hoja .i-body{padding-top:.5rem}
  #hoja .i-stat-valor{font-size:.92rem}
  #hoja .i-stat-label{min-height:0;font-size:.58rem}
  #hoja .i-stat-cap{display:none}
  #hoja .i-seccion-titulo, .hoja-cont .i-seccion-titulo{margin:.25rem 0 .14rem}
  #hoja .i-tabla-cab, .hoja-cont .i-tabla-cab{margin:.18rem 0 .06rem}
  #hoja table.i-tabla th, .hoja-cont table.i-tabla th{padding:.1rem .5rem;font-size:.6rem}
  #hoja table.i-tabla td, .hoja-cont table.i-tabla td{padding:.045rem .5rem;font-size:.66rem}
  #hoja .i-tabla-grupo, .hoja-cont .i-tabla-grupo{margin-bottom:.06rem}
  #hoja .i-footer, .hoja-cont .i-footer{padding:.5rem .85rem}
  #hoja .i-footer-clon{padding:.5rem .85rem}
  /* Conclusiones (2ª cara): compactar lectura, caja y callout para que quepan
     con la última tabla. */
  .hoja-cont .i-tabla-nota{margin:.15rem 0 .4rem;font-size:.7rem}
  .hoja-cont .i-dos-col{margin-top:.4rem;gap:.7rem}
  .hoja-cont .i-lectura li{margin-bottom:.22rem;font-size:.72rem;line-height:1.32}
  .hoja-cont .i-equilibrado{padding:.5rem .8rem}
  .hoja-cont .i-equilibrado .cifra{font-size:1.4rem;margin:.05rem 0}
  .hoja-cont .i-equilibrado .cap{margin-bottom:.3rem}
  .hoja-cont .i-equilibrado .fila{padding-top:.28rem;font-size:.72rem}
  .hoja-cont .i-callout{margin-top:.5rem;padding:.5rem .9rem;font-size:.76rem}
  .hoja-cont .i-hipotesis{margin-top:.5rem;font-size:.66rem;line-height:1.4}
  .hoja-cont .i-disclaimer{font-size:.64rem;margin-top:.3rem}
}

/* En móvil, la tabla comparativa (7 columnas) no debe desbordar la hoja
   ni empujar la página: se desplaza horizontalmente dentro de su grupo. */
@media(max-width:700px){
  .i-tabla-grupo{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.i-tabla{min-width:580px}
}