/* TEMA CORPORATIVO (v3.1) · GOBS Informes · paleta de acentos del Manual de marca "Key Visual Maestro" (sept. 2026): azul #508DFB,
   azul claro #88B0FF, verde #6CD3A5, gris #EDEEEF. Por decisión de Andrés (06-oct) los fondos oscuros siguen en el azul marino de
   la v2.2 (#172A61 / #1B2F6B / #224693) en lugar del negro del manual, y la tipografía es Montserrat en todo (sin Georgia).
   Lenguaje gráfico: formas complementarias nacidas del símbolo (la "L" y el cuadrado de la G) superpuestas en transparencia,
   tanto sobre el fondo oscuro (héroe, barra, ingreso) como sobre el blanco (fondo de las páginas).
   Composición acordada con Andrés: barra superior negra, héroe oscuro con titular en dos pesos y subrayado corto, botones
   tipo píldora, tarjetas blancas que flotan sobre el borde del héroe, franja azul en el pie. */
:root{
--azul:#508DFB;--azul-osc:#2F6FE0;--azul-2:#88B0FF;--azul-claro:#E8F0FF;--celeste:#E8F0FF;--azul-3:#BFD4FF;
--verde:#6CD3A5;--verde-osc:#2E9D6E;--negro:#172A61;--grafito:#1B2F6B;--marino:#1B2F6B;--marino-2:#2B55B0;--marino-3:#3E6FD0;
--tinta:#111111;--tinta-2:#3A3F4B;--gris:#6B7280;--gris-suave:#9AA3B2;--gris-marca:#EDEEEF;
--linea:#E3E6EA;--linea-2:#EEF0F3;--fondo:#F7F8FA;--blanco:#fff;
--ok:#1E7F4F;--ok-bg:#E6F6EC;--mal:#B3261E;--mal-bg:#FDECEA;--amb:#8A6D00;--amb-bg:#FFF6D6;--alerta-bg:#EEF4FF;--alerta-bd:#C9DAFF;
--navy:#1B2F6B;--navy-2:#2B55B0;--navy-3:#3E6FD0;                  /* marino de la v2.2 (fondos oscuros y botones) */
--radio:14px;--radio-sm:10px;--lateral:0px;
--sombra:0 2px 4px rgba(27,47,107,.05),0 10px 28px rgba(27,47,107,.09);--sombra-2:0 18px 44px rgba(27,47,107,.18);
--vidrio:#fff;--vidrio-borde:var(--linea);--vidrio-sombra:var(--sombra);--vidrio-hover:var(--sombra-2);
--fuente-titulo:'Montserrat',-apple-system,'Segoe UI',sans-serif;
/* formas complementarias sobre oscuro (héroe e ingreso) */
--hero-fondo:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='700' viewBox='0 0 1600 700'><defs><linearGradient id='g' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%23172A61'/><stop offset='.55' stop-color='%231B2F6B'/><stop offset='1' stop-color='%23224693'/></linearGradient><radialGradient id='r' cx='.82' cy='.3' r='.5'><stop offset='0' stop-color='%23508DFB' stop-opacity='.28'/><stop offset='1' stop-color='%23508DFB' stop-opacity='0'/></radialGradient></defs><rect width='1600' height='700' fill='url(%23g)'/><rect width='1600' height='700' fill='url(%23r)'/><g fill='%23508DFB' fill-opacity='.38'><path d='M1120 60h330v300h-330zM1120 360h165v240h-165z'/></g><g fill='%2388B0FF' fill-opacity='.34'><rect x='1310' y='230' width='270' height='270'/></g><g fill='%236CD3A5' fill-opacity='.26'><path d='M1450 480h150v150h-150z'/></g><g fill='%23FFFFFF' fill-opacity='.07'><path d='M-40 430h380v170h-380zM-40 600h170v200h-170z'/><rect x='230' y='520' width='130' height='130'/></g><g fill='%23508DFB' fill-opacity='.18'><path d='M700 700l220-220 60 60-160 160z'/></g></svg>");
/* formas complementarias sobre blanco (fondo de las páginas) */
--fondo-formas:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' viewBox='0 0 1600 900'><g fill='%23EDEEEF' fill-opacity='.95'><path d='M1180-80h520v300h-520zM1180 220h230v420h-230z'/><path d='M-120 640h440v190h-440zM-120 830h190v200h-190z'/></g><g fill='%23E4E7EB' fill-opacity='.85'><rect x='1410' y='120' width='330' height='330'/><rect x='250' y='540' width='140' height='140'/></g><g fill='%23508DFB' fill-opacity='.08'><rect x='1540' y='400' width='120' height='120'/></g></svg>");
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:'Montserrat',-apple-system,'Segoe UI',sans-serif;font-weight:500;color:var(--tinta);font-size:14px;line-height:1.5;min-height:100vh;
background:var(--fondo-formas) center top/1600px 900px no-repeat fixed,var(--fondo)}
a{color:var(--azul-osc);text-decoration:none}a:hover{text-decoration:underline}
b,strong{font-weight:700}
@keyframes subir{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
main>*:not(.cabecera){animation:subir .35s ease both}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- iconos con volumen (dos tonos de azul de marca; ver _iconos.html) ---------- */
.ico{width:18px;height:18px;flex:none;vertical-align:-3px;overflow:visible}.ico.g{width:28px;height:28px}
.ico .s{fill:#1F55C4;opacity:.42}.ico .c{fill:url(#gIco)}.ico .b{fill:#fff}.ico .v{fill:var(--verde)}
.ico .l{fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:butt;stroke-linejoin:miter}
.boton:not(.sec):not(.peligro) .ico .c,.cta .ico .c{fill:#fff}.boton:not(.sec):not(.peligro) .ico .s,.cta .ico .s{fill:#000;opacity:.22}
.boton:not(.sec):not(.peligro) .ico .b,.cta .ico .b{fill:var(--navy-2)}.boton:not(.sec):not(.peligro) .ico .l,.cta .ico .l{stroke:var(--navy-2)}
.boton:not(.sec):not(.peligro) .ico .v,.cta .ico .v{fill:#fff}
.boton.ok .ico .b,.boton.ok .ico .v{fill:var(--ok)}.boton.ok .ico .l{stroke:var(--ok)}
.boton.peligro .ico .c{fill:var(--mal)}.boton.peligro .ico .s{fill:#000;opacity:.18}
.kpi.navy .ico .b,.kpi.navy .ico .v{fill:#fff}

/* ---------- cabecera: barra negra con la marca en negativo ---------- */
.cab-corp{background:#172A61;color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 6px 24px rgba(15,27,45,.25)}
.cab-linea{height:3px;background:linear-gradient(90deg,var(--azul) 0,var(--azul) 38%,var(--azul-2) 38%,var(--azul-2) 62%,var(--verde) 62%,var(--verde) 100%)}
.cab-inner{max-width:1280px;margin:0 auto;padding:0 32px;height:70px;display:flex;align-items:center;gap:22px;min-width:0}
.marca-corp{display:flex;align-items:center;gap:14px;text-decoration:none!important;flex:none;color:#fff}
.marca-corp img{height:34px;display:block}
.marca-corp .servicio{font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#B9CBF1;padding-left:14px;border-left:1px solid rgba(255,255,255,.22);line-height:1.3;max-width:150px}
.nav-corp{display:flex;align-items:center;gap:4px;height:70px;margin-left:auto;min-width:0;flex:0 1 auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.nav-corp::-webkit-scrollbar{display:none}.nav-corp::-webkit-scrollbar{display:none}
.nav-corp a{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:600;color:#D6E1F7;white-space:nowrap;transition:color .15s,background .15s}
.nav-corp a:hover{color:#fff;text-decoration:none;background:rgba(255,255,255,.08)}
.nav-corp a.act{color:#fff;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.nav-corp a .ico{width:17px;height:17px}
.nav-corp .cuenta-m,.nav-corp .cerrar-m{display:none}
/* Menú desplegable de equipos (municipios) en la barra */
.menu-desp{position:relative}.menu-desp>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:600;color:#D6E1F7;white-space:nowrap;transition:color .15s,background .15s}
.menu-desp>summary::-webkit-details-marker{display:none}.menu-desp>summary:hover,.menu-desp[open]>summary{color:#fff;background:rgba(255,255,255,.08)}
.menu-desp>summary.act{color:#fff;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.menu-desp>summary .ico{width:17px;height:17px}.menu-desp>summary .ico:last-child{width:12px;height:12px;transition:transform .2s}.menu-desp[open]>summary .ico:last-child{transform:rotate(180deg)}
.menu-desp .desp-lista{position:fixed;top:72px;left:0;min-width:260px;max-height:min(70vh,520px);overflow-y:auto;padding:8px;border-radius:16px;background:#172A61;box-shadow:0 18px 50px rgba(15,27,45,.45);border:1px solid rgba(255,255,255,.14);z-index:35;display:flex;flex-direction:column;gap:2px}
.menu-desp .desp-tit{display:block;padding:6px 12px 8px;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#88B0FF}
.menu-desp .desp-lista a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;font-size:13px;white-space:normal}
.menu-desp .desp-lista a small{font-size:10.5px;font-weight:600;color:#B9CBF1;opacity:.8}.menu-desp .desp-lista a.act{background:rgba(255,255,255,.14)}
.hamb-corp{display:none}.telon{display:none}

/* botón de cuenta: nombre + avatar; al pulsar despliega la ficha completa del usuario */
.cuenta-corp{display:flex;align-items:center;gap:10px;margin-left:6px;padding-left:16px;border-left:1px solid rgba(255,255,255,.16);position:relative;flex:none}
details.cuenta{position:relative}details.cuenta>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:5px 12px 5px 6px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;transition:background .15s}
details.cuenta>summary::-webkit-details-marker{display:none}details.cuenta>summary:hover,details.cuenta[open]>summary{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5)}
details.cuenta>summary .avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--azul),var(--azul-2));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:12.5px;letter-spacing:.04em;flex:none;box-shadow:0 4px 12px rgba(80,141,251,.4)}
details.cuenta>summary b{font-size:13px;white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}
details.cuenta>summary .ico{width:14px;height:14px;transition:transform .2s}details.cuenta[open]>summary .ico{transform:rotate(180deg)}
.ficha{position:absolute;right:0;top:calc(100% + 10px);width:360px;background:#fff;color:var(--tinta);border-radius:16px;box-shadow:0 30px 70px rgba(0,0,0,.35);border:1px solid var(--linea);overflow:hidden;z-index:50;animation:subir .2s ease both}
.ficha::before{content:"";position:absolute;right:28px;top:-7px;width:14px;height:14px;background:#fff;transform:rotate(45deg);border-left:1px solid var(--linea);border-top:1px solid var(--linea)}
.ficha .ficha-cab{display:flex;gap:14px;align-items:center;padding:18px 20px 14px;background:linear-gradient(135deg,#172A61,#2B55B0);color:#fff}
.ficha .ficha-cab .avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--azul),var(--azul-2));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;flex:none}
.ficha .ficha-cab b{display:block;font-size:15px;font-weight:800;line-height:1.2}.ficha .ficha-cab span{font-size:11.5px;color:#C9D8F5;display:block;margin-top:2px}
.ficha dl{margin:0;padding:12px 20px;display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:12.5px}
.ficha dt{color:var(--gris);font-weight:600;text-transform:uppercase;font-size:10px;letter-spacing:.08em;padding-top:2px}.ficha dd{margin:0;word-break:break-word}
.ficha .contratos{padding:4px 20px 12px;border-top:1px solid var(--linea-2)}.ficha .contratos b{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--gris);margin:8px 0 6px}
.ficha .contratos .etq{margin:0 4px 4px 0}
.ficha .ficha-pie{display:flex;gap:8px;padding:12px 20px 16px;border-top:1px solid var(--linea-2);background:#FAFBFC}.ficha .ficha-pie .boton{flex:1;justify-content:center}

/* ---------- héroe de página (la .cabecera de cada pantalla) ---------- */
.cabecera{position:relative;width:100vw;margin:-30px 0 0 calc(50% - 50vw);padding:52px max(32px,calc(50vw - 608px)) 120px;color:#fff;overflow:hidden;
background:linear-gradient(100deg,rgba(23,42,97,.72) 0%,rgba(27,47,107,.45) 55%,rgba(34,70,147,.25) 100%),var(--hero-foto,var(--hero-fondo)) center/cover no-repeat;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.cabecera::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(180deg,transparent,rgba(23,42,97,.35))}
.cabecera h1{color:#fff;font-family:var(--fuente-titulo);font-size:34px;line-height:1.08;letter-spacing:-.01em;font-weight:800;display:block;position:relative;padding-bottom:16px;margin-bottom:14px;max-width:780px}
.cabecera h1::after{content:"";position:absolute;left:0;bottom:0;width:72px;height:4px;background:var(--azul);border-radius:2px}
.cabecera h1 .ico.g{display:none}.cabecera h1 .etq{font-family:'Montserrat',sans-serif;vertical-align:middle;background:rgba(255,255,255,.14);color:#fff;margin-left:8px}
.cabecera .sub{color:#C9D8F5;font-size:14.5px;max-width:720px;margin:0;line-height:1.6}.cabecera .sub b{color:#fff}
.cabecera>div{position:relative}
.cabecera .acciones{margin:18px 0 0}
.cabecera .boton,.cabecera .acciones .boton{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.75);box-shadow:none}
.cabecera .boton:hover{background:#fff;color:var(--navy);transform:none}
.cabecera .boton .ico .c{fill:#fff}.cabecera .boton .ico .s{fill:#000;opacity:.3}.cabecera .boton .ico .b{fill:var(--azul)}.cabecera .boton:hover .ico .c{fill:var(--azul)}.cabecera .boton:hover .ico .b{fill:#fff}
.cabecera .volver{margin-bottom:20px;box-shadow:0 8px 20px rgba(10,20,60,.35)}.cabecera .volver:hover{background:#fff;color:var(--azul)!important}.cabecera .volver:hover .flecha{background:var(--azul);color:#fff}
/* botón "volver" dentro de un contenedor de color, visible sobre cualquier fondo */
.volver{display:inline-flex;align-items:center;gap:10px;background:var(--azul);color:#fff!important;border-radius:999px;padding:6px 18px 6px 6px;font-weight:700;font-size:13px;text-decoration:none!important;box-shadow:0 8px 20px rgba(80,141,251,.38);transition:transform .15s,box-shadow .15s,background .15s;position:relative;z-index:3}
.volver:hover{background:var(--azul-osc);transform:translateX(-2px);box-shadow:0 10px 24px rgba(47,111,224,.4)}
.volver .flecha{width:30px;height:30px;border-radius:50%;background:#fff;color:var(--azul);display:inline-flex;align-items:center;justify-content:center;flex:none}
.volver .flecha svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.volver small{font-weight:500;opacity:.85;margin-left:2px}
.miga{font-size:12.5px;color:var(--gris);margin:0 0 12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.miga+.cabecera{margin-top:-78px;padding-top:88px}
.miga+.cabecera+*{position:relative}
.miga a{color:var(--azul-osc)}
main>.volver:first-child{margin-bottom:14px}

/* ---------- disposición general ---------- */
main{max-width:1280px;margin:0 auto;padding:30px 32px 48px}
main>.cabecera+.kpis,main>.cabecera+.acciones+.kpis{margin-top:-72px;position:relative;z-index:2}
main>.cabecera+*:not(.kpis):not(.acciones){margin-top:28px}
footer{background:#fff;border-top:1px solid var(--linea);color:var(--gris-suave);font-size:11.5px;padding:0;display:flex;align-items:center;flex-wrap:wrap}
footer::before{content:"GOBS Estrategias Públicas · Medellín";display:flex;align-items:center;padding:16px 44px 16px max(32px,calc(50vw - 608px));background:linear-gradient(90deg,var(--azul),var(--azul-2));color:#fff;font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;clip-path:polygon(0 0,100% 0,calc(100% - 24px) 100%,0 100%)}
footer>span{display:block;padding:16px 24px}footer>span b{display:inline}
footer a{color:var(--azul-osc);font-weight:600}
h1{font-family:var(--fuente-titulo);font-size:25px;font-weight:800;margin:0 0 4px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;letter-spacing:-.01em;color:var(--tinta)}
h1 .ico.g{width:30px;height:30px}
h2{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);margin:34px 0 14px;display:flex;align-items:center;gap:10px}
h2::before{content:"";width:34px;height:3px;background:var(--azul);border-radius:2px;flex:none}h2::after{content:none}h2 .ico{display:none}
h3{font-weight:800}
.sub{color:var(--gris);margin:0 0 20px;font-size:13.5px;max-width:980px}

/* ---------- bloques ---------- */
.vidrio,.tarjeta,form.carga,.entrar,.tc,.panel,.panel-form,.grupo-ob{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra)}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px;margin-top:16px}
.tarjeta{padding:26px 28px;position:relative;transition:transform .2s,box-shadow .2s;overflow:hidden}
.tarjeta::after{content:"";position:absolute;right:-30px;bottom:-30px;width:110px;height:110px;background:var(--gris-marca);opacity:.55;transform:rotate(0);clip-path:polygon(0 0,100% 0,100% 100%,55% 100%,55% 45%,0 45%)}
.tarjeta:hover{transform:translateY(-3px);box-shadow:var(--sombra-2)}
.tarjeta .cab{display:flex;align-items:center;gap:14px}.tarjeta .cab .circ{width:56px;height:56px;border-radius:14px;background:var(--azul-claro);display:flex;align-items:center;justify-content:center}
.tarjeta .cab .circ .ico{width:32px;height:32px}
.tarjeta h3{margin:0;font-size:17px;font-weight:800}.tarjeta .meta{color:var(--gris);font-size:12.5px}.tarjeta .estado{margin-top:14px;font-size:13.5px;position:relative}
.aviso{border-radius:var(--radio-sm);padding:12px 16px;margin:14px 0;font-size:13.5px;display:flex;gap:10px;align-items:flex-start;background:var(--alerta-bg);border:1px solid var(--alerta-bd)}
.aviso.ok{background:var(--ok-bg);border-color:#BFE6CE}.aviso.amb{background:var(--amb-bg);border-color:#F1DE9A}
.error{background:var(--mal-bg);border:1px solid #F3C2BD;border-radius:var(--radio-sm);padding:14px 16px;margin:14px 0}.error ul{margin:8px 0 0 18px;padding:0}

/* ---------- botones tipo píldora ---------- */
.cta,.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--navy-2);color:#fff;border:1.5px solid var(--navy-2);padding:10px 22px;min-height:42px;border-radius:999px;font-weight:700;font-size:13px;cursor:pointer;font-family:inherit;text-decoration:none;box-shadow:0 6px 16px rgba(43,85,176,.22);transition:box-shadow .15s,transform .15s,background .15s,color .15s}
.cta{margin-top:16px}.cta:hover,.boton:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 10px 22px rgba(43,85,176,.3);background:var(--navy-3);border-color:var(--navy-3);filter:none}
.boton.sec{background:#fff;color:var(--navy-2);border-color:var(--navy-2);box-shadow:none}.boton.sec:hover{background:var(--azul-claro);color:var(--navy)}
.boton.negro{background:var(--navy);border-color:var(--navy);box-shadow:0 6px 16px rgba(27,47,107,.25)}.boton.negro:hover{background:#172A61;border-color:#172A61}
.boton.ok{background:var(--verde-osc);border-color:var(--verde-osc);box-shadow:0 6px 16px rgba(46,157,110,.25)}.boton.ok:hover{background:#25855C;border-color:#25855C}
.boton.peligro{background:#fff;color:var(--mal);border-color:#E9A8A2;box-shadow:none}.boton.peligro:hover{background:var(--mal-bg)}
.boton.peq{padding:6px 14px;min-height:32px;font-size:12px;box-shadow:none}
.boton[disabled],.boton[disabled]:hover{opacity:.55;cursor:not-allowed;transform:none}
.acciones{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.etq{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:var(--azul-claro);color:var(--navy)}
.etq.ok{background:var(--ok-bg);color:var(--ok)}.etq.mal{background:var(--mal-bg);color:var(--mal)}.etq.amb{background:var(--amb-bg);color:var(--amb)}.etq.gris{background:#EEF1F6;color:var(--gris)}.etq.negro{background:var(--navy);color:#fff}

/* ---------- formularios ---------- */
form.carga{padding:24px 28px;display:grid;grid-template-columns:1fr 1fr;gap:16px 24px}
form.carga label{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-2);margin-bottom:6px}
form.carga input[type=text],form.carga input[type=file],form.carga select,form.carga textarea,form.carga input[type=password],form.carga input[type=date],form.carga input[type=number]{width:100%;padding:10px 14px;min-height:42px;border:1px solid #CBD2DD;border-radius:var(--radio-sm);font-size:14px;font-family:inherit;background:#fff;transition:border-color .15s,box-shadow .15s}
form.carga input:focus,form.carga select:focus,form.carga textarea:focus{outline:0;border-color:var(--azul);box-shadow:0 0 0 3px rgba(80,141,251,.2)}
form.carga .ancho{grid-column:1/-1}.paso{display:flex;gap:10px;align-items:center;font-weight:800;font-size:12px;color:var(--tinta);grid-column:1/-1;margin-top:8px;text-transform:uppercase;letter-spacing:.06em}
.paso .n{width:26px;height:26px;border-radius:50%;background:var(--azul);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px}
.campo label{font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.campo input[type=text],.campo input[type=file],.campo select,.campo textarea,.campo input[type=date],.campo input[type=number],.campo input[type=email]{border-radius:var(--radio-sm);border-color:#CBD2DD;background:#fff;min-height:42px}
.campo input:focus,.campo select:focus,.campo textarea:focus{box-shadow:0 0 0 3px rgba(80,141,251,.2)}
.ayuda code{border-radius:6px}
.casillas{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px}
form.carga .casillas label,.casillas label{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--linea);border-radius:10px;background:#FAFBFC;font-size:13px;text-transform:none;letter-spacing:0;font-weight:600;cursor:pointer;margin:0}
.casillas label:hover{border-color:var(--azul-2)}.casillas input{accent-color:var(--azul);width:16px;height:16px}

/* ---------- tablas ---------- */
table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;font-size:13.5px;box-shadow:var(--sombra)}
tr:has(>th){background:#EEF4FD}th{text-align:left;background:transparent;color:var(--navy);font-weight:800;padding:12px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--linea)}
td{padding:12px 16px;border-bottom:1px solid var(--linea-2);vertical-align:middle}tr:last-child td{border-bottom:0}
tr:hover td{background:#F4F8FF}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.tabla-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radio)}
tr.fila-aprobada td{background:#F3FBF6;color:var(--gris)}tr.fila-aprobada td b{color:var(--tinta-2)}

/* ---------- cifras: tarjetas blancas con icono azul (flotan sobre el héroe) ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:18px 0}
.kpi{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);box-shadow:var(--sombra-2);padding:18px 20px;min-height:112px;display:flex;flex-direction:column;justify-content:space-between;min-width:0;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;right:-22px;bottom:-22px;width:64px;height:64px;background:var(--gris-marca);opacity:.4;clip-path:polygon(0 0,100% 0,100% 100%,50% 100%,50% 50%,0 50%)}
.kpi:hover{transform:translateY(-3px)}
.kpi.navy{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 70%,var(--navy-3) 100%);color:#fff;border-color:var(--navy)}
.kpi.navy::after{background:var(--azul);opacity:.5}
.kpi.navy .l{color:#C9D8F5}.kpi.navy .l .ico{background:rgba(255,255,255,.16)}.kpi.navy .nota{color:#C9D8F5}
.kpi .l{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--gris);font-weight:700;display:flex;align-items:flex-start;gap:10px;line-height:1.3}.kpi .l span{padding-top:7px}
.kpi .l .ico{width:36px;height:36px;padding:7px;border-radius:10px;background:var(--azul-claro);flex:none}
.kpi .v{font-size:clamp(17px,1.6vw,24px);font-weight:800;margin-top:12px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;max-width:100%;position:relative}.kpi .v.larga{font-size:clamp(14px,1.2vw,17px)}
.kpi .nota{font-size:11.5px;color:var(--gris);margin-top:4px;line-height:1.35;position:relative}

/* ---------- ingreso: héroe completo con titular y tarjeta de acceso ---------- */
.fondo-plano{display:none}
body.sin-lateral main{max-width:none;padding:0}
.ingreso{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:40px;min-height:calc(100vh - 73px - 56px);padding:56px max(32px,calc(50vw - 608px)) 72px;color:#fff;position:relative;overflow:hidden;
background:linear-gradient(100deg,rgba(23,42,97,.7) 0%,rgba(27,47,107,.45) 55%,rgba(34,70,147,.2) 100%),var(--hero-foto,var(--hero-fondo)) center/cover no-repeat}
.panel-marca{position:relative;padding:0}
.panel-marca img{display:none}
.panel-marca h2{color:#fff;font-family:var(--fuente-titulo);font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:-.01em;text-transform:none;margin:0 0 22px;font-weight:300;display:block;position:relative;padding-bottom:22px}
.panel-marca h2::before{content:none}
.panel-marca h2::after{content:"";position:absolute;left:0;bottom:0;width:84px;height:4px;background:#fff;border-radius:2px}
.panel-marca h2 strong{display:block;font-weight:800;letter-spacing:.02em;text-transform:uppercase}
.panel-marca p{color:#D6E1F7;font-size:15px;margin:0 0 22px;max-width:460px;line-height:1.65}
.panel-marca ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.panel-marca li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:#E6EEFC}.panel-marca li .ico{margin-top:1px}
.panel-marca .pie-marca{margin-top:30px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#9FB6E6}
.entrar{max-width:460px;margin:0 0 0 auto;padding:36px 40px 30px;text-align:left;border:0;border-radius:18px;box-shadow:0 30px 80px rgba(10,20,50,.45);color:var(--tinta);position:relative;overflow:hidden}
.entrar::after{content:"";position:absolute;right:-40px;bottom:-40px;width:170px;height:170px;background:url('/static/gobs_g.png') center/contain no-repeat;opacity:.06;pointer-events:none}
.entrar .logos{display:flex;margin-bottom:4px}.entrar .l-gobs{height:42px}
.entrar h1{font-size:22px;color:var(--tinta)}.entrar .sub{color:var(--gris)}
.entrar label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-2)}
.entrar input{width:100%;padding:13px 16px;margin:6px 0 16px;border:1px solid #CBD2DD;border-radius:999px;font-size:16px;font-family:inherit;background:#fff}
.entrar input:focus{outline:0;border-color:var(--azul);box-shadow:0 0 0 3px rgba(80,141,251,.2)}
.entrar .nota-entrar{color:var(--gris)}
.pestanas{display:flex;gap:6px;background:var(--gris-marca);padding:4px;border-radius:999px;margin:14px 0 18px}
.pestanas a{flex:1 1 0;min-width:0;text-align:center;padding:9px 6px;border-radius:999px;font-size:12px;font-weight:700;color:var(--gris);display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap}.pestanas a svg{flex:none;width:14px;height:14px}
@media (max-width:420px){.pestanas a{font-size:11px;gap:3px}.pestanas a svg{display:none}}
.pestanas a:hover{text-decoration:none;color:var(--tinta)}.pestanas a.act{background:#fff;color:var(--tinta);box-shadow:0 2px 6px rgba(0,0,0,.08)}
body.sin-lateral footer{margin:0}

/* ---------- modal ---------- */
.modal{border:0;border-radius:18px;padding:0;width:min(900px,94vw);max-height:88vh;background:#fff;box-shadow:0 30px 80px rgba(15,27,45,.4)}
.modal::backdrop{background:rgba(15,27,45,.6);backdrop-filter:blur(2px)}
.modal-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 24px;border-bottom:1px solid var(--linea);position:sticky;top:0;background:#fff}.modal-cab b{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:var(--navy)}
.modal-cuerpo{padding:10px 26px 26px;overflow:auto;max-height:calc(88vh - 72px);font-size:14px;color:var(--tinta-2)}
.modal-cuerpo h3,.tc h3{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--navy);margin:20px 0 6px;padding-left:10px;border-left:3px solid var(--azul)}
.modal-cuerpo p,.tc p{margin:0 0 10px;text-align:justify;line-height:1.6}.tc-pie{color:var(--gris);font-size:12px;margin-top:18px}.tc{padding:10px 30px 30px}

/* ---------- varios ---------- */
.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px;align-items:start}
.tres-col{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px;align-items:start}
.panel{padding:20px 22px}.panel h3{margin:0 0 6px;font-size:12px;font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:.08em;display:flex;align-items:center;gap:7px}.panel h3 .ico{width:16px;height:16px}
.sub-celda{font-size:11.5px;color:var(--gris)}.rojo{color:var(--mal)}
.filtros{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:4px 0 6px}
.matriz td:first-child{font-weight:700;width:30%}.matriz td{vertical-align:top;font-size:13px}.matriz tr.mio td{background:var(--azul-claro)}
.matriz th.mio{color:var(--azul-osc)}

/* ---------- móvil ---------- */
@media (max-width:980px){
.cab-inner{padding:0 16px;height:60px;gap:12px}.marca-corp img{height:28px}.marca-corp .servicio{display:none}
.hamb-corp{display:inline-flex;margin-left:auto;width:44px;height:44px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:rgba(255,255,255,.1);color:#fff;align-items:center;justify-content:center;cursor:pointer}
.cuenta-corp{display:none}
.nav-corp{position:fixed;top:0;right:0;bottom:0;width:min(320px,88vw);height:auto;margin:0;background:#172A61;flex-direction:column;align-items:stretch;gap:4px;padding:70px 14px 20px;transform:translateX(105%);transition:transform .25s ease;z-index:30;overflow-y:auto;box-shadow:-10px 0 40px rgba(15,27,45,.35)}
body.menu-abierto .nav-corp{transform:none}body.menu-abierto .telon{display:block;position:fixed;inset:0;z-index:25;background:rgba(15,27,45,.5)}body.menu-abierto{overflow:hidden}body.menu-abierto .cab-corp{z-index:40}
.nav-corp a{padding:13px 18px;font-size:14.5px}
.menu-desp>summary{padding:13px 18px;font-size:14.5px}.menu-desp .desp-lista{position:static;min-width:0;max-height:none;padding:0 0 6px 14px;background:transparent;box-shadow:none;border:0}.menu-desp .desp-lista a{padding:10px 14px}
.nav-corp .cerrar-m{display:inline-flex;position:absolute;top:10px;right:12px;width:42px;height:42px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:rgba(255,255,255,.1);color:#fff;align-items:center;justify-content:center;cursor:pointer}
.nav-corp .cuenta-m{display:block;margin-top:auto;padding:16px 18px 0;border-top:1px solid rgba(255,255,255,.18);font-size:12.5px;color:#B9CBF1}.nav-corp .cuenta-m b{display:block;color:#fff;font-size:14px}.nav-corp .cuenta-m span{display:block;margin-bottom:4px}
.nav-corp .cuenta-m .etq{margin:6px 4px 10px 0}
.nav-corp .cuenta-m a.boton{display:inline-flex;padding:8px 16px;border:1.5px solid rgba(255,255,255,.75);border-radius:999px;font-size:12px;width:auto;margin:6px 6px 6px 0;color:#fff;background:transparent}
main{padding:18px 16px 24px}
.cabecera{margin:-18px 0 0 calc(50% - 50vw);padding:30px 16px 92px;flex-direction:column;align-items:flex-start;gap:10px}.cabecera h1{font-size:26px}.cabecera .sub{font-size:13px}
.miga+.cabecera{margin-top:-64px;padding-top:70px}
main>.cabecera+.kpis,main>.cabecera+.acciones+.kpis{margin-top:-60px}
footer{flex-direction:column;align-items:stretch}footer::before{clip-path:none;justify-content:center;padding:12px 16px}footer>span{padding:12px 16px;font-size:11px;text-align:center}
h1{font-size:21px}h2{margin-top:24px}.sub{font-size:13px}
form.carga{grid-template-columns:1fr;padding:18px;gap:12px 0}
.kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi{min-height:88px;padding:12px 14px}.kpi .v{font-size:17px}.kpi .v.larga{font-size:14px}
.acciones{flex-direction:column}.acciones .boton,.acciones form,.acciones a.boton{width:100%}.acciones form .boton{width:100%}
.tarjetas{grid-template-columns:1fr;gap:12px}.tarjeta{padding:18px}.cta{width:100%}
table{font-size:12.5px}table:has(th:nth-child(5)){min-width:640px}th,td{padding:9px 10px}
.ingreso{grid-template-columns:1fr;gap:26px;padding:34px 16px 40px;min-height:0}.panel-marca h2{font-size:32px;padding-bottom:16px}.panel-marca ul{display:none}.entrar{margin:0;max-width:none;padding:26px 22px}
.modal{width:96vw;max-height:92vh;border-radius:12px}.modal-cab{padding:12px 16px}.modal-cuerpo{padding:8px 16px 20px}
.dos-col,.tres-col{grid-template-columns:1fr}
.volver{font-size:12px}
}
@media (max-width:420px){.kpis{grid-template-columns:1fr}}
@media (max-width:1500px) and (min-width:981px){details.cuenta>summary b{max-width:150px}.nav-corp a,.menu-desp>summary{padding:8px 11px;font-size:12.5px}.nav-corp a .ico,.menu-desp>summary .ico:first-child{display:none}.marca-corp .servicio{max-width:120px;font-size:10px}}
@media (max-width:1380px) and (min-width:981px){details.cuenta>summary b{display:none}details.cuenta>summary{padding-right:8px}.nav-corp a,.menu-desp>summary{padding:8px 9px;font-size:12px}}
