/* ═══════════════════════════════════════════════════════════════════
   TEMA «PANEL» — geopolitica.ar · octubre 2026
   Registro de portal de información estratégica: tipografía Rubik en
   todo el sitio, banda de navegación pizarra con filete rojo, rótulos
   de sección en caja índigo, tarjetas planas y tablas cebradas.
   Se carga después de todos los estilos propios, así que solo pisa lo
   que nombra; el mapa, el radar y el simulador conservan su consola.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  --ink:#111111;--ink-soft:#222222;--paper:#ffffff;--cream:#ffffff;--cream-deep:#f0f0f0;
  --rust:#c4161c;--rust-bright:#e0252b;
  --gold:#1e1599;--gold-bright:#9d97ff;
  --steel:#0b3a7e;--slate-2:#3c525b;--azul-marca:#0b3a7e;
  --muted:#5b5f63;--border:#e3e3e3;--border-soft:#efefef;
  --font-display:'Rubik',system-ui,sans-serif;--font-body:'Rubik',system-ui,sans-serif;
  --font-mono:'Rubik',system-ui,sans-serif;--font-brand:'Rubik',system-ui,sans-serif;
  --shadow-deep:0 10px 30px -18px rgba(0,0,0,.35);
}

/* ── Base ── */
body{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98' viewBox='0 0 56 98'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zm0 32L0 82V66l28 16 28-16v16L28 98z' fill='none' stroke='%23000' stroke-opacity='.025' stroke-width='1'/%3E%3C/svg%3E");
  color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.7;font-weight:400}
body::before{display:none}
::selection{background:var(--rust);color:#fff}
.scroll-progress{background:var(--rust);height:3px}

/* ── Franja superior ── */
.topbar{background:#fff;color:#444;border-bottom:1px solid var(--border-soft);font-family:var(--font-body);font-size:12px;letter-spacing:0;padding:6px 32px}
.topbar-date{opacity:1;color:#666}
.ticker{color:var(--steel);font-weight:500}
.topbar>span:last-child{opacity:1!important;color:var(--azul-marca);font-weight:500;letter-spacing:.06em}

/* ── Cabecera: monograma en caja azul y marca en Rubik ── */
header{background:#fff;border-bottom:none;padding:22px 32px 0;position:relative}
.header-inner{margin-bottom:22px}
.brand-block{gap:14px}
.brand-mark{background:var(--azul-marca);border-radius:4px;font-family:var(--font-body);font-weight:700;font-size:24px;width:54px;height:54px;letter-spacing:-.02em;box-shadow:inset 0 0 0 3px rgba(255,255,255,.14)}
.brand-mark span{font-style:normal}
.brand-word h1{font-family:var(--font-body);font-weight:600;font-size:clamp(24px,3vw,31px);letter-spacing:-.01em;color:var(--azul-marca)}
.brand-word h1 .accent{color:var(--azul-marca);font-style:normal}
.brand-word .domain{font-family:var(--font-body);font-size:12px;letter-spacing:.14em;color:var(--azul-marca);margin-top:5px;font-weight:400}

/* ── Navegación: banda pizarra de ancho completo con filete rojo ── */
nav{margin:0 -32px;padding:0 24px;gap:0;border-top:none;border-bottom:3px solid var(--rust);
  background:var(--steel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M0 6L6 0' stroke='%23fff' stroke-opacity='.035'/%3E%3C/svg%3E");
  position:sticky;top:0;z-index:60}
header{position:static}
nav a{font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:#fff;padding:14px 15px;border-right:none}
nav a::after{display:none}
nav a:hover,nav a.active{background:rgba(255,255,255,.08);color:#fff}
nav a.highlight{background:transparent;color:#fff}
nav a.nav-vigia{color:#fff}
nav a.nav-vigia .nav-badge{display:inline-block;margin-left:7px;padding:2px 6px 1px;background:var(--rust);color:#fff;font-size:9.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:2px;vertical-align:1px}
.nav-item>a .caret{opacity:.7}
.nav-dropdown{background:#fff;border:1px solid var(--border);border-top:3px solid var(--rust);box-shadow:0 14px 30px -12px rgba(0,0,0,.3);border-radius:0}
.nav-dropdown a{color:#222;font-size:13px;font-weight:400;padding:10px 16px;border-bottom:1px solid var(--border-soft);background:#fff}
.nav-dropdown a:hover{background:#f5f5f5;color:var(--rust)}
@media (hover:none){.nav-item.open>a{background:rgba(255,255,255,.1);color:#fff}}

/* ── Banda de cifras: gris claro, sin fondo negro ── */
.hero-band{background:#f0f0f0;border-bottom:1px solid var(--border);color:#222}
.hero-stat .num{font-family:var(--font-body);font-weight:600;color:#111}
.hero-stat .lbl{font-family:var(--font-body);color:#666;letter-spacing:.06em;font-size:8.5px}

/* ── Rótulos de sección: caja índigo apoyada sobre una línea ── */
.section-label{display:block;font-family:var(--font-body);font-size:12px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);border-bottom:2px solid var(--gold);padding:0;margin-bottom:22px;line-height:1.2}
.section-label::before,.section-label::after{display:none!important}
.section-label-caja{display:inline-block;background:var(--gold);color:#fff;padding:8px 12px 7px;vertical-align:bottom}

/* ── Tarjetas de notas: planas, separadas por filetes ── */
.notas-centrales,#grid-destacada{gap:0 28px}
.notas-centrales .nota-central,.nota-central{background:#fff;border:none;border-bottom:1px solid var(--border);border-radius:0;padding:22px 0 24px;box-shadow:none}
.notas-centrales .nota-central:hover{transform:none;box-shadow:none}
.nota-central.nota-featured{border-top:none;border-bottom:1px solid var(--border);padding:6px 0 28px;background:#fff}
.nota-cat,.nota-central.nota-featured .nota-cat,.nota-sec-cat{display:inline-block;background:var(--steel);color:#fff!important;font-family:var(--font-body);font-size:10px;font-weight:500;letter-spacing:.06em;padding:4px 8px 3px;margin-bottom:12px;line-height:1.35}
.nota-title,.nota-central.nota-featured .nota-title{font-family:var(--font-body);font-weight:500;color:#111;letter-spacing:-.005em;line-height:1.3;font-size:20px}
.nota-central.nota-featured .nota-title{font-size:clamp(22px,2.5vw,30px);font-weight:400;line-height:1.25}
.nota-central:hover .nota-title{color:var(--rust)}
.nota-sub,.nota-central.nota-featured .nota-sub{font-family:var(--font-body);color:#444;font-size:14.5px;line-height:1.7}
.nota-meta{font-family:var(--font-body);font-size:12px;letter-spacing:0;color:#777;text-transform:none}
.nota-impacto,.nota-central.nota-featured .nota-impacto{background:#f5f5f5;border:none;border-left:3px solid var(--rust);border-radius:0;color:#333;font-family:var(--font-body)}
.nota-impacto strong,.nota-central.nota-featured .nota-impacto strong{color:var(--rust);font-family:var(--font-body);letter-spacing:.06em;font-weight:600}
.read-arrow,.nota-central.nota-featured .read-arrow{color:var(--rust);font-family:var(--font-body);font-weight:500;letter-spacing:0;text-transform:none;font-size:13px}
.nota-sec{background:#fff;border:none;border-bottom:1px solid var(--border);border-top:none;border-radius:0;padding:18px 0;box-shadow:none}
.nota-sec:hover{box-shadow:none;border-top-color:transparent}
.nota-sec-title{font-family:var(--font-body);font-weight:500;color:#111}
.nota-sec:hover .nota-sec-title{color:var(--rust)}
.map-ref{font-family:var(--font-body);font-size:10.5px;letter-spacing:.02em;text-transform:none;border-radius:2px;color:var(--steel);background:#fff}

/* ── Widgets: cabecera pizarra con filete rojo ── */
.widget{border:1px solid var(--border);border-radius:0;box-shadow:none;background:#fff}
.widget-header{background:var(--steel);color:#fff;font-family:var(--font-body);font-size:12px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;border-bottom:3px solid var(--rust)!important}
.mapa-widget,.archivo-widget{border:1px solid var(--steel);box-shadow:none}

/* ── Vista de nota: miga de pan, H1 liviano, tablas cebradas ── */
.article-view{background:#fff}
.article-kicker{font-family:var(--font-body);font-size:12px;letter-spacing:0;text-transform:none;color:#888}
.article-kicker::before{content:'Inicio  ›  ';white-space:pre;color:#aaa}
.article-title{font-family:var(--font-body);font-weight:400;color:#111;letter-spacing:-.01em;line-height:1.25}
.article-sub{font-family:var(--font-body);color:#444;font-weight:300;font-style:normal;font-size:19px;line-height:1.6;border-left-color:var(--rust)}
.article-meta{font-family:var(--font-body);letter-spacing:0;text-transform:none}
.article-body{font-family:var(--font-body);color:#222;font-size:16.5px;line-height:1.8}
.article-body h2,#article-nota1 .article-body h2,#article-nota2 .article-body h2,#article-nota3 .article-body h2,#article-nota4 .article-body h2,#article-geopolitica .article-body h2{font-family:var(--font-body);font-weight:400;font-size:26px;color:#111;border:none;padding-top:8px}
.article-body h2::before{content:none!important}
.article-body h3{font-family:var(--font-body);font-weight:500}
.article-body p::first-letter{all:unset}
.article-body a,.article-notas li a{color:#1a56c7;text-decoration-color:rgba(26,86,199,.35)}
.article-body strong{font-weight:600}
.article-why{background:#f5f5f5;border:none;border-left:3px solid var(--rust);border-radius:0}
.article-why h3{font-family:var(--font-body);color:var(--rust);letter-spacing:.06em}
.article-body table.tabla-datos{background:#fff;border:none;font-family:var(--font-body)}
.article-body table.tabla-datos th{font-family:var(--font-body);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:#111;border-bottom:none}
.article-body table.tabla-datos tr:nth-child(odd) td{background:#f0f0f0}
.article-body table.tabla-datos td{border-bottom:none}
.article-body table.tabla-datos td:first-child{font-weight:600}
.article-body .cita-doc{border-left:3px solid var(--gold);background:#f5f5f5;font-style:normal}
.article-notas{border-top:2px solid var(--steel)}
.article-notas h3{font-family:var(--font-body);color:#111}
.article-close,.article-share,.article-listen{font-family:var(--font-body);border-radius:2px}
.article-close{background:var(--steel);color:#fff}

/* ── Pie: pizarra con trama, rótulos en caja índigo ── */
footer{position:relative;color:#fff;
  background:linear-gradient(180deg,rgba(35,45,53,.94),rgba(60,82,91,.93)),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%23fff' stroke-opacity='.16'%3E%3Cpath d='M-20 60c40-30 80 20 120-6s80-40 140 4'/%3E%3Cpath d='M-20 100c50-24 90 26 130-2s70-36 130 6'/%3E%3Cpath d='M-20 140c40-20 100 22 140-4s60-30 120 8'/%3E%3Cpath d='M-20 180c60-26 90 18 130-6s70-24 130 10'/%3E%3Cpath d='M-20 20c40-18 90 18 130-4s70-30 130 4'/%3E%3C/g%3E%3C/svg%3E"),#2b3740;}
footer h2,.footer-brand h2{font-family:var(--font-body);font-weight:600;font-size:26px;color:#fff;letter-spacing:-.01em}
footer h2 .accent,.footer-brand h2 .accent{color:#fff;font-style:normal}
.footer-contact .mail{font-family:var(--font-body);color:#fff;border-color:rgba(255,255,255,.35);border-radius:2px}
.footer-contact .mail:hover{background:rgba(255,255,255,.08);border-color:#fff}
.footer-social a{border-color:rgba(255,255,255,.35);color:#fff;border-radius:2px}
.footer-social a:hover{border-color:#fff;color:#fff;background:var(--rust)}
footer p{color:rgba(255,255,255,.82)}
.footer-col h4{display:block;font-family:var(--font-body);font-size:12px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:#fff;border-bottom:2px solid var(--gold);padding:0;margin-bottom:16px;background:none}
.footer-col h4 span{display:inline-block;background:var(--gold);padding:7px 11px 6px}
.footer-col a{font-family:var(--font-body);color:#fff;font-size:13.5px;position:relative;padding-left:14px}
.footer-col a::before{content:'';position:absolute;left:0;top:.72em;width:5px;height:5px;border-radius:50%;background:#fff}
.footer-col a:hover{color:#c9c6ff}
.footer-protocol{font-family:var(--font-body);color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.2)}
.footer-bottom{font-family:var(--font-body);color:#555;background:#fff;margin:36px -60px -40px;padding:16px 60px;border-top:none;letter-spacing:0;text-transform:none}
.footer-sede a,.footer-contact a{color:#fff}

@media(max-width:980px){nav{margin:0 -16px;padding:0 8px}}
@media(max-width:600px){
  header{padding:16px 14px 0}
  nav{margin:0 -14px;padding:0 4px}
  nav a{font-size:12.5px;padding:13px 10px;letter-spacing:0}
  .topbar{padding:6px 14px}
  .notas-centrales,#grid-destacada{grid-template-columns:1fr}
  .nota-central,.notas-centrales .nota-central{padding:18px 0}
  .footer-bottom{margin:28px -20px -24px;padding:14px 20px}
}

/* ── Página «Quién está detrás» y otras páginas sueltas ── */
body:not(:has(.brand-block)) h1{font-weight:400;letter-spacing:-.01em}
body:not(:has(.brand-block)) h2{font-weight:500}

/* ── Correcciones sobre bloques con fondo propio ── */
.nl-widget{background:var(--steel)!important;border:none!important}
.nl-widget .nl-btn{font-family:var(--font-body);letter-spacing:.06em}
.nl-widget .nl-btn:hover{background:#fff;color:var(--rust)}
.radar-top{background:var(--steel);border-bottom:3px solid var(--rust)}
.notas-centrales:not(#grid-destacada) .nota-central{border:none;border-bottom:1px solid var(--border);border-radius:0}
.nota-impacto strong:not(:first-child),.nota-central.nota-featured .nota-impacto strong:not(:first-child){display:inline;color:inherit;letter-spacing:0;font-size:inherit;text-transform:none;font-weight:600}

/* ═══ LECTURA EN TELÉFONOS ═══
   Los bloques de notas aparecían con un fundido que solo se disparaba cuando
   un 15 % del bloque entraba en pantalla. En un teléfono el bloque mide varios
   miles de píxeles y nunca alcanzaba esa proporción: las notas quedaban
   invisibles. Debajo de 980 px el contenido se muestra siempre. */
@media (max-width:980px){
  .reveal,.reveal-stagger,.reveal-stagger>*{opacity:1!important;transform:none!important}
  nav{position:static}
}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal-stagger,.reveal-stagger>*{opacity:1!important;transform:none!important;transition:none!important}
}
@media (max-width:600px){
  body{font-size:16px}
  .nota-title{font-size:19px}
  .nota-central.nota-featured .nota-title{font-size:23px}
  .nota-sub,.nota-central.nota-featured .nota-sub{font-size:15.5px;line-height:1.65}
  .nota-meta{font-size:12.5px;flex-wrap:wrap;gap:6px 10px}
  .nota-impacto,.nota-central.nota-featured .nota-impacto{font-size:14px;line-height:1.6}
  .nota-cat,.nota-central.nota-featured .nota-cat,.nota-sec-cat{font-size:10.5px;white-space:normal}
  .nota-sec-title{font-size:17px}
  .nota-sec-desc{font-size:14.5px;line-height:1.6}
  .hero-stat .lbl{font-size:9.5px}
  .hero-stat .num{font-size:13.5px}
  .section-label,.section-label-caja{font-size:12.5px;line-height:1.35}
  .widget-header{font-size:12px}
  .widget-body{font-size:14px}
  .indice-desc,.clasif-cat{font-size:14px}
  .footer-col a{font-size:15px;padding:6px 0 6px 14px}
  .footer-bottom{font-size:12.5px;flex-direction:column;gap:4px}
  .article-inner{padding:64px 18px 70px}
  .article-title{font-size:28px;line-height:1.2}
  .article-sub{font-size:17.5px}
  .article-body{font-size:17px;line-height:1.75}
  .article-body h2{font-size:22px}
  .article-notas li{font-size:14px}
  .article-close,.article-share,.article-listen{font-size:12px;letter-spacing:0;padding:9px 10px;top:12px}
  .article-close{right:12px}
  .article-share{right:104px}
  .article-listen{right:214px}
}
