/* ============================================================
   hipotecalatina.es — simulador.css
   Estilos de la página /simulador (simulador.html).
   Depende de base.css (tokens y componentes compartidos).
   ============================================================ */

.sim-intro{padding:clamp(38px,5vw,64px) var(--space-gutter) clamp(20px,3vw,32px);max-width:var(--maxw);margin-inline:auto}
.sim-intro .eyebrow{margin-bottom:16px}
.sim-intro h1{font-size:var(--fs-h1);font-weight:800;letter-spacing:-.035em;line-height:.92;margin-bottom:18px}
.sim-intro h1 .serif{color:var(--tierra)}
.sim-intro p{font-size:var(--fs-lead);line-height:1.45;max-width:600px;color:var(--ink-82)}

.sim{
  padding:clamp(16px,3vw,32px) var(--space-gutter) clamp(60px,8vw,100px);
  max-width:var(--maxw);margin-inline:auto;
  display:grid;grid-template-columns:1fr;gap:clamp(24px,3vw,44px);align-items:start;
}
@media (min-width:880px){.sim{grid-template-columns:1.15fr .85fr}}

/* Controles */
.sim-form{display:flex;flex-direction:column;gap:clamp(24px,3vw,32px)}
.control__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;gap:12px}
.control__label{font-size:17px;font-weight:700}
.control__label small{font-weight:400;color:var(--ink-55);font-size:14px}
.control__value{font-family:var(--font-mono);font-size:19px;font-weight:700;color:var(--tierra)}
.control__hint{font-family:var(--font-mono);font-size:12px;color:var(--ink-55);margin-top:8px}

/* Range */
input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:999px;
  background:#E3D5BC;outline:none;cursor:pointer;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;
  background:var(--tierra);border:4px solid var(--cream);box-shadow:0 2px 6px rgba(168,52,31,.4);cursor:pointer;
}
input[type=range]::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;background:var(--tierra);
  border:4px solid var(--cream);cursor:pointer;
}
input[type=range]:focus-visible{outline:3px solid var(--sol);outline-offset:4px}

/* Segmented (situación laboral) */
.segmented{display:flex;gap:10px;flex-wrap:wrap}
.seg{
  font-size:15px;font-weight:700;padding:12px 18px;border-radius:var(--radius-sm);cursor:pointer;
  border:1.5px solid var(--ink);background:transparent;color:var(--ink);transition:all .15s ease;
}
.seg.is-active{background:var(--ink);color:var(--cream)}

/* Resultado (sticky) */
.result{position:sticky;top:92px}
.result__card{background:var(--ink);color:var(--cream);border-radius:var(--radius-lg);padding:clamp(24px,2.6vw,34px);overflow:hidden}
.result__eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--sol);margin-bottom:8px}
.result__quota{display:flex;align-items:baseline;gap:6px;margin-bottom:4px}
.result__quota b{font-size:clamp(44px,6vw,64px);font-weight:800;letter-spacing:-.04em;line-height:1}
.result__quota span{font-family:var(--font-mono);font-size:16px;color:var(--cream-70)}
.result__sub{font-size:14px;color:rgba(247,238,223,.65);margin-bottom:24px}
.meter__head{display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px}
.meter__head .v{font-family:var(--font-mono);font-weight:700}
.meter__track{height:10px;border-radius:999px;background:var(--cream-16);overflow:hidden;margin-bottom:6px;position:relative}
.meter__fill{height:100%;border-radius:999px;transition:width .3s ease, background .3s ease}
.meter__fill--sol{background:var(--sol)}
.meter__note{font-family:var(--font-mono);font-size:12px;color:rgba(247,238,223,.6);margin-bottom:24px}
.meter__limit{position:relative;height:16px;margin-bottom:26px}
.meter__limit span{position:absolute;left:35%;top:-2px;transform:translateX(-50%);font-family:var(--font-mono);font-size:10px;color:rgba(247,238,223,.6)}
.verdict{border-radius:var(--radius);padding:18px 20px;transition:background .3s ease,color .3s ease}
.verdict h3{font-size:20px;font-weight:800;letter-spacing:-.01em;margin-bottom:6px}
.verdict p{font-size:14.5px;line-height:1.45;opacity:.9}
.result__cta{margin-top:14px}
.result__disclaimer{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-55);text-align:center;margin-top:12px;line-height:1.5}
