/* Estilo común de lectura (artículos y Fuera de Bata). Todo estático: nada aparece ni desaparece al hacer scroll, salvo el aviso de fin de lectura. */
body{--c:16,224,161;--tl:18.5px;--txt:#d9d4cd}
.progreso{position:fixed;left:0;right:0;top:0;height:2px;z-index:45;background:rgb(var(--c));transform-origin:left;transform:scaleX(0);transition:height .6s,box-shadow .6s}
.progreso.fin{height:3px;box-shadow:0 0 16px rgba(var(--c),.9),0 0 4px rgb(var(--c));animation:latido 1.3s ease-in-out 2}
@keyframes latido{50%{opacity:.5}}
.leido{position:fixed;left:50%;bottom:28px;z-index:60;display:flex;align-items:center;gap:10px;padding:11px 18px 11px 14px;border-radius:999px;background:rgba(14,15,18,.94);border:1px solid rgba(var(--c),.35);box-shadow:0 18px 40px -16px #000,0 0 26px -8px rgba(var(--c),.6);font-size:14px;font-weight:500;color:var(--texto);opacity:0;transform:translate(-50%,14px) scale(.96);transition:opacity .45s var(--ease),transform .45s var(--ease);pointer-events:none}
.leido.on{opacity:1;transform:translate(-50%,0) scale(1)}
.leido svg{width:18px;height:18px;color:rgb(var(--c))}
.leido path{stroke-dasharray:24;stroke-dashoffset:24}
.leido.on path{transition:stroke-dashoffset .5s var(--ease) .2s;stroke-dashoffset:0}
@media (max-width:680px){.leido{bottom:calc(78px + env(safe-area-inset-bottom))}}
@media (prefers-reduced-motion:reduce){.progreso.fin{animation:none}.leido,.leido path{transition:none}}

/* cabecera */
.cab-art{padding:112px 0 0}
.cab-art .in{max-width:var(--ancho-cab,1000px);margin:0 auto;padding:0 28px}
.migas-l{display:flex;gap:8px;font-size:13px;color:var(--tenue)}
.migas-l a:hover{color:var(--texto)}
.migas-l b{color:rgb(var(--c));font-weight:500}
.cab-art h1{font-size:clamp(30px,3.4vw,46px);line-height:1.08;letter-spacing:-.04em;font-weight:600;margin:20px 0 18px;max-width:880px;text-wrap:balance}
.entradilla{font-size:clamp(17px,1.45vw,19.5px);line-height:1.55;color:#bfbab3;max-width:720px}
.firma{display:flex;align-items:center;gap:14px;margin-top:28px;padding:20px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);flex-wrap:wrap}
.firma img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.firma b{display:block;font-size:14.5px;font-weight:500}
.firma span{font-size:13px;color:var(--tenue)}
.firma .sep{width:1px;height:28px;background:var(--linea-2)}
.herr{margin-left:auto;display:flex;gap:6px}
.herr button{height:38px;min-width:38px;padding:0 10px;border-radius:10px;border:1px solid var(--linea-2);display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--segundo);font-size:13px;transition:color .2s,border-color .2s}
.herr button:hover{color:var(--texto);border-color:var(--linea-2)}

/* índice */
.indice{position:sticky;top:120px;align-self:start}
.indice small{display:block;font-size:13px;letter-spacing:-.005em;color:var(--tenue);margin-bottom:12px}
.indice a{display:block;padding:7px 0 7px 14px;border-left:1px solid var(--linea-2);font-size:13.5px;line-height:1.4;color:var(--tenue);transition:color .2s,border-color .2s}
.indice a:hover{color:var(--texto)}
.indice a.si{color:var(--texto);border-left-color:rgb(var(--c))}

/* texto */
.prosa{font-size:var(--tl);line-height:1.74;color:var(--txt);letter-spacing:-.003em}
.prosa p{margin:0 0 1.35em;text-wrap:pretty}
.prosa .lede{font-size:1.1em;line-height:1.62;color:#ebe7e1}
.prosa h2{font-size:clamp(22px,1.9vw,26px);line-height:1.25;letter-spacing:-.03em;color:var(--texto);font-weight:600;margin:2.4em 0 .8em;scroll-margin-top:110px;text-wrap:balance}
.prosa h2 small{display:block;font-size:12px;font-weight:500;letter-spacing:.12em;color:rgb(var(--c));margin-bottom:10px}
.prosa strong{color:var(--texto);font-weight:600}
.termino{color:var(--texto);border-bottom:1px solid rgba(var(--c),.5)}
.llamada{font-size:.62em;font-weight:600;color:rgb(var(--c));vertical-align:super;line-height:0;margin-left:1px}
.cita{margin:2em 0;padding:2px 0 2px 22px;border-left:2px solid rgb(var(--c))}
.cita p{margin:0;font-size:1.2em;line-height:1.45;letter-spacing:-.02em;color:var(--texto);font-weight:500}
.cita cite{display:block;margin-top:10px;font-style:normal;font-size:13.5px;color:var(--tenue)}
.fuente{display:inline-flex;align-items:center;gap:8px;margin:1.6em 0 0;font-size:14px;line-height:1.4;color:rgb(var(--c))}
.fuente::after{content:"\2197";font-size:13px}
.fuente:hover{text-decoration:underline}
.refs .como-citar{margin:0 0 12px;padding:12px 14px;border-radius:10px;background:var(--capa);border:1px solid var(--linea);font-size:13.5px}
.prosa h3{font-size:1.05em;line-height:1.35;color:var(--texto);font-weight:600;margin:1.8em 0 .6em}
.prosa ul,.prosa ol{margin:0 0 1.35em;padding-left:1.3em}
.prosa li{margin-bottom:.5em}

/* figuras y tablas: fijas, con pie */
.figura{margin:2em 0 2.2em;border:1px solid var(--linea-2);border-radius:14px;background:rgba(255,255,255,.015)}
.figura .zona{padding:24px 24px 18px}
.figura figcaption{padding:12px 24px 14px;border-top:1px solid var(--linea);font-size:13.5px;line-height:1.5;color:var(--segundo)}
.figura figcaption b{color:var(--texto);font-weight:500;margin-right:6px}
.barra-f{display:grid;grid-template-columns:150px minmax(0,1fr) 56px;gap:16px;align-items:center;padding:9px 0;font-size:14px}
.barra-f span{color:var(--segundo)}
.barra-f i{display:block;height:26px;border-radius:5px;width:var(--p)}
.barra-f .a{background:rgb(var(--c))}
.barra-f .b{background:rgba(255,255,255,.32)}
.barra-f b{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.eje-f{display:grid;grid-template-columns:150px minmax(0,1fr) 56px;gap:16px;font-size:11.5px;color:var(--tenue);font-variant-numeric:tabular-nums}
.eje-f div{display:flex;justify-content:space-between;border-top:1px solid var(--linea-2);padding-top:6px}
.curva-f{display:block;width:100%;max-width:520px;margin:0 auto;height:auto}
.tabla-w{overflow-x:auto}
.tabla{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.5}
.tabla th{text-align:left;font-size:13px;font-weight:500;letter-spacing:-.005em;color:var(--tenue);padding:0 14px 12px 0;border-bottom:1px solid var(--linea-2)}
.tabla td{padding:13px 14px 13px 0;border-bottom:1px solid var(--linea);vertical-align:top;color:var(--segundo)}
.tabla tr:last-child td{border-bottom:0}
.tabla td:first-child{color:var(--texto);font-weight:500;min-width:120px}
.tabla .num{text-align:right;font-variant-numeric:tabular-nums;color:var(--texto)}

.llevar{margin:2.4em 0 0;padding:22px 24px;border-radius:14px;background:rgba(var(--c),.06);border:1px solid rgba(var(--c),.22);scroll-margin-top:110px}
.llevar small{display:block;font-size:13px;letter-spacing:-.005em;color:rgb(var(--c));font-weight:500;margin-bottom:8px}
.llevar p{margin:0;font-size:.96em;line-height:1.65;color:var(--texto)}
.autor{display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:start;margin-top:2.4em;padding-top:1.6em;border-top:1px solid var(--linea)}
.autor img{width:52px;height:52px;border-radius:50%;object-fit:cover}
.autor small{font-size:13px;letter-spacing:-.005em;color:var(--tenue)}
.autor b{display:block;font-size:16px;font-weight:600;margin:2px 0 4px}
.autor p{margin:0 0 6px;font-size:14px;line-height:1.55;color:var(--segundo)}
.autor a{color:rgb(var(--c));font-size:14px}
.refs{margin-top:1.8em;font-size:14px;line-height:1.6;color:var(--segundo)}
.refs h3{font-size:13px;font-weight:500;letter-spacing:-.005em;color:var(--tenue);margin-bottom:10px}
.refs ol{margin:0;padding-left:1.3em}
.refs li{margin-bottom:6px}
.refs a{color:rgb(var(--c));word-break:break-word}

/* después de leer: sobrio, sin brillos */
.despues{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin-top:56px}
.caja-f{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:16px;background:var(--tarjeta);border:1px solid var(--linea-2)}
.caja-f small{font-size:13px;letter-spacing:-.005em;color:var(--tenue)}
.caja-f h3{font-size:18px;line-height:1.25;letter-spacing:-.02em}
.caja-f p{font-size:14.5px;color:var(--segundo);line-height:1.5;margin-bottom:10px}
.caja-f .boton{align-self:flex-start;margin-top:auto}
.caja-f .nota-a{font-size:11.5px;color:var(--tenue)}


@media (max-width:680px){
  body{--tl:17.5px}
  .cab-art{padding:88px 0 0}
  .cab-art .in{padding:0 16px}
  .cab-art h1{font-size:clamp(27px,7.4vw,33px)}
  .entradilla{font-size:16.5px}
  .firma .sep{display:none}
  .herr{margin-left:0;width:100%}
  .herr button{flex:1}
  .barra-f,.eje-f{grid-template-columns:96px minmax(0,1fr) 44px;gap:10px;font-size:13px}
  .figura .zona{padding:18px 16px 14px}
  .figura figcaption{padding:12px 16px}
  .tabla{font-size:13.5px}
  .llevar{padding:18px}
  .despues{grid-template-columns:minmax(0,1fr)}
}

/* rejilla de lectura: índice, texto y margen para notas */
.lectura{display:grid;grid-template-columns:180px minmax(0,640px) 200px;gap:56px;justify-content:center;max-width:1240px;margin:0 auto;padding:44px 28px 0}
.cuerpo-l{grid-column:2}
.nota{float:right;clear:right;width:200px;margin:.3em -256px 1em 0;font-size:13px;line-height:1.5;color:var(--tenue)}
.nota b{display:flex;gap:8px;align-items:baseline;color:var(--segundo);font-weight:500;font-size:13px;margin-bottom:2px}
.nota b i{font-style:normal;color:rgb(var(--c));font-size:11.5px}
.seguir{max-width:1000px;margin:0 auto;padding:64px 28px 20px}
.seguir-rej{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:1240px){.lectura{grid-template-columns:170px minmax(0,640px);gap:48px}.nota{float:none;width:auto;margin:-.4em 0 1.4em;padding-left:14px;border-left:1px solid var(--linea-2)}}
@media (max-width:1020px){.seguir-rej{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.lectura{grid-template-columns:minmax(0,1fr)}.indice{display:none}.cuerpo-l{grid-column:1}}
@media (max-width:680px){.lectura{padding:30px 16px 0}.seguir{padding:44px 16px 10px}.seguir-rej{grid-template-columns:minmax(0,1fr);gap:12px}}

/* más tipos de figura */
.cifras-f{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.cifras-f div{padding:4px 18px}
.cifras-f div:first-child{padding-left:0}
.cifras-f div+div{border-left:1px solid var(--linea)}
.cifras-f b{display:block;font-size:26px;font-weight:600;letter-spacing:-.035em;line-height:1.05;color:var(--texto);font-variant-numeric:tabular-nums}
.cifras-f span{display:block;font-size:13.5px;line-height:1.4;color:var(--segundo);margin-top:8px}
.cadena-f{display:flex;align-items:stretch;gap:0}
.cadena-f div{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:14px 12px;border-radius:10px;border:1px solid var(--linea-2);font-size:14px;line-height:1.35;color:var(--texto);background:var(--capa)}
.cadena-f div:last-child{border-color:rgba(var(--c),.45);background:rgba(var(--c),.07)}
.cadena-f i{flex:none;width:30px;display:grid;place-items:center;color:rgb(var(--c));font-style:normal}
.apilada-f .barra-a{display:flex;height:30px;border-radius:6px;overflow:hidden}
.apilada-f .barra-a span{display:block;height:100%}
.apilada-f .barra-a span:first-child{background:rgb(var(--c))}
.apilada-f .barra-a span+span{background:rgba(255,255,255,.3)}
.leyenda-f{display:flex;gap:22px;flex-wrap:wrap;margin-top:12px;font-size:13.5px;color:var(--segundo)}
.leyenda-f span{display:inline-flex;align-items:center;gap:8px}
.leyenda-f i{width:10px;height:10px;border-radius:3px;background:rgba(255,255,255,.3)}
.leyenda-f span:first-child i{background:rgb(var(--c))}
.leyenda-f b{color:var(--texto);font-weight:600;font-variant-numeric:tabular-nums}
.puntos-f{display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:6px;max-width:460px}
.puntos-f i{aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.18)}
.puntos-f i.si{background:rgb(var(--c))}
@media (max-width:680px){
  .cifras-f{grid-template-columns:minmax(0,1fr)}
  .cifras-f div{padding:12px 0}
  .cifras-f div+div{border-left:0;border-top:1px solid var(--linea)}
  .cadena-f{flex-direction:column}
  .cadena-f i{width:auto;height:26px;transform:rotate(90deg)}
  .puntos-f{grid-template-columns:repeat(10,minmax(0,1fr))}
}

/* columnas verticales */
.cols-f{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:14px;align-items:end;height:230px;max-width:560px;margin:0 auto}
.cols-f div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:8px;text-align:center}
.cols-f b{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.cols-f i{display:block;width:100%;max-width:64px;height:var(--p);border-radius:5px 5px 2px 2px}
.cols-f i.a{background:rgb(var(--c))}
.cols-f i.b{background:rgba(255,255,255,.3)}
.cols-f span{font-size:12.5px;line-height:1.3;color:var(--segundo);min-height:2.6em}
.cifras-f{grid-template-columns:repeat(var(--n,3),minmax(0,1fr))}
.apilada-f .ap-tit{margin:0 0 6px;font-size:13.5px;color:var(--segundo)}
.apilada-f .barra-a+.ap-tit{margin-top:14px}
/* guía y libro al terminar */
.caja-ad{background:radial-gradient(120% 90% at 100% 0%,rgba(var(--g),.12),transparent 60%),var(--tarjeta);border-color:rgba(var(--g),.28)}
.caja-ad .ad-estado{font-size:13px;color:rgb(var(--g))}
.caja-ad .aviso{flex-direction:column;max-width:none;margin-top:auto}
.caja-ad .aviso .boton{width:100%}
.caja-ad .aviso input{flex:none;height:46px}
.caja-ad .nota-a a{text-decoration:underline}
.aviso-err{font-size:13px;color:#f87171;margin:6px 0 0}
.caja-libro{flex-direction:row;align-items:flex-start;gap:18px}
.caja-libro>div{display:flex;flex-direction:column;gap:8px;min-width:0;height:100%}
.caja-libro .portada-l{width:84px;flex:none;border-radius:4px;object-fit:cover;box-shadow:0 10px 30px -10px rgba(0,0,0,.8)}
.caja-libro .lib-autor{font-size:13.5px;color:var(--segundo);margin-top:-4px}
.caja-libro p{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:680px){
  .cols-f{height:200px;gap:8px}
  .cols-f span{font-size:11.5px}
  .cifras-f{grid-template-columns:minmax(0,1fr)}
  .caja-libro .portada-l{width:64px}
}
.apilada-f .barra-a span:nth-child(3){background:rgba(255,255,255,.13)}
.leyenda-f span:nth-child(3) i{background:rgba(255,255,255,.13)}
.leyenda-f span:nth-child(4) i{background:rgba(var(--c),.4)}
.apilada-f .barra-a span:nth-child(4){background:rgba(var(--c),.4)}

/* preguntas frecuentes al final del artículo (las mismas que van en los datos estructurados) */
.faq-art{max-width:var(--ancho-prosa,720px);margin:8px auto 56px;padding:0 28px}
.faq-art h2{font-size:22px;letter-spacing:-.025em;margin-bottom:14px}
.faq-art details{border-top:1px solid var(--linea)}
.faq-art details:last-child{border-bottom:1px solid var(--linea)}
.faq-art summary{list-style:none;cursor:pointer;padding:16px 32px 16px 0;position:relative;font-weight:500;color:var(--texto)}
.faq-art summary::-webkit-details-marker{display:none}
.faq-art summary::after{content:"";position:absolute;right:6px;top:50%;width:9px;height:9px;border-right:1.6px solid var(--tenue);border-bottom:1.6px solid var(--tenue);transform:translateY(-70%) rotate(45deg);transition:transform .25s var(--ease)}
.faq-art details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq-art details p{color:var(--segundo);padding:0 0 18px;font-size:15.5px;line-height:1.6}
@media (max-width:680px){.faq-art{padding:0 16px;margin-bottom:40px}}
