/* ═══════════════════════════════════════════════════
   OJE — Estilos globales
   Observatorio Judicial del Ecuador
   ═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700&family=IBM+Plex+Sans:wght@300;400;500&family=IBM+Plex+Mono:wght@400;500&display=swap');
@import 'themes/oje.css';

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  background: var(--c-bg);
  color: var(--c-text);
  font-size: 15px;
  line-height: 1.65;
}
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0); }
.hidden { display: none !important; }
.text-mono { font-family: var(--font-mono); }
.text-display { font-family: var(--font-display); }

/* ── OTE bar ── */
.ote-bar { height:var(--ote-bar-h);background:var(--c-text);position:sticky;top:0;z-index:200; }
.ote-bar-inner { max-width:1400px;margin:0 auto;padding:0 24px;height:100%;display:flex;align-items:center; }
.ote-bar-left { display:flex;align-items:center;gap:14px;flex:1; }
.ote-bar-inner .ote-bar-left { flex:1; }
.ote-logo { font-family:var(--font-mono);font-size:11px;font-weight:500;color:#fff;letter-spacing:.12em;display:flex;align-items:center;gap:7px;cursor:pointer;text-decoration:none;opacity:.9;transition:opacity .15s; }
.ote-logo:hover { opacity:1; }
.ote-pulse { width:7px;height:7px;border-radius:50%;background:#2ECC80;animation:pulse 2.5s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.8)} }
.ote-sep { width:1px;height:18px;background:rgba(255,255,255,.15); }
.ote-breadcrumb { font-family:var(--font-mono);font-size:10px;color:rgba(255,255,255,.45);letter-spacing:.06em; }
.ote-breadcrumb span { color:rgba(255,255,255,.75); }
.ote-bar-right { font-family:var(--font-mono);font-size:10px;color:rgba(255,255,255,.4); }
.ote-bar-right strong { color:rgba(255,255,255,.75);font-weight:500; }

/* ── Navbar ── */
.navbar {
  background: var(--c-surface);
  border-bottom: 1.5px solid var(--c-border);
  position: sticky;
  top: var(--ote-bar-h);
  z-index: 100;
}
.navbar-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  flex-wrap: nowrap;
  overflow: hidden;
  width: 100%;
}
.nav-brand { display:flex;align-items:center;padding:0 20px;border-right:1px solid var(--c-border-lt);gap:10px;flex-shrink:0; }
.nav-brand-mark { width:30px;height:30px;border-radius:var(--radius-sm);background:var(--c-accent);display:flex;align-items:center;justify-content:center; }
.nav-brand-name { font-family:var(--font-display);font-size:15px;font-weight:700;color:var(--c-text);letter-spacing:-.01em;line-height:1.1; }
.nav-brand-sub { font-family:var(--font-mono);font-size:9px;color:var(--c-text-3);letter-spacing:.08em;text-transform:uppercase; }
.nav-tabs { display:flex;flex-direction:column;flex:1;overflow:hidden; }
.nav-row { display:flex;align-items:stretch;border-bottom:1px solid var(--c-border-lt); }
.nav-row:last-child { border-bottom:none; }
.nav-tab {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 0 14px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--c-text-2);
  cursor: pointer;
  border-bottom: 2.5px solid transparent;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
  user-select: none;
  flex-shrink: 0;
  height: 36px;
  margin-bottom: -1.5px;
}
.nav-row-top .nav-tab { height: 38px; font-size: 12.5px; }
.nav-row-bot .nav-tab { height: 32px; font-size: 11.5px; color: var(--c-text); }
.nav-tab:hover { color: var(--c-text); }
.nav-tab.active {
  color: var(--c-accent);
  border-bottom-color: var(--c-accent);
  font-weight: 500;
  background: var(--c-accent-lt);
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  border-top: 1.5px solid var(--c-accent);
  border-left: 1px solid var(--c-border-lt);
  border-right: 1px solid var(--c-border-lt);
  margin-top: 3px;
}
.tab-badge { font-family:var(--font-mono);font-size:9px;padding:1px 5px;border-radius:3px;font-weight:500;line-height:1.4; }
.tb-green { background:var(--c-green-lt);color:var(--c-green-ok); }
.tb-blue  { background:var(--c-blue-lt);color:var(--c-blue); }
.tb-amber { background:var(--c-amber-lt);color:var(--c-amber); }

/* Botones de acción en navbar — fuera de nav-tabs, nunca recortados */
.nav-actions { display:flex;align-items:center;gap:6px;padding:0 12px;border-left:1px solid var(--c-border-lt);flex-shrink:0; }
.nav-action-btn { display:flex;align-items:center;gap:5px;padding:0 12px;height:28px;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:11px;font-weight:700;text-decoration:none;white-space:nowrap;transition:all .15s;letter-spacing:.02em; }
.nav-action-btn--outline { color:var(--c-accent);background:var(--c-accent-lt);border:1px solid var(--c-accent); }
.nav-action-btn--outline:hover { background:var(--c-accent);color:#fff; }
.nav-action-btn--solid { color:#fff;background:var(--c-accent);border:1px solid var(--c-accent); }
.nav-action-btn--solid:hover { background:var(--c-accent-md); }
@media (max-width:768px) { .nav-actions { display:none; } }

/* ── Layout ── */
.portal-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  max-width: 1400px;
  margin: 0 auto;
  width: 100%;
}
.main-area { border-right:1px solid var(--c-border);min-width:0; }

/* ── Views ── */
.view { display:none; width:100%; }
.view.active { display:block; }
#view-blog.active,
#view-indicadores.active { display:block;grid-column:1/-1;width:100%;min-height:0; }
#view-indicadores.active #ind-root { width:100%;overflow:visible; }

/* ── Placeholders ── */
.view-placeholder { padding:56px 32px;display:flex;flex-direction:column;align-items:flex-start;gap:14px; }
.ph-num { font-family:var(--font-mono);font-size:11px;color:var(--c-text-3);letter-spacing:.06em; }
.ph-title { font-family:var(--font-display);font-size:32px;font-weight:700;color:var(--c-text);letter-spacing:-.02em;line-height:1.1; }
.ph-desc { font-size:15px;color:var(--c-text-2);max-width:520px;line-height:1.65; }
.ph-sub-tabs { display:flex;flex-wrap:wrap;gap:6px;margin-top:8px; }
.ph-sub { font-family:var(--font-mono);font-size:11px;padding:4px 10px;border:1px solid var(--c-border);border-radius:3px;color:var(--c-text-2);background:var(--c-surface); }
.ph-sub.main { background:var(--c-accent);border-color:var(--c-accent);color:#fff; }
.ph-sources { margin-top:12px;display:flex;flex-wrap:wrap;gap:6px; }
.ph-src { font-family:var(--font-mono);font-size:10px;padding:3px 8px;background:var(--c-bg);border:1px solid var(--c-border);border-radius:3px;color:var(--c-text-3); }
.ph-block { display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border:1px dashed var(--c-border);border-radius:var(--radius-md);font-size:13px;color:var(--c-text-3);margin-top:4px; }

/* ── Animaciones ── */
@keyframes fadeUp { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }
.view.active .inicio-layout   { animation:fadeUp .2s ease both; }
.view.active .view-placeholder { animation:fadeUp .2s ease both; }

/* ════════════════════════════════════════════════════
   Pantalla Inicio — 3 columnas
   ════════════════════════════════════════════════════ */
.inicio-layout {
  display: grid;
  grid-template-columns: 20% 1fr 20%;
  min-height: calc(100vh - var(--ote-bar-h) - var(--nav-h));
}
.inicio-col-left {
  border-right: 1px solid var(--c-border-lt);
  padding: 24px 18px;
  background: var(--c-surface);
  overflow-y: auto;
}
.inicio-col-center {
  padding: 36px 36px;
  background: var(--c-bg);
  overflow-y: auto;
}
.inicio-col-right {
  border-left: 1px solid var(--c-border-lt);
  padding: 24px 18px;
  background: var(--c-surface);
  overflow-y: auto;
}
.inicio-section-label {
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 500;
  color: var(--c-text-3);
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-border-lt);
}

/* KPIs lateral */
.inicio-kpi { padding:12px 0 12px 10px;border-bottom:1px solid var(--c-border-lt);position:relative; }
.inicio-kpi:last-child { border-bottom:none; }
.inicio-kpi::before { content:'';position:absolute;left:0;top:12px;bottom:12px;width:2px;border-radius:1px; }
.inicio-kpi--red::before    { background: var(--c-red); }
.inicio-kpi--amber::before  { background: var(--c-amber); }
.inicio-kpi--blue::before   { background: var(--c-blue); }
.inicio-kpi--green::before  { background: var(--c-accent); }

/* KPIs barra compacta horizontal */
.inicio-kpis-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--c-border-lt);
}
.inicio-kpis-bar .inicio-kpi { flex:1;min-width:110px;padding:8px 12px 8px 14px; }
.inicio-kpis-bar .inicio-kpi-val  { font-size: 16px; }
.inicio-kpis-bar .inicio-kpi-name { font-size: 9px; letter-spacing: .04em; }
.inicio-kpis-bar .inicio-kpi-sub  { display: none; }
.inicio-kpi-name { font-family:var(--font-mono);font-size:10px;color:var(--c-text-3);margin-bottom:4px; }
.inicio-kpi-val { font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--c-text);line-height:1;letter-spacing:-.02em; }
.inicio-kpi-sub { font-size:11px;color:var(--c-text-3);margin-top:3px; }

/* Portales lateral */
.inicio-portal { display:block;padding:9px 0;border-bottom:1px solid var(--c-border-lt);text-decoration:none;transition:padding-left .12s; }
.inicio-portal:last-child { border-bottom:none; }
.inicio-portal:hover { padding-left:5px; }
.inicio-portal-name { font-size:12.5px;font-weight:500;color:var(--c-accent);margin-bottom:2px; }
.inicio-portal-desc { font-size:11px;color:var(--c-text-3);line-height:1.4; }

/* Artículo central */
.inicio-art-titulo { font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--c-text);letter-spacing:-.02em;line-height:1.2;margin-bottom:16px;margin-top:10px; }
.inicio-art-dropcap { float:left;font-family:var(--font-display);font-size:72px;font-weight:700;line-height:0.72;color:var(--c-accent);margin-right:5px;margin-top:8px; }
.inicio-art-body p { margin-bottom:1em; }
.inicio-art-body { font-family:var(--font-body);font-size:15px;color:var(--c-text-2);line-height:1.8;margin-bottom:20px; }
.inicio-art-empty { font-family:var(--font-mono);font-size:12px;color:var(--c-text-3);padding:48px 0;text-align:center; }

/* Recursos lateral */
.inicio-recurso { display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-bottom:1px solid var(--c-border-lt);text-decoration:none;cursor:pointer; }
.inicio-recurso:last-child { border-bottom:none; }
.inicio-recurso:hover .inicio-recurso-title { color:var(--c-accent); }
.inicio-recurso-icon { flex-shrink:0;margin-top:2px; }
.inicio-recurso-info { flex:1;min-width:0; }
.inicio-recurso-title { font-size:12px;font-weight:500;color:var(--c-text);margin-bottom:3px;line-height:1.3;transition:color .12s; }
.inicio-recurso-dl { flex-shrink:0;color:var(--c-text-3);margin-top:3px;transition:color .12s; }
.inicio-recurso:hover .inicio-recurso-dl { color:var(--c-accent); }
.inicio-recurso--sm { padding:6px 10px;min-height:unset; }
.inicio-recurso-title--sm { font-size:11px;line-height:1.3; }
.inicio-recursos-header { font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--c-text-3);padding:0 0 6px;border-bottom:1px solid var(--c-border-lt);margin-bottom:8px;margin-top:4px; }

/* ════════════════════════════════════════════════════
   Sub-navegación de módulos (deficit pattern)
   ════════════════════════════════════════════════════ */
.d-subnav { display:flex;align-items:center;border-bottom:1.5px solid var(--c-border);background:var(--c-surface);padding:0 28px;overflow-x:auto;scrollbar-width:none;max-width:100%; }
.d-subnav::-webkit-scrollbar { display:none; }
.d-sub-tab { padding:13px 16px;font-family:var(--font-body);font-size:13px;color:var(--c-text-2);background:none;border:none;border-bottom:2.5px solid transparent;cursor:pointer;white-space:nowrap;transition:color .15s,border-color .15s;margin-bottom:-1.5px;flex:0 0 auto; }
.d-sub-tab:hover { color:var(--c-text); }
.d-sub-tab.active { color:var(--c-accent);border-bottom-color:var(--c-accent);font-weight:500; }
.d-subnav-src { margin-left:auto;font-family:var(--font-mono);font-size:9.5px;color:var(--c-text-3);white-space:nowrap;flex-shrink:0; }
.d-sub-view { padding:24px 32px 32px; }
.d-section-hdr { margin-bottom:18px; }
.d-section-title { font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--c-text);letter-spacing:-.01em;margin-bottom:4px; }
.d-section-sub { font-family:var(--font-mono);font-size:11px;color:var(--c-text-3); }
.d-link { color:var(--c-accent);text-decoration:none;font-family:var(--font-mono);font-size:10px; }
.d-link:hover { text-decoration:underline; }
.d-kpi-row { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px; }
.d-kpi { background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-md);padding:16px 18px;position:relative;overflow:hidden; }
.d-kpi-bar { position:absolute;top:0;left:0;width:100%;height:2px; }
.d-kpi-bar--red   { background:var(--c-red); }
.d-kpi-bar--amber { background:var(--c-amber); }
.d-kpi-bar--green { background:var(--c-accent); }
.d-kpi-bar--blue  { background:var(--c-blue); }
.d-kpi-name { font-family:var(--font-mono);font-size:10.5px;color:var(--c-text-3);margin-bottom:7px;margin-top:4px; }
.d-kpi-val { font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--c-text);letter-spacing:-.02em;line-height:1;margin-bottom:5px; }
.d-kpi-sub { font-size:12px;color:var(--c-text-3); }
.d-charts-row { display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px; }
.d-chart-card { background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-md);padding:18px; }
.d-chart-title { font-family:var(--font-mono);font-size:10.5px;color:var(--c-text-3);letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px; }
.d-table { width:100%;border-collapse:collapse;font-size:13px; }
.d-table th { font-family:var(--font-mono);font-size:10.5px;color:var(--c-text-3);text-align:left;padding:9px 14px;border-bottom:1.5px solid var(--c-border);letter-spacing:.04em;text-transform:uppercase; }
.d-table td { padding:9px 14px;border-bottom:1px solid var(--c-border-lt);color:var(--c-text-2); }
.d-table tr:hover td { background:var(--c-bg); }
.d-td-name { font-weight:500;color:var(--c-text) !important; }
.d-empty { text-align:center;padding:56px 32px;border:1px dashed var(--c-border);border-radius:var(--radius-lg);margin-top:14px; }
.d-empty-title { font-size:15px;font-weight:500;color:var(--c-text);margin-bottom:7px; }
.d-empty-sub { font-size:13px;color:var(--c-text-3);line-height:1.7; }
.d-empty-sub code { font-family:var(--font-mono);background:var(--c-border-lt);padding:1px 5px;border-radius:3px; }

/* ════════════════════════════════════════════════════
   Blog + artículos
   ════════════════════════════════════════════════════ */
.op-blog-link { display:flex;align-items:center;justify-content:space-between;padding:10px 0 0;border-top:1px solid var(--c-border-lt);margin-top:16px;cursor:pointer; }
.op-blog-count { font-family:var(--font-mono);font-size:11px;color:var(--c-text-3); }
.op-blog-arrow { font-family:var(--font-mono);font-size:11px;color:var(--c-accent);transition:opacity .12s; }
.op-blog-link:hover .op-blog-arrow { opacity:.7; }
.op-article { overflow:hidden; }
.op-cat { font-family:var(--font-mono);font-size:9px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border-radius:3px;display:inline-block;margin-bottom:10px; }
.cat-analisis { background:var(--c-blue-lt);color:var(--c-blue); }
.cat-opinion  { background:#F0EEF8;color:var(--c-purple); }
.cat-dato     { background:var(--c-accent-lt);color:var(--c-accent); }
.cat-debate   { background:#FEF6E8;color:var(--c-amber); }
.cat-jurisprudencia { background:var(--c-amber-lt);color:var(--c-amber); }
.op-dropcap { float:left;font-family:var(--font-display);font-size:52px;font-weight:700;line-height:0.72;color:var(--c-accent);margin-right:3px;margin-top:6px; }
.op-body { font-family:var(--font-body);font-size:13px;color:var(--c-text-2);line-height:1.7; }
.op-body p { margin-bottom:1em; }
.op-quote { border-left:3px solid var(--c-accent);padding:8px 14px;margin:14px 0;font-family:var(--font-display);font-size:15px;font-weight:700;font-style:italic;color:var(--c-text);background:var(--c-accent-lt);line-height:1.6; }
.op-author { display:flex;align-items:center;gap:9px;margin-top:12px; }
.op-avatar { width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:9px;font-weight:500;flex-shrink:0; }
.op-author-name { font-family:var(--font-body);font-size:12px;font-weight:500;color:var(--c-text);line-height:1.2; }
.op-author-role { font-family:var(--font-mono);font-size:10px;color:var(--c-text-3); }
.op-footer { display:flex;align-items:center;justify-content:space-between;margin-top:10px; }
.op-date { font-family:var(--font-mono);font-size:10px;color:var(--c-text-3); }
.blog-header { padding:28px 32px 18px;border-bottom:1px solid var(--c-border-lt);background:var(--c-surface); }
.blog-eyebrow { font-family:var(--font-mono);font-size:10.5px;color:var(--c-accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px;display:flex;align-items:center;gap:8px; }
.blog-eyebrow::before { content:'';display:inline-block;width:20px;height:2px;background:var(--c-accent); }
.blog-title { font-family:var(--font-display);font-size:24px;font-weight:700;color:var(--c-text);letter-spacing:-.02em; }
.blog-sub { font-size:13px;color:var(--c-text-3);margin-top:5px;line-height:1.45; }
.blog-list { padding:24px 32px;display:grid;grid-template-columns:1fr 1fr;gap:18px; }
.blog-article { background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:20px;position:relative;transition:border-color .15s; }
.blog-article:hover { border-color:var(--c-accent); }
.blog-article--destacado { border-color:var(--c-accent);border-width:1.5px; }
.blog-article .op-body { font-size:13px;line-height:1.7;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8; }
.blog-article .op-body.expanded { display:block;-webkit-line-clamp:unset; }
.blog-leer-mas { margin-top:10px;font-family:var(--font-mono);font-size:10.5px;color:var(--c-accent);background:none;border:none;cursor:pointer;padding:0;letter-spacing:.04em; }
.blog-leer-mas:hover { text-decoration:underline; }
.blog-badge-dest { font-family:var(--font-mono);font-size:8.5px;font-weight:500;padding:2px 6px;background:var(--c-accent-lt);color:var(--c-accent);border-radius:3px;display:inline-block;margin-bottom:8px;letter-spacing:.06em;text-transform:uppercase; }
.blog-empty { grid-column:1/-1;padding:48px;text-align:center;font-size:14px;color:var(--c-text-3);font-family:var(--font-mono); }
.blog-article-toolbar { display:none !important; }
.blog-btn-portada { display:none !important; }
.blog-save-reminder { display:none !important; }
.blog-txt-loader { display:none !important; }

/* Modal */
.oje-modal-overlay { position:fixed;inset:0;background:rgba(20,21,42,.65);z-index:1000;display:flex;align-items:center;justify-content:center;padding:28px;backdrop-filter:blur(3px); }
.oje-modal-box { background:var(--c-surface);border-radius:var(--radius-lg);border:1px solid var(--c-border);max-width:640px;width:100%;max-height:82vh;overflow-y:auto;padding:32px;position:relative; }
.oje-modal-close { position:absolute;top:16px;right:16px;background:var(--c-bg);border:1px solid var(--c-border);border-radius:var(--radius-sm);width:30px;height:30px;cursor:pointer;font-size:13px;color:var(--c-text-2);display:flex;align-items:center;justify-content:center;transition:background .12s; }
.oje-modal-close:hover { background:var(--c-border-lt); }
.oje-modal-body { font-size:15px;line-height:1.78;color:var(--c-text-2);margin-top:10px; }

/* ════════════════════════════════════════════════════
   Eventos — carrusel columna derecha
   ════════════════════════════════════════════════════ */
.inicio-eventos-header { font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--c-text-3);padding:0 0 8px;border-bottom:1px solid var(--c-border-lt);margin-bottom:10px; }
#inicio-eventos-carrusel { margin-bottom:20px; }
.eve-wrap { position:relative;overflow:hidden;border-radius:10px;border:1px solid var(--c-border-lt);background:var(--c-surface); }
.eve-track { display:flex;transition:transform .35s ease;will-change:transform; }
.eve-slide { min-width:100%;flex-shrink:0; }
.eve-img-wrap { width:100%;height:195px;overflow:hidden;border-radius:10px 10px 0 0;background:var(--c-border-lt);display:flex;align-items:center;justify-content:center; }
.eve-img-wrap img { width:100%;height:100%;object-fit:contain;display:block; }
.eve-img-placeholder { width:100%;height:195px;background:linear-gradient(135deg,var(--c-accent-lt),#EEF2FA);display:flex;align-items:center;justify-content:center;border-radius:10px 10px 0 0; }
.eve-body { padding:12px 14px 14px; }
.eve-fecha { font-family:var(--font-mono);font-size:9px;color:var(--c-accent);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px; }
.eve-titulo { font-size:13px;font-weight:700;color:var(--c-text);line-height:1.35;margin-bottom:5px; }
.eve-desc { font-size:11px;color:var(--c-text-2);line-height:1.55;margin-bottom:6px;white-space:pre-line; }
.eve-lugar { font-family:var(--font-mono);font-size:10px;color:var(--c-text-3);margin-bottom:8px; }
.eve-actions { display:flex;flex-wrap:wrap;gap:6px;margin-top:8px; }
.eve-action { font-family:var(--font-mono);font-size:10px;color:var(--c-accent);text-decoration:none;border:1px solid var(--c-border-lt);border-radius:4px;padding:4px 7px;background:var(--c-accent-lt); }
.eve-action:hover { border-color:var(--c-accent); }
.eve-empty { border:1px dashed var(--c-border);border-radius:10px;background:var(--c-surface);padding:22px 16px;min-height:230px;display:flex;flex-direction:column;justify-content:center;gap:10px; }
.eve-empty-kicker { font-family:var(--font-mono);font-size:9px;color:var(--c-accent);text-transform:uppercase; }
.eve-empty-title { font-size:20px;line-height:1.1;font-weight:800;color:var(--c-text); }
.eve-empty-text { font-size:12px;line-height:1.55;color:var(--c-text-2); }
.eve-empty-link { align-self:flex-start;font-family:var(--font-mono);font-size:10px;color:var(--c-accent);text-decoration:none;border:1px solid var(--c-border-lt);border-radius:4px;padding:4px 7px;background:var(--c-accent-lt); }
.eve-btn { position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.4);color:#fff;border:none;cursor:pointer;border-radius:50%;width:26px;height:26px;font-size:14px;display:flex;align-items:center;justify-content:center;z-index:3;opacity:0;transition:opacity .15s; }
.eve-wrap:hover .eve-btn { opacity:1; }
.eve-btn:hover { background:rgba(0,0,0,.65); }
.eve-prev { left:6px; }
.eve-next { right:6px; }
.eve-dots { position:absolute;bottom:6px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:3; }
.eve-dot { width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45);border:none;cursor:pointer;padding:0;transition:background .15s; }
.eve-dot.a { background:var(--c-accent); }

/* ════════════════════════════════════════════════════
   Actualidad — noticias
   ════════════════════════════════════════════════════ */
.noticia-manual-img-wrap { width:100%;aspect-ratio:16/9;max-height:260px;overflow:hidden;background:var(--c-border-lt);display:flex;align-items:center;justify-content:center; }
.noticia-manual-img-wrap img { width:100%;height:100%;object-fit:contain;display:block; }
.actualidad-manual-card { background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-md);overflow:hidden;transition:box-shadow .15s; }
.actualidad-manual-card--flujo { border-left:3px solid var(--c-accent); }
.actualidad-manual-body { padding:14px 16px; }
.actualidad-meta-row { display:flex;gap:6px;align-items:center;margin-bottom:7px;flex-wrap:wrap; }
.actualidad-chip { font-family:var(--font-mono);font-size:9px;padding:1px 7px;border-radius:3px;background:var(--c-accent-lt);color:var(--c-accent); }
.actualidad-chip--destacado { background:#1A3A6C;color:#fff; }
.actualidad-chip--evento { background:#0D9488;color:#fff; }
.actualidad-fecha,.actualidad-lugar { font-family:var(--font-mono);font-size:9px;color:var(--c-text-3); }
.actualidad-lugar { margin-top:8px;font-size:10px; }
.actualidad-manual-title { font-size:14px;font-weight:600;color:var(--c-text);line-height:1.4;margin-bottom:7px; }
.actualidad-manual-desc { font-size:12px;color:var(--c-text-2);line-height:1.6;white-space:pre-line; }
.actualidad-grid { display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,2fr);gap:16px;align-items:start; }
.actualidad-manuales-col { display:flex;flex-direction:column;gap:16px;min-width:0; }
.actualidad-rss-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start;min-width:0; }
.actualidad-manual-empty { background:var(--c-surface);border:1px dashed var(--c-border);border-radius:var(--radius-md);padding:18px 16px;min-height:120px;display:flex;flex-direction:column;justify-content:center;gap:8px; }
.actualidad-contactos { display:flex;flex-wrap:wrap;gap:6px;margin-top:10px; }
.actualidad-contactos a { font-family:var(--font-mono);font-size:10px;color:var(--c-accent);text-decoration:none;border:1px solid var(--c-border-lt);border-radius:4px;padding:4px 7px;background:var(--c-accent-lt); }
.actualidad-contactos a:hover { border-color:var(--c-accent); }

/* ════════════════════════════════════════════════════
   Directorio de Servicios Legales
   ════════════════════════════════════════════════════ */
.directorio-filtros { display:flex;gap:8px;flex-wrap:wrap;padding:16px 28px;border-bottom:1px solid var(--c-border-lt);background:var(--c-surface); }
.dir-filtro-btn { font-family:var(--font-mono);font-size:11px;padding:5px 12px;border:1px solid var(--c-border);border-radius:20px;background:var(--c-bg);color:var(--c-text-2);cursor:pointer;transition:all .15s; }
.dir-filtro-btn:hover,.dir-filtro-btn.active { background:var(--c-accent);border-color:var(--c-accent);color:#fff; }
.directorio-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;padding:24px 28px; }
.dir-card { background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:18px;transition:border-color .15s,box-shadow .15s; }
.dir-card:hover { border-color:var(--c-accent);box-shadow:0 3px 12px rgba(26,58,108,.08); }
.dir-card-tipo { font-family:var(--font-mono);font-size:9px;font-weight:500;padding:2px 7px;border-radius:3px;display:inline-block;margin-bottom:10px; }
.dir-tipo-abogado   { background:var(--c-blue-lt);color:var(--c-blue); }
.dir-tipo-notaria   { background:var(--c-amber-lt);color:var(--c-amber); }
.dir-tipo-mediacion { background:var(--c-green-lt);color:var(--c-green-ok); }
.dir-tipo-perito    { background:#F0EEF8;color:var(--c-purple); }
.dir-tipo-arbitraje { background:var(--c-accent-lt);color:var(--c-accent); }
.dir-card-nombre { font-size:15px;font-weight:700;color:var(--c-text);margin-bottom:4px;line-height:1.3; }
.dir-card-especialidad { font-size:12px;color:var(--c-text-3);margin-bottom:8px; }
.dir-card-info { display:flex;flex-direction:column;gap:4px; }
.dir-card-info-row { display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--c-text-2); }
.dir-card-info-icon { color:var(--c-text-3);flex-shrink:0; }
.dir-card-actions { display:flex;gap:6px;margin-top:12px; }
.dir-btn { font-family:var(--font-mono);font-size:10px;padding:5px 10px;border-radius:var(--radius-sm);text-decoration:none;border:1px solid var(--c-border);background:var(--c-bg);color:var(--c-text-2);cursor:pointer;transition:all .12s; }
.dir-btn:hover { background:var(--c-accent-lt);border-color:var(--c-accent);color:var(--c-accent); }
.dir-btn--primary { background:var(--c-accent);border-color:var(--c-accent);color:#fff; }
.dir-btn--primary:hover { background:var(--c-accent-md); }
.directorio-empty { grid-column:1/-1;padding:56px;text-align:center;font-size:14px;color:var(--c-text-3);font-family:var(--font-mono);border:1px dashed var(--c-border);border-radius:var(--radius-lg); }

/* ════════════════════════════════════════════════════
   Overlay OEE
   ════════════════════════════════════════════════════ */
.oee-overlay { display:none;position:fixed;inset:0;background:rgba(20,21,42,.75);z-index:9999;align-items:center;justify-content:center; }
.oee-overlay.show { display:flex; }
.oee-overlay-box { background:var(--c-surface);border-radius:var(--radius-lg);padding:32px 40px;min-width:280px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.25); }
.oee-overlay-spinner { width:32px;height:32px;border:3px solid var(--c-border-lt);border-top-color:var(--c-accent);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 16px; }
@keyframes spin { to { transform:rotate(360deg); } }
.oee-overlay-title { font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--c-text);margin-bottom:6px; }
.oee-overlay-msg { font-size:12px;color:var(--c-text-3); }
.oee-overlay-progress { height:3px;background:var(--c-border-lt);border-radius:2px;margin-top:16px;overflow:hidden; }
.oee-overlay-progress-fill { height:100%;background:var(--c-accent);width:60%;animation:progress 1.5s ease-in-out infinite; }
@keyframes progress { 0%{width:0;margin-left:0} 50%{width:70%;margin-left:15%} 100%{width:0;margin-left:100%} }
body.oee-overlay-lock { overflow:hidden; }

/* ════════════════════════════════════════════════════
   Mobile nav
   ════════════════════════════════════════════════════ */
.nav-active-label,.nav-hamburger,.nav-mobile-menu { display:none; }
.nav-lock { overflow:hidden; }

/* ════════════════════════════════════════════════════
   Status bar
   ════════════════════════════════════════════════════ */
.status-bar { border-top:1px solid var(--c-border-lt);padding:0 28px;height:32px;display:flex;align-items:center;gap:20px;background:var(--c-surface);font-family:var(--font-mono);font-size:10px;color:var(--c-text-3); }
.sb-item { display:flex;align-items:center;gap:5px; }
.sb-dot { width:6px;height:6px;border-radius:50%; }

/* ════════════════════════════════════════════════════
   Módulos card (inicio)
   ════════════════════════════════════════════════════ */
.module-card { background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:18px;cursor:pointer;transition:border-color .15s,box-shadow .15s; }
.module-card:hover { border-color:var(--c-accent);box-shadow:0 3px 12px rgba(26,58,108,.08); }
.module-num { font-family:var(--font-mono);font-size:10px;color:var(--c-text-3);margin-bottom:10px; }
.module-icon-wrap { width:28px;height:28px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;margin-bottom:10px; }
.module-name { font-size:13px;font-weight:600;color:var(--c-text);margin-bottom:4px;line-height:1.3; }
.module-desc { font-size:11.5px;color:var(--c-text-3);line-height:1.5;margin-bottom:10px; }
.module-status { font-family:var(--font-mono);font-size:9px;padding:2px 6px;border-radius:3px; }
.st-live  { background:var(--c-green-lt);color:var(--c-green-ok); }
.st-dev   { background:var(--c-blue-lt);color:var(--c-blue); }
.st-plan  { background:var(--c-border-lt);color:var(--c-text-3); }
.modules-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-bottom:18px; }
.util-row { display:flex;flex-wrap:wrap;gap:8px;margin-top:8px; }
.util-card { display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color .15s;flex:1;min-width:200px; }
.util-card:hover { border-color:var(--c-accent); }
.util-icon { width:26px;height:26px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.util-title { font-size:12px;font-weight:500;color:var(--c-text); }
.util-sub { font-size:10.5px;color:var(--c-text-3);margin-top:2px; }
.util-badge { font-family:var(--font-mono);font-size:8.5px;padding:2px 5px;border-radius:3px;margin-left:auto; }

/* ════════════════════════════════════════════════════
   Responsive
   ════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .inicio-layout { grid-template-columns:1fr; }
  .inicio-col-left,.inicio-col-right { border:none;border-bottom:1px solid var(--c-border-lt); }
  .blog-list { grid-template-columns:1fr; }
  .d-kpi-row { grid-template-columns:repeat(2,1fr); }
  .d-charts-row { grid-template-columns:1fr; }
  .actualidad-grid { grid-template-columns:1fr; }
  .actualidad-rss-grid { grid-template-columns:1fr; }
}

@media (max-width: 768px) {
  .navbar-inner { flex-direction:row;align-items:center;min-height:54px;overflow:visible; }
  .nav-brand { height:54px;padding:0 12px; }
  .nav-tabs { display:none; }
  .nav-active-label { display:flex;flex:1;min-width:0;flex-direction:column;justify-content:center;padding:0 12px;font-size:13px;font-weight:500;color:var(--c-text);line-height:1.2; }
  .nav-active-label-accent { display:block;font-family:var(--font-mono);font-size:9px;color:var(--c-accent);letter-spacing:.08em;text-transform:uppercase; }
  .nav-hamburger { display:flex;align-items:center;justify-content:center;width:42px;height:42px;margin-right:8px;border:1px solid var(--c-border);border-radius:var(--radius-sm);background:var(--c-surface);color:var(--c-text);cursor:pointer;flex-shrink:0; }
  .nav-mobile-menu.open { display:block; }
  .nav-mobile-menu { position:fixed;inset:0;z-index:300; }
  .nav-mobile-overlay { position:absolute;inset:0;background:rgba(20,21,42,.55); }
  .nav-mobile-drawer { position:absolute;top:0;left:0;right:0;max-height:90vh;overflow-y:auto;background:var(--c-surface);border-bottom:1px solid var(--c-border);border-radius:0 0 14px 14px;box-shadow:0 18px 44px rgba(0,0,0,.18); }
  .nav-mobile-header { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--c-border-lt); }
  .nav-mobile-title,.nav-mobile-group-label { font-family:var(--font-mono);font-size:10px;color:var(--c-text-3);letter-spacing:.08em;text-transform:uppercase; }
  .nav-mobile-close { width:30px;height:30px;border:1px solid var(--c-border);border-radius:var(--radius-sm);background:var(--c-bg);color:var(--c-text-2);cursor:pointer; }
  .nav-mobile-group { padding:8px 0;border-bottom:1px solid var(--c-border-lt); }
  .nav-mobile-group-label { display:block;padding:4px 16px 6px;font-size:9px; }
  .nav-mobile-item { display:flex;width:100%;align-items:center;justify-content:space-between;padding:12px 16px;border:0;background:transparent;color:var(--c-text-2);font:inherit;font-size:14px;text-align:left;cursor:pointer; }
  .nav-mobile-item.active { background:var(--c-accent-lt);color:var(--c-accent);font-weight:500; }
  .nav-mobile-admin { display:flex;align-items:center;justify-content:center;margin:12px 16px 16px;padding:11px 14px;border-radius:8px;background:var(--c-accent);color:#fff;font-size:13px;font-weight:700;text-decoration:none; }
  .d-sub-view { padding:16px; }
  .inicio-col-left,.inicio-col-center,.inicio-col-right { padding:16px; }
  .d-kpi-row,.inicio-kpis-bar { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .blog-list { grid-template-columns:1fr !important;padding:16px !important; }
  .portal-layout { max-width:none; }
  .main-area { border-right:0; }
  .directorio-grid { grid-template-columns:1fr; }
  #view-recursos > div { grid-template-columns:1fr !important;padding:16px !important; }
  .directorio-filtros { padding:12px 16px;flex-wrap:wrap; }
  .d-charts-row { grid-template-columns:1fr !important; }
  .d-kpi-row { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .blog-header { padding:20px 16px 14px; }
  #actualidad-list { padding:0 16px 24px !important; }
  .actualidad-grid { grid-template-columns:1fr; }
  .actualidad-rss-grid { grid-template-columns:1fr; }
  /* Sub-navegación horizontal con scroll */
  .d-subnav { padding:0 14px;gap:2px;border-top:1px solid var(--c-border-lt); }
  .d-subnav-src { display:none; }
  /* Títulos de sección */
  .d-section-title { font-size:20px; }
  .d-section-sub { font-size:10.5px;line-height:1.5; }
  /* Tabla overflow */
  .d-table-wrap,.adm-table-wrap { overflow-x:auto;-webkit-overflow-scrolling:touch; }
  /* Evitar desborde de iframes y canvas */
  .d-chart-card canvas { max-width:100%; }
}

/* ── Modales: grids 2-col colapsan en mobile ── */
@media (max-width: 560px) {
  .oje-modal-overlay { align-items:flex-start; padding-top:12px; }
  .oje-modal-box { max-width:calc(100vw - 16px) !important; }
  .oje-modal-box [style*="grid-template-columns:1fr 1fr"],
  .oje-modal-box [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ── Banner alertas: apila en mobile ── */
@media (max-width: 640px) {
  #form-alerta {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
  }
  #alerta-tipo,
  #alerta-email { min-width: 0 !important; width: 100% !important; }
  #form-alerta button { width: 100% !important; }
}

@media (max-width: 480px) {
  /* Override grids inline 2 columnas dentro de vistas (generado por JS) */
  .view [style*="grid-template-columns:1fr 1fr"],
  .view [style*="grid-template-columns: 1fr 1fr"],
  .view [style*="grid-template-columns:repeat(2,1fr)"],
  .view [style*="grid-template-columns: repeat(2,1fr)"],
  .view [style*="grid-template-columns:repeat(2, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 520px) {
  .ote-logo { font-size:9px;letter-spacing:.06em; }
  .nav-brand-name { font-size:13px; }
  .nav-brand-sub { font-size:8px; }
  .d-kpi-row,.inicio-kpis-bar { grid-template-columns:1fr !important; }
  .blog-header,.d-sub-view,.inicio-col-left,.inicio-col-center,.inicio-col-right { padding:14px; }
  .d-sub-tab { padding:9px 9px 8px;font-size:11.5px; }
  .d-section-title,.blog-title { font-size:20px; }
  /* Dropcap más pequeño en phones */
  .inicio-art-dropcap { font-size:52px; }
  /* Modal full-screen en phones */
  .oje-modal-overlay { padding:0; }
  .oje-modal-box { border-radius:0;max-height:100vh;padding:20px 16px; }
}

/* ══════════════════════════════════════════════════
   Vista MASC — Editorial Arbitraje y Mediación
   ════════════════════════════════════════════════ */
#asub-editorial { padding: 0; }
.d-sub-view--editorial { padding: 0 !important; overflow: hidden; }

.masc-layout {
  display: grid;
  grid-template-columns: 220px 1fr 220px;
  grid-template-areas: "left center right";
  min-height: calc(100vh - var(--ote-bar-h,40px) - var(--nav-h,44px) - var(--nav-bot-h,40px) - 44px);
  background: var(--c-bg, #F5F6FA);
}
.masc-col {
  overflow-y: auto;
  max-height: calc(100vh - var(--ote-bar-h,40px) - var(--nav-h,44px) - var(--nav-bot-h,40px) - 44px);
}
.masc-col-left   { grid-area: left;   border-right: 1px solid var(--c-border-lt, #DDE0EC); padding: 20px 14px; background: var(--c-surface,#fff); }
.masc-col-center { grid-area: center; padding: 28px 36px; }
.masc-col-right  { grid-area: right;  border-left: 1px solid var(--c-border-lt, #DDE0EC); padding: 20px 14px; background: var(--c-surface,#fff); }

/* ── Columna izquierda ── */
.masc-section-label {
  font-family: var(--font-mono,'IBM Plex Mono',monospace);
  font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--c-text-3,#5A5C7A); margin-bottom: 10px; padding-bottom: 6px;
  border-bottom: 1px solid var(--c-border-lt,#DDE0EC);
}
.masc-recurso {
  display: flex; align-items: flex-start; gap: 9px;
  padding: 9px 10px; border: 1px solid var(--c-border-lt,#DDE0EC);
  border-radius: 8px; margin-bottom: 7px; text-decoration: none;
  color: inherit; background: var(--c-bg,#F5F6FA); transition: border-color .15s;
}
.masc-recurso:hover { border-color: var(--c-accent,#1A3A6C); }
.masc-recurso-icon {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  background: var(--c-accent-lt,#E4EAF5); font-size: 11px; font-weight: 700;
  color: var(--c-accent,#1A3A6C);
}
.masc-recurso-titulo { font-size: 11.5px; font-weight: 600; color: var(--c-text,#14152A); line-height: 1.35; margin-bottom: 2px; }
.masc-recurso-desc   { font-size: 10px; color: var(--c-text-3,#5A5C7A); line-height: 1.4; }

/* ── Columna central: editorial ── */
.masc-editorial-meta {
  display: flex; align-items: center; gap: 8px; margin-bottom: 14px; flex-wrap: wrap;
}
.masc-eyebrow {
  font-family: var(--font-mono,'IBM Plex Mono',monospace);
  font-size: 9px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--c-text-3,#5A5C7A);
}
.masc-editorial-titulo {
  font-family: var(--font-display,'Playfair Display',Georgia,serif);
  font-size: 24px; font-weight: 700; color: var(--c-text,#14152A);
  line-height: 1.2; letter-spacing: -.02em; margin: 0 0 10px;
}
.masc-editorial-lead {
  font-size: 14.5px; color: var(--c-text-2,#3B3D5C); line-height: 1.7;
  margin-bottom: 16px; font-style: italic;
  padding-left: 14px; border-left: 3px solid var(--c-accent,#1A3A6C);
}
.masc-editorial-img {
  width: 100%; max-height: 260px; object-fit: cover;
  border-radius: 10px; margin-bottom: 18px;
  border: 1px solid var(--c-border-lt,#DDE0EC);
}
.masc-editorial-body { font-size: 14px; line-height: 1.8; color: var(--c-text-2,#3B3D5C); }
.masc-editorial-body p { margin: 0 0 14px; }
.masc-empty {
  text-align: center; padding: 60px 24px; color: var(--c-text-3,#5A5C7A);
}
.masc-empty-title { font-size: 15px; font-weight: 600; margin-bottom: 8px; }
.masc-empty-sub   { font-size: 13px; line-height: 1.6; }

/* ── Columna derecha: cards ── */
.masc-right-card {
  background: var(--c-bg,#F5F6FA); border: 1px solid var(--c-border,#C5C9D9);
  border-radius: 8px; padding: 11px 13px; margin-bottom: 9px;
}
.masc-right-card--evento { border-left: 3px solid #22C55E; }
.masc-right-chip {
  font-family: var(--font-mono,'IBM Plex Mono',monospace); font-size: 9px;
  padding: 2px 6px; border-radius: 3px; background: var(--c-accent-lt,#E4EAF5);
  color: var(--c-accent,#1A3A6C); display: inline-block; margin-bottom: 5px; text-transform: uppercase;
}
.masc-right-chip--noticia { background: #DCFCE7; color: #15803D; }
.masc-right-fecha  { font-family: var(--font-mono,'IBM Plex Mono',monospace); font-size: 9.5px; color: var(--c-text-3,#5A5C7A); margin-bottom: 4px; }
.masc-right-titulo { font-size: 12.5px; font-weight: 600; color: var(--c-text,#14152A); line-height: 1.35; margin-bottom: 4px; }
.masc-right-desc   { font-size: 11px; color: var(--c-text-2,#3B3D5C); line-height: 1.5; }
.masc-right-lugar  { font-size: 10.5px; color: var(--c-text-3,#5A5C7A); margin-top: 4px; }
.masc-right-link   { display: inline-block; margin-top: 6px; font-family: var(--font-mono,'IBM Plex Mono',monospace); font-size: 10px; color: var(--c-accent,#1A3A6C); text-decoration: none; }
.masc-right-link:hover { text-decoration: underline; }

/* ── Responsive ── */
@media (max-width: 959px) and (min-width: 768px) {
  .masc-layout {
    grid-template-columns: 1fr 200px;
    grid-template-areas: "center right" "left left";
  }
  .masc-col-left  { border-right: none; border-top: 1px solid var(--c-border-lt,#DDE0EC); max-height: none; }
  .masc-col-right { max-height: none; }
  .masc-col-center { max-height: none; }
}
@media (max-width: 767px) {
  .masc-layout {
    grid-template-columns: 1fr;
    grid-template-areas: "left" "center" "right";
  }
  .masc-col { max-height: none; }
  .masc-col-left, .masc-col-center, .masc-col-right {
    border: none; border-bottom: 1px solid var(--c-border-lt,#DDE0EC); padding: 16px;
  }
  .masc-col-center { padding: 18px 16px; }
  .masc-editorial-titulo { font-size: 20px; }
}
@media (max-width: 480px) {
  .masc-editorial-lead { font-size: 13.5px; padding-left: 10px; }
  .masc-editorial-body { font-size: 13.5px; }
}

/* ══════════════════════════════════════════════════
   Indicadores Judiciales — rediseño
   ════════════════════════════════════════════════ */

/* Skeleton */
.ind-skel { height: 80px; background: var(--c-border-lt); border-radius: 8px; margin-bottom: 10px; animation: pulse 1.4s ease-in-out infinite; }

/* Hero */
.ind-hero {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 32px;
  align-items: center;
  padding: 40px 48px 36px;
  background: var(--c-surface, #fff);
  border-bottom: 1px solid var(--c-border-lt);
}
.ind-hero-eyebrow { font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px; }
.ind-hero-title { font-family: var(--font-display, 'Playfair Display', Georgia, serif); font-size: 34px; font-weight: 700; color: var(--c-text); line-height: 1.15; letter-spacing: -.02em; margin: 0 0 12px; }
.ind-hero-desc { font-size: 13.5px; color: var(--c-text-2); line-height: 1.65; max-width: 520px; margin: 0 0 20px; }
.ind-hero-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.ind-hero-btn { padding: 10px 20px; border-radius: 7px; font-size: 13px; font-weight: 600; cursor: pointer; border: none; font-family: inherit; transition: all .15s; }
.ind-hero-btn--primary { background: var(--c-accent); color: #fff; box-shadow: 0 3px 10px rgba(26,58,108,.2); }
.ind-hero-btn--primary:hover { background: var(--c-accent-d, #122A52); transform: translateY(-1px); }
.ind-hero-btn--ghost { background: transparent; color: var(--c-accent); border: 1.5px solid var(--c-accent); }
.ind-hero-btn--ghost:hover { background: var(--c-accent-lt); }

/* Hero panel oscuro */
.ind-hero-right {
  background: #14152A;
  border-radius: 14px;
  padding: 20px 22px;
  color: #fff;
}
.ind-hero-stat-row { display: flex; gap: 20px; }
.ind-hero-stat { flex: 1; }
.ind-hero-stat-label { font-family: var(--font-mono); font-size: 9.5px; color: rgba(255,255,255,.55); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 4px; }
.ind-hero-stat-val { font-family: var(--font-display, 'Playfair Display', Georgia, serif); font-size: 26px; font-weight: 700; color: #fff; letter-spacing: -.02em; line-height: 1; }
.ind-hero-bars { display: flex; align-items: flex-end; gap: 4px; margin-top: 6px; height: 44px; }
.ind-hero-bar { width: 100%; min-width: 10px; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, rgba(255,255,255,.7) 0%, rgba(255,255,255,.25) 100%); transition: height .3s ease; }

/* Secciones */
.ind-section { padding: 44px 48px; border-bottom: 1px solid var(--c-border-lt); }
.ind-section--dark { background: var(--c-surface); }
.ind-section-eyebrow { font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--c-text-3); margin-bottom: 8px; }
.ind-section-title { font-family: var(--font-display, 'Playfair Display', Georgia, serif); font-size: 26px; font-weight: 700; color: var(--c-text); letter-spacing: -.02em; margin: 0 0 8px; line-height: 1.2; }
.ind-section-sub { font-size: 13px; color: var(--c-text-3); line-height: 1.6; margin: 0 0 24px; max-width: 640px; }

/* Fuentes grid */
.ind-fuentes-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 24px; }
.ind-fuente-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 0;
  transition: box-shadow .15s, border-color .15s;
}
.ind-fuente-card:hover { box-shadow: 0 4px 18px rgba(0,0,0,.07); border-color: var(--c-border); }
.ind-fuente-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.ind-fuente-badge { font-family: var(--font-mono); font-size: 9px; font-weight: 700; letter-spacing: .1em; padding: 3px 7px; border-radius: 4px; text-transform: uppercase; }
.ind-fuente-formato { font-family: var(--font-mono); font-size: 9.5px; color: var(--c-text-3); }
.ind-fuente-nombre { font-size: 16px; font-weight: 700; color: var(--c-text); line-height: 1.2; margin-bottom: 3px; }
.ind-fuente-subtitulo { font-size: 11px; color: var(--c-text-3); font-style: italic; margin-bottom: 8px; }
.ind-fuente-desc { font-size: 12.5px; color: var(--c-text-2); line-height: 1.6; flex: 1; margin-bottom: 14px; }
.ind-fuente-btn {
  display: inline-block;
  align-self: flex-start;
  padding: 8px 16px;
  background: var(--c-accent, #1A3A6C);
  color: #fff;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s;
  margin-top: auto;
}
.ind-fuente-btn:hover { background: var(--c-accent-d, #122A52); }

/* Cifras */
.ind-cifras-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 20px; }
.ind-cifra-card {
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 20px 18px;
}
.ind-cifra-val { font-family: var(--font-display, 'Playfair Display', Georgia, serif); font-size: 36px; font-weight: 700; color: var(--c-text); letter-spacing: -.03em; line-height: 1; margin-bottom: 6px; }
.ind-cifra-label { font-size: 12.5px; color: var(--c-text-2); font-weight: 600; line-height: 1.35; margin-bottom: 8px; }
.ind-cifra-meta { font-family: var(--font-mono); font-size: 9.5px; color: var(--c-text-3); line-height: 1.5; }
.ind-cifra-fuente { color: var(--c-accent); }

/* Perfiles */
.ind-perfiles-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 24px; }
.ind-perfil-card { background: var(--c-surface); border: 1px solid var(--c-border-lt); border-radius: 10px; padding: 18px 14px; }
.ind-perfil-icono { font-size: 22px; margin-bottom: 10px; }
.ind-perfil-titulo { font-size: 14px; font-weight: 700; color: var(--c-text); margin-bottom: 7px; }
.ind-perfil-desc { font-size: 11.5px; color: var(--c-text-2); line-height: 1.6; margin-bottom: 10px; }
.ind-perfil-recursos { display: flex; flex-direction: column; gap: 3px; }
.ind-perfil-link { font-family: var(--font-mono); font-size: 9.5px; color: var(--c-accent); text-decoration: none; }
.ind-perfil-link:hover { text-decoration: underline; }

/* Nota metodológica */
.ind-nota { padding: 20px 48px 28px; background: var(--c-bg); border-top: 1px solid var(--c-border-lt); }
.ind-nota-label { font-family: var(--font-mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: var(--c-text-3); margin-bottom: 6px; }
.ind-nota-texto { font-size: 12px; color: var(--c-text-2); line-height: 1.65; max-width: 800px; }
.ind-nota-link { color: var(--c-accent); text-decoration: underline; }

/* ── Responsive Indicadores ── */
@media (max-width: 960px) {
  .ind-hero { grid-template-columns: 1fr; gap: 20px; padding: 28px 24px; }
  .ind-hero-right { max-width: 100%; }
  .ind-hero-title { font-size: 28px; }
  .ind-fuentes-grid { grid-template-columns: repeat(2, 1fr); }
  .ind-cifras-grid { grid-template-columns: repeat(2, 1fr); }
  .ind-perfiles-grid { grid-template-columns: repeat(3, 1fr); }
  .ind-section { padding: 32px 28px; }
  .ind-nota { padding: 18px 28px 22px; }
}
@media (max-width: 768px) {
  .ind-fuentes-grid { grid-template-columns: 1fr; }
  .ind-perfiles-grid { grid-template-columns: repeat(2, 1fr); }
  .ind-section-title { font-size: 22px; }
  .ind-cifra-val { font-size: 30px; }
}
@media (max-width: 520px) {
  .ind-hero { padding: 20px 16px; }
  .ind-section { padding: 24px 16px; }
  .ind-nota { padding: 16px; }
  .ind-cifras-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .ind-perfiles-grid { grid-template-columns: 1fr; }
  .ind-hero-title { font-size: 24px; }
  .ind-cifra-val { font-size: 26px; }
}