:root{--n:#123B5D;--n2:#164A70;--b:#1F75A8;--b2:#2F80B7;--r:#C62828;--t:#1E1E1E;--g:#787878}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{font:11pt/1.15 Calibri,Carlito,Arial,sans-serif;color:var(--t);background:#fff;display:flex;flex-direction:column}
h1,h2,h3,.brand{font-family:Georgia,'Times New Roman',serif}
header{border-bottom:2px solid var(--b);padding:8px 20px 0}
.top{display:flex;justify-content:space-between;font-size:8pt;text-transform:uppercase;color:var(--n)}.top span:last-child{color:var(--g)}
.brand{font-size:16pt;font-weight:700;color:var(--n);margin:4px 0}
nav{display:flex;gap:2px;flex-wrap:wrap}
nav button{border:0;background:none;padding:9px 14px;font:700 10pt Calibri,Carlito,Arial,sans-serif;color:var(--n2);cursor:pointer;border-bottom:3px solid transparent}
nav button.on{background:var(--n);color:#fff;border-bottom-color:var(--r)}
main{flex:1;min-height:0;overflow:auto;position:relative}
section{display:none;padding:24px max(20px,8vw);max-width:1200px;margin:auto;line-height:1.5}
section.on{display:block}section#visor.on{display:flex;max-width:none;padding:0;position:absolute;inset:0}
h1{font-size:22pt;color:var(--n);text-align:center;margin:20px 0 6px}
.sub{font:italic 13pt Georgia,serif;color:var(--b);text-align:center;margin:0 0 18px}
h2{font-size:14pt;text-transform:uppercase;color:var(--n);border-bottom:2px solid var(--b);padding-bottom:3px;margin:30px 0 10px}
h3{font-size:12pt;color:var(--n2);margin:18px 0 6px}h3.sec{font-size:9pt;color:var(--g);text-transform:uppercase;margin-bottom:0}
p{margin:0 0 10px}.note{font:italic 9pt Calibri,Carlito,sans-serif;color:var(--g)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:18px 0}
.kpi{padding:14px 18px;color:#fff;background:var(--n)}.kpi:nth-child(even){background:var(--b)}
.kpi small{display:block;font-size:8pt;font-weight:700;text-transform:uppercase}
.kpi b{font:700 20pt Georgia,serif}.kpi i{display:block;font-size:8pt;color:#dbe9f4}
.call{border:2px solid var(--b);background:#eef5fb;padding:14px 18px;margin:14px 0}
.call b.l{display:block;color:var(--n);margin-bottom:4px}
.btn{display:inline-block;background:var(--n);color:#fff;padding:8px 16px;text-decoration:none;font-weight:700;border:0;cursor:pointer;font-size:10pt}.btn:hover{background:var(--b)}
table{border-collapse:collapse;width:100%;font-size:10pt;margin:6px 0 14px}
th{background:var(--n);color:#fff;text-align:left;padding:6px 10px}td{padding:5px 10px;border:1px solid #c9dcec}tr:nth-child(even) td{background:#eef5fb}
td.r,th.r{text-align:right}td a{color:var(--b);font-weight:700;text-decoration:none;margin-right:10px}
.cap{font:700 10pt Calibri,Carlito,sans-serif;color:#48495C;margin-top:14px}
#mapa{flex:1 1 42%;min-width:300px;background:#e9f0f6}
#der{flex:1 1 58%;display:flex;flex-direction:column;border-left:2px solid var(--b);min-width:0}
#opc{display:flex;background:var(--n)}#opc button{flex:1;padding:10px 4px;border:0;border-right:1px solid var(--n2);background:var(--n);color:#fff;font:700 9.5pt Calibri,Carlito,sans-serif;cursor:pointer}
#opc button.on{background:var(--b);box-shadow:inset 0 -3px var(--r)}
#lienzo{flex:1;border:0;width:100%;background:#fff}
.leaflet-container{font-family:Calibri,Carlito,Arial,sans-serif}.leaflet-popup-content h4{margin:0 0 4px;font:700 11pt Georgia,serif;color:var(--n)}
.leaflet-popup-content table{font-size:9pt;margin:0}.leaflet-popup-content td{padding:2px 6px}
.leaflet-control-layers{max-height:60vh;overflow:auto;font-size:9pt;padding:6px 10px;background:#fff}
#modal{display:none;position:fixed;inset:0;background:rgba(18,59,93,.85);z-index:9999;flex-direction:column}#modal.on{display:flex}
#modal .bar{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;color:#fff;font-weight:700}
#modal iframe{flex:1;border:0;background:#fff}#modal a{color:#fff;margin-right:14px}#modal button{background:var(--r);color:#fff;border:0;padding:6px 14px;font-weight:700;cursor:pointer}
footer{border-top:2px solid var(--b);padding:5px 20px;font-size:8pt;color:var(--g);display:flex;justify-content:space-between;gap:16px}
@media(max-width:800px){section#visor.on{flex-direction:column;overflow:auto}#mapa{min-height:50vh}#der{min-height:90vh}}