/* ─── Calculadora de minicuotas ─────────────────────────────────────────── */

.calc{padding-block:clamp(34px,5vw,56px)}
.calc-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:22px;align-items:start}
.panel{padding:clamp(20px,3vw,28px);border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}

.campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.opcional{font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.acciones{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}

.boton-csv{min-height:38px;padding:6px 13px;font-size:13px}

/* Las cifras del resultado. La cuota manda —es lo que la persona busca— y la
   tasa efectiva va aparte, en ámbar, porque es la que nadie mira y la que de
   verdad decide si el crédito conviene. */
.cifras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cifra{display:grid;align-content:start;gap:3px;padding:14px 15px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2)}
.cifra-rotulo{font-family:"IBM Plex Mono",monospace;font-size:10.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cifra strong{font-family:"Archivo",sans-serif;font-size:23px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--text)}
.cifra small{color:var(--muted);font-size:12px;line-height:1.35}
.cifra.destacada{grid-column:1/-1;border-color:color-mix(in srgb,var(--orange) 40%,var(--line));background:color-mix(in srgb,var(--orange) 9%,var(--surface))}
.cifra.destacada strong{font-size:clamp(30px,4.4vw,40px)}
.cifra.alerta{border-color:color-mix(in srgb,var(--warning) 42%,var(--line));background:var(--warning-soft)}
.cifra.alerta strong{color:var(--warning)}

.aviso-flat{margin-top:14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--warning) 45%,var(--line));border-radius:11px;background:var(--warning-soft);color:var(--warning);font-size:14px;font-weight:600;line-height:1.45}

.tabla-caja{margin-top:18px;max-height:420px;overflow:auto;border:1px solid var(--line);border-radius:13px}
.tabla{width:100%;border-collapse:collapse;font-size:14px}
.tabla caption{padding:12px 14px 10px;text-align:left;font-family:"Archivo",sans-serif;font-size:15px;font-weight:800;letter-spacing:-.02em;color:var(--text)}
.tabla thead th{position:sticky;top:0;z-index:1;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--surface-2);font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);text-align:right}
.tabla thead th:first-child{text-align:left}
.tabla td{padding:8px 12px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.tabla td:first-child{text-align:left;color:var(--muted)}
.tabla tbody tr:last-child td{border-bottom:0}
.tabla tbody tr:nth-child(even){background:color-mix(in srgb,var(--surface-2) 45%,transparent)}
.tabla .vacia td{padding:26px 14px;color:var(--muted);text-align:center;white-space:normal}

.explicacion{padding-bottom:clamp(40px,6vw,72px)}
.explicacion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.explicacion-grid article{padding:18px 19px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.explicacion-grid h3{margin-bottom:6px;font-size:17px;letter-spacing:-.02em}
.explicacion-grid p{color:var(--muted);font-size:14.5px;line-height:1.5}
.descargo{margin-top:16px;color:var(--muted);font-size:13px;line-height:1.5}

@media (max-width:980px){
  .calc-grid{grid-template-columns:1fr}
  .explicacion-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .campos{grid-template-columns:1fr}
  .cifras{grid-template-columns:1fr}
  .tabla-caja{max-height:none}
  .tabla{font-size:13px}
  .tabla td,.tabla thead th{padding:7px 9px}
}