/* ----------------------------------------------------------------------------
   Directorio de Consejeros · CGAE — estilos del portal público.
   Identidad según "Guía de marcas, colores y tipografías" (24-02-2025):
   - Color principal Pantone 648C = #00305E (RGB 0/48/94).
   - Digital: Open Sans Condensed (titulares) + Ubuntu (texto).
   El oro #C9A23B es el acento del prototipo aprobado por el cliente.
---------------------------------------------------------------------------- */
:root{
  --navy:#00305E;--navy-deep:#001A33;--navy-2:#0D4076;
  --gold:#C9A23B;--gold-2:#E3B752;--cream:#FBF5E7;
  --ink:#1B2233;--muted:#717C8E;--line:#E8ECF2;--bg:#F6F8FB;--soft:#F1F4F8;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Ubuntu',-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
/* Titulares corporativos: Open Sans Condensed (guía digital CGAE) */
.serif{font-family:'Open Sans',Arial,sans-serif;font-stretch:75%;}
::selection{background:var(--gold);color:#fff;}

header.top{position:sticky;top:0;z-index:50;background:rgba(0,26,51,.97);backdrop-filter:blur(8px);color:#fff;display:flex;align-items:center;gap:20px;padding:0 26px;height:64px;border-bottom:1px solid rgba(201,162,59,.35);}
.brand{display:flex;align-items:center;gap:14px;cursor:pointer;}
.brand img{height:38px;width:auto;display:block;}
.brand .sep{width:1px;height:30px;background:rgba(255,255,255,.25);}
.brand span{font-size:9.5px;letter-spacing:2.5px;color:#9DB0D6;text-transform:uppercase;line-height:1.4;max-width:110px;}
nav.tabs{display:flex;gap:2px;}
nav.tabs a{font-size:13px;color:#C7D2E8;padding:8px 13px;border-radius:8px;cursor:pointer;transition:.15s;}
nav.tabs a:hover{background:rgba(255,255,255,.08);color:#fff;}
.search{margin-left:auto;position:relative;width:min(380px,38vw);}
.search input{width:100%;height:40px;border:1px solid rgba(255,255,255,.18);border-radius:22px;padding:0 16px 0 42px;background:rgba(255,255,255,.1);color:#fff;font-size:14px;outline:none;transition:.15s;}
.search input:focus{background:rgba(255,255,255,.16);border-color:var(--gold);}
.search input::placeholder{color:#A9B6D2;}
.search svg{position:absolute;left:14px;top:11px;opacity:.85;}
.btn-pdf{background:var(--gold);color:var(--navy-deep);font-weight:700;font-size:12.5px;padding:9px 15px;border-radius:9px;cursor:pointer;border:none;display:flex;gap:6px;align-items:center;}
.btn-pdf:hover{background:var(--gold-2);}
.wrap{max-width:1200px;margin:0 auto;padding:28px 24px 70px;}

.hero{background:radial-gradient(900px 360px at 88% -10%,rgba(201,162,59,.22),transparent),linear-gradient(125deg,#001A33 0%,#00305E 55%,#0D4076 100%);color:#fff;border-radius:20px;padding:44px 46px;position:relative;overflow:hidden;margin-bottom:30px;box-shadow:0 18px 50px -22px rgba(0,31,85,.7);}
.hero .emblem{position:absolute;right:34px;top:50%;transform:translateY(-50%);opacity:.13;}
.hero .ey{font-size:11px;letter-spacing:4px;color:var(--gold-2);font-weight:700;text-transform:uppercase;}
.hero h1{font-size:46px;margin:12px 0 10px;letter-spacing:-1px;font-weight:600;}
.hero p{color:#C6D2E8;font-size:15px;max-width:560px;line-height:1.55;}
.hstats{display:flex;gap:30px;margin-top:26px;}
.hstats .s b{font-family:'Open Sans',Arial,sans-serif;font-stretch:75%;font-weight:700;font-size:26px;color:var(--gold-2);display:block;}
.hstats .s span{font-size:11px;color:#A9B6D2;letter-spacing:.4px;}

.sectiontitle{font-size:12px;letter-spacing:3px;color:var(--muted);font-weight:700;text-transform:uppercase;margin:4px 2px 16px;}
.hubgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;}
/* En escritorio, el nº de columnas lo fija el ajuste del panel (--hub-cols) */
@media(min-width:980px){.hubgrid{grid-template-columns:repeat(var(--hub-cols,3),minmax(0,1fr));}}
.sec-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;cursor:pointer;transition:.18s;display:flex;flex-direction:column;gap:11px;position:relative;overflow:hidden;}
.sec-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px -16px rgba(0,31,85,.4);border-color:#cfd8e6;}
.sec-card .ic{width:50px;height:50px;border-radius:14px;background:linear-gradient(135deg,#00305E,#0D4076);display:flex;align-items:center;justify-content:center;}
.sec-card h3{font-size:17px;color:var(--navy);font-weight:700;}
.sec-card .ct{font-size:12.5px;color:var(--muted);line-height:1.45;}
.sec-card .go{margin-top:auto;display:flex;align-items:center;justify-content:space-between;}
.sec-card .cnt{font-size:12px;font-weight:700;color:#7A5E16;background:var(--cream);border:1px solid #ECDBAE;padding:3px 10px;border-radius:20px;}
.sec-card .arr{color:var(--gold);font-weight:700;font-size:18px;}

.crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:8px;}
.crumb a{color:var(--navy);font-weight:600;cursor:pointer;}
.vhead{display:flex;align-items:baseline;gap:14px;margin-bottom:20px;flex-wrap:wrap;}
.vhead h2{font-size:30px;color:var(--navy);font-weight:600;}
.vhead .n{font-size:13px;color:var(--muted);}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px;}
.pcard{background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px;cursor:pointer;transition:.16s;position:relative;}
.pcard:hover{box-shadow:0 14px 32px -14px rgba(0,31,85,.4);transform:translateY(-2px);border-color:#cfd8e6;}
.prow{display:flex;gap:14px;align-items:center;}
.av{position:relative;overflow:hidden;width:56px;height:56px;border-radius:50%;flex:none;color:#fff;font-weight:700;font-size:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px #fff,0 0 0 4px var(--line);}
.av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;}
.av .ini{position:relative;}
.pname{font-size:16px;font-weight:700;color:var(--ink);line-height:1.15;}
.prole{font-size:12.5px;color:#A07C1F;font-weight:600;margin-top:3px;}
.porg{font-size:12px;color:var(--muted);margin-top:2px;}
.pfoot{display:flex;align-items:center;gap:13px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);}
.pfoot .vf{margin-left:auto;color:var(--navy);font-weight:700;}
.chip{display:inline-flex;align-items:center;gap:5px;}.chip svg,.social svg{flex:none;}

.overlay{position:fixed;inset:0;background:rgba(0,10,32,.6);display:none;align-items:flex-start;justify-content:center;z-index:100;padding:38px 16px;overflow:auto;}
.overlay.on{display:flex;animation:fade .15s ease;}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal{background:#fff;width:min(760px,100%);border-radius:20px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.45);}
.mhead{background:radial-gradient(600px 200px at 85% -40%,rgba(201,162,59,.3),transparent),linear-gradient(125deg,#001A33,#0D4076);color:#fff;padding:26px 30px;display:flex;gap:20px;align-items:center;position:relative;}
.mhead .av{width:92px;height:92px;font-size:30px;box-shadow:0 0 0 3px rgba(255,255,255,.15),0 0 0 5px var(--gold);}
.mhead h3{font-size:25px;font-weight:600;}
.mhead .mr{color:var(--gold-2);font-weight:700;font-size:14px;margin-top:4px;}
.mhead .ms{color:#B9C6E2;font-size:12.5px;margin-top:3px;font-style:italic;}
.mclose{position:absolute;right:18px;top:18px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;border:none;font-size:17px;cursor:pointer;}
.mclose:hover{background:rgba(255,255,255,.28);}
.mbody{padding:26px 30px;}
.cols{row-gap:22px;}
.blk h4{margin-bottom:15px;}
/* Selector de cargo en la ficha (persona con varios cargos) */
.cargotabs{display:flex;gap:10px;flex-wrap:wrap;padding:16px 30px 4px;background:#fff;}
.cargotab{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;background:var(--soft);border:1px solid var(--line);border-radius:11px;padding:10px 16px;cursor:pointer;transition:.15s;max-width:100%;}
.cargotab b{font-size:12px;color:var(--navy);font-weight:700;line-height:1.35;}
.cargotab span{font-size:10.5px;color:var(--muted);line-height:1.4;}
.cargotab:hover{border-color:var(--gold);}
.cargotab.on{background:var(--cream);border-color:var(--gold);box-shadow:0 2px 8px rgba(201,162,59,.18);}
.cargotab.on b{color:#7A5E16;}
/* Línea de cargo+órgano en resultados de búsqueda agrupados */
.prole .prole-org{color:var(--muted);font-weight:500;}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:30px;}
@media(max-width:580px){.cols{grid-template-columns:1fr;gap:18px;}.hstats{flex-wrap:wrap;gap:18px;}}
.blk h4{font-size:11px;letter-spacing:2px;color:#A07C1F;font-weight:700;text-transform:uppercase;padding-bottom:8px;border-bottom:2px solid var(--cream);margin-bottom:13px;}
.frow{display:flex;gap:12px;font-size:13px;margin-bottom:13px;line-height:1.5;}
.frow .k{width:96px;flex:none;color:var(--muted);padding-top:1px;}
.frow .v{font-weight:600;color:var(--ink);min-width:0;overflow-wrap:break-word;}
.frow .v a{color:var(--navy);}
.mfoot{background:var(--soft);padding:15px 30px;display:flex;gap:10px;flex-wrap:wrap;border-top:1px solid var(--line);}
.social{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--navy);background:#fff;border:1px solid var(--line);border-radius:22px;padding:8px 14px;transition:.15s;}
.social:hover{border-color:var(--gold);box-shadow:0 2px 8px rgba(0,31,85,.08);}
.social.map{background:var(--navy);color:#fff;border-color:var(--navy);}
.social.vcard{background:var(--gold);color:var(--navy-deep);border-color:var(--gold);}
.social.vcard:hover{background:var(--gold-2);border-color:var(--gold-2);box-shadow:0 2px 8px rgba(201,162,59,.3);}
.social.wa{background:#25D366;color:#fff;border-color:#25D366;}
.social.wa:hover{background:#1ebe5b;border-color:#1ebe5b;box-shadow:0 2px 8px rgba(37,211,102,.35);}
.social.addqr{background:#fff;color:var(--navy);border-color:var(--gold);}
.social.addqr:hover{background:var(--cream);border-color:var(--gold-2);box-shadow:0 2px 8px rgba(201,162,59,.25);}
[x-cloak]{display:none!important;}
.qrpanel{flex-basis:100%;display:flex;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;margin-top:4px;}
.qrpanel img{flex:none;border-radius:10px;border:1px solid var(--line);background:#fff;}
.qrtxt{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);line-height:1.5;}
.qrtxt>b{color:var(--navy);font-size:14px;}
.qrclose{align-self:flex-start;margin-top:4px;background:var(--soft);border:1px solid var(--line);border-radius:18px;padding:6px 14px;font-size:12px;font-weight:600;color:var(--navy);cursor:pointer;}
.qrclose:hover{border-color:var(--gold);}
@media(max-width:580px){.qrpanel{flex-direction:column;text-align:center;}.qrclose{align-self:center;}}
.empty{color:var(--muted);font-size:13px;padding:48px;text-align:center;}
.footer-note{margin-top:34px;text-align:center;font-size:11.5px;color:var(--muted);}
.footer-note b{color:#3A3F49;}
.footer-note a{color:var(--navy);font-weight:600;}
.footer-note a:hover{text-decoration:underline;color:var(--gold);}
.footer-note a b{color:inherit;}
.badge{font-size:10px;background:rgba(201,162,59,.2);color:var(--gold-2);border:1px solid rgba(201,162,59,.45);padding:2px 9px;border-radius:20px;font-weight:700;vertical-align:middle;}

@media(max-width:960px){
  .brand span,.brand .sep{display:none;}
}
@media(max-width:720px){
  nav.tabs{display:none;}
  .hero{padding:32px 24px;}
  .hero h1{font-size:34px;}
  .wrap{padding:20px 16px 60px;}
}
