:root{--blue:#004aac;--ink:#11213f;--muted:#55657e;--line:#d7e3f2;--light:#eff5ff;--shadow:0 14px 36px rgba(18,49,93,.07)}
body{color:var(--ink);background:linear-gradient(#f5f8ff,#f8fafd 650px)}
main.wrapper{max-width:1180px}
h1{max-width:850px;font-weight:850;letter-spacing:-.025em}
h2{color:#112e61;line-height:1.25;font-size:clamp(1.25rem,2.4vw,1.7rem)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #85b4ff;outline-offset:3px}
.hero{padding-top:18px;padding-bottom:6px}
.hero>p{font-size:1.08rem;max-width:75ch;color:#354762}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:850;text-transform:uppercase;letter-spacing:.13em;color:#285cb5}
.pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.pills span{display:inline-flex;align-items:center;border-radius:20px;background:#eaf2ff;border:1px solid #c9dbf6;padding:5px 12px;color:#244f9b;font-size:.84rem;font-weight:650}
.panel{border-color:var(--line);box-shadow:var(--shadow);padding:clamp(16px,3vw,32px)}
.tool{border-top:5px solid var(--blue)}
.tool-intro{color:var(--muted);max-width:75ch}
.tool h2{margin-top:.1rem}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin:22px 0}
.actions{display:flex;gap:10px;flex-wrap:wrap}
button,.btn{min-height:44px;border-radius:11px;padding:10px 16px;border:1px solid transparent;font-size:.95rem;line-height:1.4;font-weight:750;cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
button.secondary{color:#06439e;background:#e8f1ff;border-color:#c1d5f7}
button.ghost{color:#254368;background:white;border-color:#ccdaeb}
button.remove{color:#963b38;background:#fff;border-color:#ebcaca;min-width:72px;align-self:end}
button:hover:not(:disabled){filter:brightness(.96)}
label{display:flex;flex-direction:column;gap:7px;color:#203653;font-size:.89rem;font-weight:750;min-width:0}
label input{width:100%;max-width:none;min-height:44px;background:#fff;border:1px solid #bacde6;border-radius:10px;padding:10px 12px;color:#15243c;font-size:1rem;line-height:1.4}
label input::placeholder{color:#8995aa}
label input:focus{border-color:#1a65cf}
.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;background:#f3f7ff;border:1px solid #d9e6fa;padding:17px;border-radius:14px;margin:18px 0}
.help{font-size:.84rem;font-weight:400;color:var(--muted)}
.row-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:25px}
.row-head h3{margin:0;font-size:1.15rem}
.counter{font-size:.84rem;color:var(--muted)}
#componentes{display:grid;gap:12px;margin-top:14px}
.component{margin:0;min-width:0;border:1px solid #d5e1f2;background:#fbfdff;border-radius:13px;padding:12px 16px 17px}
.component legend{color:#365f9b;font-weight:850;font-size:.88rem;padding:0 7px}
.component-grid{display:grid;grid-template-columns:minmax(155px,2fr) repeat(4,minmax(88px,1fr)) auto;gap:12px;align-items:end}
.component .field-name{min-width:0}
.message{margin:14px 0;padding:14px 17px;background:#fff2f1;border:1px solid #edaca9;border-radius:11px;color:#8e261f;font-weight:650}
.form-end{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:20px 0 0}
.form-end .main-action{background:#004aac;color:white;padding:12px 22px}
.privacy{font-size:.84rem;color:var(--muted);margin:14px 0 0}
[hidden]{display:none!important}
.results{margin-top:26px;border-top:1px solid #d7e3f2;padding-top:22px}
.results h3{font-size:1.17rem;color:#143a78;margin:0}
.results-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-bottom:17px}
.summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.metric{background:linear-gradient(135deg,#eff5ff,#fbfdff);border:1px solid #d8e5f7;padding:18px;border-radius:13px;min-width:0}
.metric.primary{background:linear-gradient(130deg,#093f9c,#2466bf);color:white;border-color:transparent}
.metric span{font-size:.84rem;display:block;color:#526682}
.metric.primary span{color:#dfeeff}
.metric strong{display:block;font-size:clamp(1.4rem,3vw,2rem);line-height:1.25;margin-top:9px;letter-spacing:-.03em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.advice{background:#f1f7ff;border-left:4px solid #1a63bc;padding:14px 16px;border-radius:7px;margin-top:17px}
.advice p{margin:.2rem 0}
#finanzas{display:flex;gap:24px;flex-wrap:wrap;margin:12px 0;background:#f7fafc;border:1px solid var(--line);border-radius:10px;padding:14px 17px}
#finanzas span{font-size:.88rem;color:#49617d}
#finanzas strong{display:block;font-size:1.15rem;color:#1b3b6a}
#finanzas strong.negative{color:#a52c2c}
.results h4{margin:25px 0 12px;font-size:1.05rem}
.table-wrap{overflow-x:auto;max-width:100%;border:1px solid #d9e3f1;border-radius:12px}
table{border-collapse:collapse;width:100%;min-width:850px;font-size:.9rem}
caption{position:absolute;clip:rect(0 0 0 0);height:1px;width:1px;overflow:hidden}
td,th{padding:12px 11px;white-space:nowrap;border-bottom:1px solid #e5edf7;text-align:left}
th{background:#eaf2fe;color:#254366;font-size:.83rem}
tr:last-child td{border-bottom:0}
.limiting-row{background:#fff8e9}
.table-footnote{font-size:.83rem;color:var(--muted)}
.long-copy{max-width:85ch}
.long-copy p,.long-copy li{line-height:1.75}
.long-copy li{margin-bottom:7px}
.faq details{border-bottom:1px solid var(--line);padding:12px 0}
.faq summary{cursor:pointer;font-weight:760}
.referral{border-left:5px solid #004aac;background:linear-gradient(100deg,#fff,#eff5ff)}
.referral a{font-weight:800;color:#004aac}
.referral small{color:var(--muted)}
@media(max-width:1020px){.component-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.component .field-name{grid-column:span 3}.component .remove{grid-column:4;grid-row:1;align-self:end}.component label:nth-of-type(2){grid-column:1}}
@media(max-width:700px){.options,.summary{grid-template-columns:1fr}.component-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.component .field-name{grid-column:1/-1}.component .remove{grid-column:1/-1;grid-row:auto;justify-self:stretch}.component label:nth-of-type(2){grid-column:auto}.toolbar{align-items:flex-start}.results-head{align-items:flex-start;flex-direction:column}.summary{gap:9px}.metric{padding:15px}main{padding-top:12px}}
@media(max-width:370px){.wrapper{width:calc(100% - 22px)}.component-grid{grid-template-columns:1fr}.component .field-name{grid-column:auto}.panel{padding:14px}.component{padding:10px}.toolbar .actions{width:100%}.toolbar button{flex:1 1 auto}}
@media print{body{background:white!important;color:#000;font-size:12px}header,nav,.hero,.options,.toolbar,.row-head,#componentes,.form-end,.privacy,#errores,.referral,.long-copy,footer,.results-head .actions{display:none!important}.wrapper{width:100%;max-width:none}.panel{border:0;box-shadow:none;padding:0;margin:0}#resultados{display:block!important;border:0}.summary{grid-template-columns:repeat(3,1fr)}.metric,.metric.primary{color:#000;background:white;border:1px solid #aaa}.metric span,.metric.primary span{color:#333}table{min-width:0;font-size:9px}th,td{white-space:normal;padding:6px}.advice{background:white;border:1px solid #aaa}.tool>h2,.tool>.tool-intro{display:none!important}}
