/* =========================================================
   landing-salario-minimo — calculadora de una tarjeta, misma receta que
   landing-vacaciones.css y landing-nomina.css.

   Todos los selectores van prefijados con .landing, la clase del <body>: estas hojas
   comparten nombres con styles.css —.card, .field, .big, .warn— y sin el prefijo ganaban
   ellas por orden de carga y descolocaban los componentes del sitio.

   La base compartida (.wrap, .hero, .tool, .card, .field, .layout, .steps3, .seo-copy,
   .faq…) vive en landing-calculadora.css, cargada antes que esta hoja. Aqui solo lo propio
   de esta calculadora: el aviso ambar, la cifra destacada y la tabla comparativa.
   ========================================================= */
:root {
  --smi-ok:#4caf50;
}
/* Los bloques condicionales usan [hidden]; sin esto, display:grid de .inline2 lo anularia. */
.landing [hidden] {display:none !important}
.landing .field .hintlbl{text-transform:none;font-weight:400;color:#9aacae;font-size:.72rem}
.landing .cap {font-size:.78rem;color:var(--muted);line-height:1.5;margin-top:6px}

/* ===== Cifra destacada ===== */
.landing .big {padding:22px;border-radius:13px;text-align:center;color:#fff;margin-bottom:14px}
.landing .big.destacado {background:linear-gradient(135deg,var(--teal),var(--teal-deep))}
.landing .big .lbl {font-size:.76rem;text-transform:uppercase;letter-spacing:.6px;opacity:.9}
.landing .big .val {font-size:2.6rem;font-weight:800;margin-top:4px;line-height:1}
.landing .big .sub {font-size:.86rem;opacity:.92;margin-top:6px}

/* ===== Aviso ambar (más de 120 jornadas, exceso de horas…) ===== */
.landing .warn {font-size:.82rem;color:#9a6b1e;background:#fdf2e3;border-radius:10px;padding:11px 14px;margin-bottom:14px;line-height:1.5;display:none}
.landing .warn.show {display:block}

/* ===== Tabla comparativa ===== */
.landing table.cmp {width:100%;border-collapse:collapse;font-size:.9rem;margin-top:4px}
.landing table.cmp th {text-align:left;font-size:.74rem;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;padding:0 0 8px;border-bottom:2px solid var(--line)}
.landing table.cmp th:last-child, .landing table.cmp td:last-child {text-align:right}
.landing table.cmp td {padding:9px 0;border-bottom:1px dashed var(--line)}
.landing table.cmp tr:last-child td {border-bottom:none}
.landing table.cmp tr.tot td {font-weight:700;border-top:2px solid var(--line);border-bottom:none;padding-top:11px}

.landing .porque {font-size:.86rem;color:var(--ink);line-height:1.6;margin-top:16px;background:#eef7f9;padding:12px 14px;border-radius:10px}
.landing .disclaimer {font-size:.72rem;color:#9aacae;margin-top:14px;line-height:1.5}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1024px) {
  .landing .layout {grid-template-columns:1fr}
}