
:root{box-sizing:border-box;--bg:#f5f6f8;--card:#fff;--ink:#1a2230;--mut:#5b6470;--line:#e1e4e9;--navy:#1f2937;--navy2:#475569;--acc:#f0a91b;--soft:#eceef2;--warn:#fff7e0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0a1422;--card:#111f33;--ink:#e6edf5;--mut:#96a7bb;--line:#22344d;--soft:#16273f;--warn:#2b2513}}
:root[data-theme="dark"]{--bg:#0a1422;--card:#111f33;--ink:#e6edf5;--mut:#96a7bb;--line:#22344d;--soft:#16273f;--warn:#2b2513}
*{box-sizing:border-box}html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 Manrope,system-ui,sans-serif;padding-bottom:env(safe-area-inset-bottom,0px)}
h1,h2,h3,.big,.logo b{font-family:Newsreader,Georgia,serif;letter-spacing:-.01em}
a{color:inherit}.in{max-width:1000px;margin:0 auto;padding:0 20px}
.top{position:sticky;top:0;z-index:5;background:var(--card);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.top .in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:1.25rem}
nav{display:flex;gap:4px;flex-wrap:wrap}nav a{padding:8px 12px;border-radius:8px;text-decoration:none;font-size:.92rem;color:var(--mut)}nav a:hover{background:var(--soft);color:var(--ink)}
.hero,.band{background:var(--navy);color:#fff}
.hero{padding:56px 0 64px}.hero .in{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2.2rem,5vw,3.4rem);line-height:1.08;margin:0 0 14px}.hero p{color:#e3edfc;max-width:46ch;margin:0}
.band{padding:34px 0 64px}.band h1{margin:0 0 6px;font-size:clamp(1.8rem,4vw,2.5rem);line-height:1.15}.band p{margin:0;color:#e3edfc}
.qc{background:var(--card);color:var(--ink);border-radius:16px;padding:22px;box-shadow:0 20px 50px rgba(0,0,0,.28)}
.qc .big{font-size:2.6rem;color:var(--navy);line-height:1.1;margin:2px 0 6px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .qc .big,:root:not([data-theme="light"]) .big{color:var(--acc)}}
.qc a{color:var(--navy2);font-size:.9rem;font-weight:600}
main.in{margin-top:-40px;position:relative}main.home{margin-top:0;padding-top:8px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:0 8px 24px rgba(11,37,69,.08)}
.card h2{margin:0 0 4px;font-size:1.3rem}.sub{color:var(--mut);font-size:.92rem;margin:0}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0}
label{display:block;font-size:.82rem;font-weight:600;color:var(--mut);margin-bottom:5px}
input,select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink);font:inherit}
input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.go{width:100%;padding:13px;border:0;border-radius:10px;background:var(--acc);color:#0b2545;font:700 1rem Manrope,system-ui,sans-serif;cursor:pointer}.go:hover{filter:brightness(1.05)}
.res{margin-top:16px;background:var(--soft);border-left:4px solid var(--acc);border-radius:10px;padding:16px;display:none}.res.on{display:block}
.big{font-size:2.1rem;font-weight:600;color:var(--navy);line-height:1.15}
table{width:100%;border-collapse:collapse;margin-top:10px;font-size:.93rem}td{padding:7px 0;border-bottom:1px solid var(--line)}td:last-child{text-align:right;white-space:nowrap;font-weight:600}
.note{background:var(--warn);border-radius:10px;padding:11px 13px;font-size:.8rem;color:var(--mut);margin-top:14px}
.ad{margin:22px 0;padding:24px;border:1px dashed var(--line);border-radius:10px;text-align:center;color:var(--mut);font-size:.78rem}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--card);border:1px solid var(--line);border-radius:14px;margin:0 0 34px;overflow:hidden}
.facts div{padding:18px;border-right:1px solid var(--line)}.facts div:last-child{border:0}
.facts b{display:block;font:600 1.6rem Newsreader,Georgia,serif;color:var(--navy2)}.facts span{font-size:.82rem;color:var(--mut)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .facts b{color:var(--acc)}}
h2.sec{font-size:1.5rem;margin:8px 0 14px}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:38px}
.tools a{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--navy2);border-radius:12px;padding:20px}
.tools a:hover{border-top-color:var(--acc)}.tools b{display:block;font:600 1.2rem Newsreader,Georgia,serif;margin-bottom:6px}.tools span{color:var(--mut);font-size:.9rem}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:40px}.why h3{margin:0 0 4px;font-size:1.1rem}.why p{margin:0;color:var(--mut);font-size:.92rem}
article{margin-top:26px;max-width:70ch}article h2{font-size:1.4rem;margin:26px 0 6px}article h3{font-size:1.1rem;margin:16px 0 4px}article ul{padding-left:20px}
.pane{display:none}.pane.on{display:block}
footer{background:var(--navy);color:#e3edfc;margin-top:56px;padding:38px 0 30px;font-size:.88rem}
footer .in{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px}footer b{color:#fff;display:block;margin-bottom:8px}footer a{display:block;text-decoration:none;padding:2px 0}footer a:hover{color:#fff}
footer .fine{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.28);padding-top:16px;font-size:.78rem}
@media(max-width:760px){.hero .in,.tools,.why,footer .in{grid-template-columns:1fr}.facts{grid-template-columns:1fr 1fr}.facts div:nth-child(2){border-right:0}.facts div:nth-child(-n+2){border-bottom:1px solid var(--line)}.grid{grid-template-columns:1fr}.hero{padding:36px 0 44px}}
.hero,.band{background:var(--soft);color:var(--ink)}
.hero p,.band p{color:var(--mut)}
.qc,.card{box-shadow:0 10px 30px rgba(20,30,50,.12)}
.big{color:var(--ink)}
footer{background:var(--card);color:var(--mut);border-top:1px solid var(--line)}
footer b{color:var(--ink)}footer a:hover{color:var(--ink)}footer .fine{border-top-color:var(--line)}

.hero{padding:40px 0 44px}.hero .in{display:block}.hero h1{font-size:clamp(1.9rem,4.5vw,2.8rem)}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.tabs button{padding:10px 18px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;font:600 .92rem Manrope,system-ui,sans-serif;cursor:pointer}
.tabs button.on{background:var(--ink);color:var(--card);border-color:var(--ink)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start;margin-bottom:34px}
.ad.lb{min-height:90px;display:flex;align-items:center;justify-content:center}
.ad.rect{min-height:250px;margin-top:0;display:flex;align-items:center;justify-content:center}
.ad.sky{min-height:600px;position:sticky;top:76px;display:flex;align-items:center;justify-content:center}
@media(max-width:860px){.layout{grid-template-columns:1fr}.ad.sky{display:none}}
/* Lo principal: calculadoras */
.hero{padding:30px 0 58px}.hero h1{font-size:clamp(1.6rem,3.6vw,2.2rem)}.hero p{font-size:.95rem}
main.home{margin-top:-34px}
.card:has(.go){border:1px solid var(--line);border-top:6px solid var(--acc);padding:28px;box-shadow:0 28px 70px rgba(20,30,50,.24)}
.card:has(.go) h2{font-size:1.7rem}
.card:has(.go) input,.card:has(.go) select{padding:14px;font-size:1.05rem;border-width:2px}
.card:has(.go) .go{padding:17px;font-size:1.12rem;box-shadow:0 8px 20px rgba(240,169,27,.4)}
.card:has(.go) .res{background:var(--warn);border-left-width:6px;padding:20px}
.card:has(.go) .big{font-size:2.8rem}
.tabs button{padding:13px 22px;font-size:1rem}
.tabs button.on{background:var(--acc);color:#1a2230;border-color:var(--acc);box-shadow:0 6px 16px rgba(240,169,27,.35)}
/* Lo secundario, más discreto */
.ad{background:transparent;border-color:var(--line);color:#a3abb5;opacity:.8}
.facts{box-shadow:none;background:transparent}.facts b{font-size:1.25rem;color:var(--mut)}
h2.sec{font-size:1.1rem;color:var(--mut);font-weight:500}
.tools a{border-top-width:1px;padding:16px;background:transparent}.tools b{font-size:1.02rem}.tools span{font-size:.85rem}
.why h3{font-size:.98rem}.why p{font-size:.85rem}

.tag{display:flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600;color:var(--mut);border:1px solid var(--line);border-radius:999px;padding:6px 12px;white-space:nowrap}
.tag::before{content:"";width:8px;height:8px;border-radius:50%;background:#1b9d6b}

.ph{background:#fff1b8;color:#5a4300;padding:0 4px;border-radius:4px}
.tw{overflow-x:auto}.plain{max-width:none;margin:0}.card article.plain{margin:0}
th{text-align:left;font-size:.78rem;color:var(--mut);padding:8px 6px;border-bottom:2px solid var(--line)}
th:not(:first-child),.tw td:not(:first-child){text-align:right;white-space:nowrap}.tw td{padding:8px 6px}
.pn{display:flex;justify-content:space-between;margin-top:18px}.pn a{color:var(--navy2);font-weight:600;text-decoration:none}
article td{font-weight:400}

.ex{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px;margin:0 0 34px;box-shadow:0 10px 30px rgba(20,30,50,.10)}
.ex h2{margin:0 0 4px;font-size:1.5rem}.ex .sub{margin:0 0 16px}
.exg{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.exg a{display:block;text-decoration:none;text-align:center;border:1px solid var(--line);border-radius:10px;padding:14px 8px;background:var(--bg)}
.exg a:hover{border-color:var(--acc);box-shadow:inset 0 0 0 1px var(--acc)}
.exg b{display:block;font:600 1.3rem Newsreader,Georgia,serif}.exg span{font-size:.8rem;color:var(--mut)}
.ex .more{display:inline-block;margin-top:16px;font-weight:700;color:var(--ink)}
@media(max-width:760px){.exg{grid-template-columns:repeat(2,1fr)}}

.layout{grid-template-columns:1fr}
.src{font-size:.78rem;color:var(--mut);margin:10px 0 0}.src a{color:inherit;text-decoration:underline}
/* ===== Adaptación a móvil ===== */
h1,h2,h3{line-height:1.2}.grid>div{min-width:0}input,select{max-width:100%}
@media(max-width:640px){
.in{padding:0 16px}
.top{position:static}.top .in{min-height:0;padding-top:10px;padding-bottom:0;gap:0}
.tag{display:none}
nav{order:3;width:100%;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;scrollbar-width:none;margin:6px -16px 0;padding:0 12px 8px}
nav::-webkit-scrollbar{display:none}nav a{padding:8px 10px;flex:0 0 auto}
.hero{padding:18px 0 46px}.band{padding:18px 0 46px}
.hero .in::before,.band .in::before{content:"Datos 2026 · actualizado en enero";display:inline-block;font-size:.72rem;font-weight:700;color:var(--mut);border:1px solid var(--line);background:var(--card);border-radius:999px;padding:3px 10px;margin-bottom:10px}
.hero h1{font-size:1.65rem}.band h1{font-size:1.5rem}.hero p,.band p{font-size:.92rem}
main.in{margin-top:-30px}main.home{margin-top:-30px}
.tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tabs button{padding:11px 8px;font-size:.86rem;border-radius:12px;line-height:1.2}
.tabs button:last-child:nth-child(odd){grid-column:1/-1}
.card,.card:has(.go){padding:18px}.card:has(.go){border-top-width:5px}
.card h2,.card:has(.go) h2{font-size:1.3rem}
.big,.card:has(.go) .big{font-size:2.2rem}
.grid{gap:12px;margin:14px 0}
.card:has(.go) input,.card:has(.go) select{padding:12px}
.card:has(.go) .go{padding:15px}
.ex{padding:18px}.ex h2{font-size:1.25rem}
.facts b{font-size:1.05rem}.facts div{padding:14px}
.why{gap:16px}footer .in{gap:18px}
.tw{margin:0 -4px}.tw td:first-child,.tw th:first-child{position:sticky;left:0;background:var(--card)}
td{padding-right:6px}
}

@media(max-width:640px){
.sal{font-size:.8rem}.sal th{font-size:.72rem;line-height:1.2;padding-right:4px}.sal td{padding:8px 4px 8px 0}
.sal th:nth-child(2),.sal td:nth-child(2),.sal th:nth-child(3),.sal td:nth-child(3){display:none}
}
@media(max-width:640px){
.tw:has(.sal){margin:0}
.sal{table-layout:fixed;width:100%}
.sal th:nth-child(1){width:35%}.sal th:nth-child(4),.sal th:nth-child(5),.sal th:nth-child(6){width:21.6%}
.sal th{white-space:normal;vertical-align:bottom}
.sal td{white-space:nowrap;font-size:.78rem}.sal td:first-child{white-space:normal;font-size:.82rem}
.sal td:last-child,.sal td:nth-child(4),.sal td:nth-child(5){text-align:right}.sal th:nth-child(n+4){text-align:right}
}
@media(max-width:640px){
.sal th:nth-child(1){width:30%}.sal th:nth-child(4),.sal th:nth-child(5),.sal th:nth-child(6){width:23.3%}
.sal td{font-size:.74rem;padding:8px 0 8px 2px}.sal td:last-child{font-weight:400}.sal th{padding:8px 0 8px 2px}
.sal td:first-child,.sal th:first-child{padding-left:0}
}

:root[data-theme="dark"]{color-scheme:dark}

input::placeholder{color:var(--mut);opacity:.75}
