/* ═══════════════════════════════════════════════════════════════
   ZONA DOGSO · ARTÍCULO
   1 Cabecera · 2 Marco e índice · 3 Prosa · 4 Bloques
   5 Gráficos · 6 Tablas · 7 Fuentes, etiquetas y compartir
   El texto corre a ~68 caracteres por línea (--medida). Gráficos,
   tablas y cifras salen de esa columna hasta --ancho para respirar.
   ═══════════════════════════════════════════════════════════════ */

.art{--medida:720px;--ancho:1040px}

/* ── 1 · CABECERA ───────────────────────────────────────────── */
.art__cab{max-width:calc(var(--ancho) + var(--gut) * 2);margin-inline:auto;padding:32px var(--gut) 28px;display:grid;gap:16px;
  justify-items:start}
.art__tit{font-size:clamp(2rem,5.4vw,3.5rem);line-height:1.06;letter-spacing:-.032em;max-width:22ch}
.art__ent{font-size:clamp(1.1875rem,2.1vw,1.4375rem);line-height:1.45;color:var(--tinta-2);max-width:56ch}
.art__firma{display:grid;gap:10px;width:100%;margin-top:8px;padding-top:18px;border-top:1px solid var(--linea)}
.art__autor{font:500 .9375rem var(--titular);color:var(--tinta-2)}
.art__autor b{color:var(--marino);font-weight:800}
@media (min-width:860px){
  .art__cab{padding-top:56px}
  .art__firma{grid-template-columns:1fr auto;align-items:center}
  .art__firma .compartir{grid-row:1/3;grid-column:2}
}

.art__portada{max-width:calc(var(--ancho) + 120px + var(--gut) * 2);margin:0 auto 40px;padding-inline:var(--gut)}
.art__portada .pt{aspect-ratio:5/2}
.art__portada figcaption{margin-top:8px;font-size:.8125rem;color:var(--tinta-3)}
@media (max-width:719.98px){
  .art__portada{padding-inline:0}
  .art__portada .pt{border-radius:0;aspect-ratio:16/10}
  .art__portada figcaption{padding-inline:var(--gut)}
}

/* ── 2 · MARCO E ÍNDICE ─────────────────────────────────────── */
.art__marco{max-width:calc(var(--ancho) + var(--gut) * 2);margin-inline:auto;padding-inline:var(--gut)}

.indice{max-width:var(--medida);margin:0 auto 32px}
.indice details{border:1px solid var(--linea);border-radius:var(--radio);background:var(--papel-2)}
.indice summary{padding:14px 18px;cursor:pointer;font:800 .75rem/1 var(--titular);letter-spacing:.14em;text-transform:uppercase;
  color:var(--marino);list-style:none;display:flex;justify-content:space-between}
.indice summary::-webkit-details-marker{display:none}
.indice summary::after{content:'+';font-size:1.125rem;line-height:.6}
.indice details[open] summary::after{content:'−'}
.indice ol{list-style:none;counter-reset:i;padding:0 18px 16px;display:grid;gap:2px}
.indice li{counter-increment:i}
.indice a{display:grid;grid-template-columns:2.2ch 1fr;gap:8px;padding:6px 0;font:600 .9375rem/1.35 var(--texto);
  color:var(--tinta-2);text-decoration:none}
.indice a::before{content:counter(i,decimal-leading-zero);font:800 .75rem/1.8 var(--titular);color:var(--tinta-3)}
.indice a:hover,.indice a.es-actual{color:var(--azul)}
.indice a.es-actual::before{color:var(--azul)}

/* En pantallas anchas el índice se queda fijo a la izquierda del texto. */
@media (min-width:1280px){
  .art__marco.con-indice{max-width:none;display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,var(--ancho)) minmax(0,1fr);gap:0 40px}
  .con-indice .indice{grid-column:1;justify-self:end;width:min(240px,100%);margin:0;max-width:none}
  .con-indice .indice details{position:sticky;top:96px;border:0;background:none}
  .con-indice .indice summary{padding:0 0 12px;border-bottom:2px solid var(--marino);pointer-events:none}
  .con-indice .indice summary::after{display:none}
  .con-indice .indice ol{padding:10px 0 0}
  .con-indice .indice a{font-size:.875rem}
  .con-indice .prosa{grid-column:2}
}

/* ── 3 · PROSA ──────────────────────────────────────────────── */
.prosa{font-size:clamp(1.0625rem,1.2vw + .7rem,1.1875rem);line-height:1.68;color:var(--tinta)}
.prosa>*{max-width:var(--medida);margin-inline:auto}
.prosa>*+*{margin-top:1.15em}
.prosa>.ancho{max-width:var(--ancho);margin-block:2em}
.prosa h2{margin-top:2.2em;font-size:clamp(1.5rem,2.6vw,1.875rem);letter-spacing:-.025em}
.prosa h3{margin-top:1.8em;font-size:clamp(1.1875rem,1.8vw,1.375rem);letter-spacing:-.015em}
.prosa h2+*,.prosa h3+*{margin-top:.6em}
.prosa a{color:var(--azul);text-decoration-thickness:1px;text-underline-offset:3px}
.prosa a:hover{text-decoration-thickness:2px}
.prosa strong{font-weight:700;color:var(--marino)}
.prosa ul,.prosa ol{padding-left:1.3em}
.prosa li+li{margin-top:.4em}
.prosa li::marker{color:var(--azul);font-weight:700}
.prosa blockquote{padding-left:20px;border-left:3px solid var(--azul);color:var(--tinta-2);font-style:italic}
.prosa hr{border:0;height:1px;background:var(--linea);margin-block:2.5em}
.prosa img{border-radius:var(--radio)}
.prosa :not(pre)>code{padding:.1em .35em;border-radius:4px;background:var(--papel-3);font-size:.88em}
.prosa h2[id],.prosa h3[id]{scroll-margin-top:96px}

/* ── 4 · BLOQUES ────────────────────────────────────────────── */
.bloque__rotulo{margin-bottom:12px;font:800 .6875rem/1 var(--titular);letter-spacing:.14em;text-transform:uppercase;color:var(--azul)}
.prosa>.bloque{margin-block:2em}

/* Resumen ejecutivo: tarjeta marino, lo primero que ve quien tiene prisa. */
.resumen{padding:24px 26px;border-radius:var(--radio);background:var(--marino);color:rgba(255,255,255,.92);font-size:.95em}
.resumen .bloque__rotulo{color:var(--cian)}
.resumen ul{display:grid;gap:10px;padding:0;list-style:none}
.resumen li{position:relative;padding-left:22px}
.resumen li::before{content:'';position:absolute;left:0;top:.62em;width:8px;height:8px;background:var(--cian)}
.resumen li+li{margin-top:0}
.resumen strong{color:#fff}
.resumen a{color:#9DB8FF}

/* Cifras clave: marcador de 2 a 4 números. */
.cifras dl{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.cifra{display:flex;flex-direction:column;gap:8px;padding:20px 22px;background:#fff}
.cifra dt{order:2;font:600 .9375rem/1.35 var(--texto);color:var(--tinta-2)}
.cifra dd{order:1;font:900 clamp(2rem,4.2vw,2.75rem)/1 var(--titular);letter-spacing:-.035em;color:var(--marino);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.cifra p{order:3;font-size:.8125rem;line-height:1.4;color:var(--tinta-3)}
.cifra.es-principal{background:var(--marino)}
.cifra.es-principal dd{color:var(--oro)}
.cifra.es-principal dt{color:rgba(255,255,255,.85)}
.cifra.es-principal p{color:rgba(255,255,255,.6)}
.bloque__fuente{margin-top:8px;font-size:.8125rem;color:var(--tinta-3)}

/* Cita destacada. */
.cita{padding:8px 0 8px 28px;border-left:4px solid var(--azul)}
.cita blockquote{padding:0;border:0;font:700 clamp(1.25rem,2.4vw,1.625rem)/1.32 var(--titular);letter-spacing:-.015em;
  color:var(--marino);font-style:normal}
.cita blockquote p+p{margin-top:.6em}
.cita figcaption{margin-top:12px;font-size:.9375rem;color:var(--tinta-3)}
.cita figcaption b{color:var(--tinta);font-weight:700}

.conclusiones{padding:24px 26px;border-top:4px solid var(--marino);background:var(--papel-2);border-radius:0 0 var(--radio) var(--radio)}
.conclusiones ol{padding-left:1.4em}
.conclusiones li::marker{font-family:var(--titular);font-weight:800}

.nota-met{padding:18px 20px;border:1px dashed var(--linea-2);border-radius:var(--radio);font-size:.875em;color:var(--tinta-2)}
.nota-met .bloque__rotulo{color:var(--tinta-3)}
.nota-met p+p{margin-top:.6em}

.descarga{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;align-items:center;padding:16px 18px;
  border:1.5px solid var(--linea);border-radius:var(--radio);text-decoration:none;transition:border-color .2s,box-shadow .2s}
.prosa a.descarga{color:inherit;text-decoration:none}
.descarga:hover{border-color:var(--azul);box-shadow:var(--sombra)}
.descarga__icono{grid-row:span 2;display:grid;place-items:center;width:48px;height:56px;border-radius:4px;background:var(--marino);
  color:#fff;font:800 .75rem var(--titular);letter-spacing:.06em}
.descarga__txt{display:grid;gap:2px;line-height:1.35}
.descarga__txt b{font:800 1rem var(--titular);color:var(--marino)}
.descarga__txt span{font-size:.875rem;color:var(--tinta-3)}
.descarga__accion{font:700 .8125rem var(--titular);color:var(--azul)}
@media (min-width:600px){.descarga{grid-template-columns:auto 1fr auto}.descarga__icono{grid-row:auto}}

.externo iframe{width:100%;border:0}

.bloque--error{padding:14px 16px;border-radius:var(--radio);background:#FEF3F2;color:#912018;font-size:.9375rem;border:1px solid #FECDCA}

/* ── 5 · GRÁFICOS ───────────────────────────────────────────── */
.graf{padding:22px clamp(16px,3vw,28px) 18px;border:1px solid var(--linea);border-radius:var(--radio);background:#fff}
.graf__cab{display:grid;gap:4px;margin-bottom:18px}
.graf__cab strong{font:800 clamp(1.0625rem,1.8vw,1.25rem)/1.25 var(--titular);color:var(--marino);letter-spacing:-.015em}
.graf__cab span{font-size:.9375rem;color:var(--tinta-3);line-height:1.4}
.graf__leyenda{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:14px;font:600 .8125rem var(--texto);color:var(--tinta-2)}
.graf__leyenda li+li{margin-top:0}
.graf__leyenda li{display:flex;align-items:center;gap:7px}
.graf__leyenda i{width:12px;height:12px;border-radius:2px}
.graf__nota{margin-top:14px;font-size:.875rem;color:var(--tinta-2);line-height:1.45}
.graf__pie{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:12px;padding-top:12px;border-top:1px solid var(--linea);
  font-size:.8125rem;color:var(--tinta-3);line-height:1.4}
.graf__pie b{font-weight:700;color:var(--tinta-2)}
.graf__pie a{color:inherit}
.graf__datos{margin-top:10px;font-size:.875rem}
.graf__datos summary{cursor:pointer;font:700 .8125rem var(--titular);color:var(--azul);width:max-content}
.graf__datos .tabla-scroll{margin-top:10px}

/* Barras horizontales: etiqueta | pista. El valor va al final de la
   barra; si es negativo, a su izquierda. */
.graf__barras{display:grid;gap:12px}
.graf__fila{display:grid;gap:6px}
.graf__etq{font:700 .875rem/1.2 var(--titular);color:var(--marino)}
.graf__pistas{display:grid;gap:4px}
.graf__pista{position:relative;height:26px;margin-inline:0 6.5em}
.graf__pistas.es-multi .graf__pista{height:18px}
.graf__barra{position:absolute;top:0;bottom:0;border-radius:2px}
.graf__barras::before{content:none}
.graf__pista::before{content:'';position:absolute;top:-4px;bottom:-4px;left:var(--cero);width:1.5px;background:var(--tinta-3);opacity:.6}
.graf__valor{position:absolute;top:50%;transform:translateY(-50%);padding:0 6px;font:800 .8125rem var(--titular);color:var(--marino);
  white-space:nowrap;font-variant-numeric:tabular-nums}
.graf__fila.es-destacada .graf__etq,.graf__fila.es-destacada .graf__valor{color:var(--azul)}
.graf__barras.con-neg .graf__pista{margin-inline:6.5em}
@media (min-width:640px){
  .graf__fila{grid-template-columns:minmax(110px,22%) 1fr;align-items:center;gap:14px}
  .graf__etq{text-align:right}
}

/* Lienzo con eje Y: columnas y líneas. */
.graf__lienzo{position:relative;height:clamp(220px,40vw,320px);margin-left:3.2em;margin-top:8px}
.graf__eje{position:absolute;inset:0}
.graf__linea{position:absolute;left:0;right:0;height:0;border-top:1px solid var(--linea)}
.graf__linea--cero{border-top:1.5px solid var(--tinta-3)}
.graf__linea b{position:absolute;right:calc(100% + 8px);top:0;transform:translateY(-50%);font:600 .75rem var(--texto);
  color:var(--tinta-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.graf__grupos{position:absolute;inset:0;display:flex;gap:clamp(6px,2%,20px);padding-inline:clamp(4px,2%,16px)}
.graf__grupo{flex:1;display:flex;gap:3px;position:relative}
.graf__col{flex:1;position:relative}
.graf__col::before{content:'';position:absolute;left:0;right:0;bottom:var(--b);height:var(--h);background:var(--c);border-radius:2px 2px 0 0}
.graf__col b{position:absolute;left:50%;bottom:calc(var(--b) + var(--h) + 4px);transform:translateX(-50%);font:800 .75rem var(--titular);
  color:var(--marino);white-space:nowrap;font-variant-numeric:tabular-nums}
.graf__col b.es-neg{bottom:auto;top:calc(100% - var(--b) + 4px)}
.graf__x{display:flex;gap:clamp(6px,2%,20px);margin-left:3.2em;padding:8px clamp(4px,2%,16px) 0;font:600 .75rem/1.25 var(--texto);
  color:var(--tinta-2);text-align:center}
.graf__x span{flex:1;min-width:0;overflow-wrap:anywhere}
.graf__x--abs{position:relative;height:2.4em;padding:0}
.graf__x--abs span{position:absolute;top:8px;transform:translateX(-50%);white-space:nowrap;flex:none}
.graf__x--abs span:first-child{transform:none}
.graf__x--abs span:last-child{transform:translateX(-100%)}

.graf__trazo{position:absolute;inset:0}
.graf__trazo svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.graf__punto{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:#fff;border:2.5px solid var(--c)}
.graf__punto b{position:absolute;right:calc(100% + 6px);bottom:calc(100% + 2px);font:800 .8125rem var(--titular);color:var(--marino);
  white-space:nowrap;background:rgba(255,255,255,.85);padding:1px 4px;border-radius:3px}
.graf__punto.es-ultimo{width:12px;height:12px;margin:-6px 0 0 -6px;background:var(--c)}

/* ── 6 · TABLAS ─────────────────────────────────────────────── */
/* En móvil la tabla se desplaza dentro de su caja; la primera columna
   se queda fija para no perder de qué fila hablamos. */
.tabla-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--linea);border-radius:var(--radio)}
.tabla-scroll table{width:100%;min-width:max-content;font-size:.9375rem;line-height:1.35;font-variant-numeric:tabular-nums}
.tabla-scroll th,.tabla-scroll td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--linea);white-space:nowrap}
.tabla-scroll thead th{background:var(--marino);color:#fff;font:700 .8125rem/1.3 var(--titular);letter-spacing:.01em;white-space:normal;min-width:6.5em;vertical-align:bottom}
.tabla-scroll tbody tr:nth-child(even){background:var(--papel-2)}
.tabla-scroll tbody tr:last-child>*{border-bottom:0}
.tabla-scroll td,.tabla-scroll thead th{text-align:right}
.tabla-scroll thead th:first-child{text-align:left}
.tabla-scroll td:first-child,.tabla-scroll tbody th{text-align:left;font-weight:700;color:var(--marino)}
.tabla-scroll tbody th,.tabla-scroll td:first-child{position:sticky;left:0;background:inherit}
.tabla-scroll tbody tr{background:#fff}

/* ── 7 · FUENTES, ETIQUETAS Y COMPARTIR ─────────────────────── */
.fuentes{margin-top:3em;padding-top:20px;border-top:2px solid var(--marino)}
.fuentes__tit{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}
.prosa .fuentes h2{margin-top:0;font-size:.75rem;letter-spacing:.14em}
.fuentes ol{margin-top:12px;padding-left:1.4em;font-size:.9375rem;line-height:1.5;color:var(--tinta-2)}
.fuentes li+li{margin-top:.5em}
.fuentes span{color:var(--tinta-3)}

.art__pie{display:grid;gap:20px;margin-top:2.5em;padding-top:20px;border-top:1px solid var(--linea)}
.etiquetas{display:flex;flex-wrap:wrap;gap:8px}
.prosa .etiquetas{padding:0}
.prosa .etiquetas li+li{margin-top:0}
.etiquetas a{display:inline-block;padding:7px 12px;border-radius:999px;background:var(--papel-3);font:700 .8125rem var(--titular);
  color:var(--marino);text-decoration:none}
.etiquetas a:hover{background:var(--azul);color:#fff}

.compartir{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.compartir__rot{margin-right:4px;font:800 .6875rem var(--titular);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
.compartir__btn{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 14px;border:1.5px solid var(--linea);
  border-radius:999px;background:#fff;font:700 .8125rem var(--titular);color:var(--marino);text-decoration:none;
  transition:border-color .2s,color .2s}
.prosa a.compartir__btn{color:var(--marino);text-decoration:none}
.compartir__btn:hover{border-color:var(--azul);color:var(--azul)}
.compartir__btn.es-ok{border-color:#12B76A;color:#067647}
.compartir__nativo{padding:0;width:40px;justify-content:center}
@media (max-width:479.98px){.compartir__rot{display:none}}

.art--inv .kicker{color:var(--oro-txt)}

/* Figura: imagen con pie, fuente y fecha. */
.figura{display:grid;gap:10px}
.figura__tit{font:800 clamp(1.0625rem,1.8vw,1.25rem)/1.25 var(--titular);color:var(--marino);letter-spacing:-.015em}
.figura img{width:100%;border:1px solid var(--linea);border-radius:var(--radio);background:#fff}
.prosa>.figura.ancho{max-width:760px}
.figura figcaption{display:grid;gap:4px;font-size:.875rem;line-height:1.45;color:var(--tinta-2)}
.figura__fuente{font-size:.8125rem;color:var(--tinta-3)}
.figura__fuente b{color:var(--tinta-2)}

/* Barras apiladas: cada trozo es una parte del total. */
.graf--apiladas .graf__trozo{border-radius:0}
.graf--apiladas .graf__trozo+.graf__trozo{box-shadow:inset 1.5px 0 0 #fff}

.art__original{font-size:.875rem;color:var(--tinta-3);padding:8px 12px;border-left:3px solid var(--azul);background:var(--papel-2)}
.art__original a{color:var(--azul)}