/* Lectura de las entradas del blog (inc/lectura.php): el texto a 720 px y, en pantallas anchas, el índice a la
   izquierda y, a la derecha, el simulador y la unidad (fijos al bajar) y lo demás debajo. Por debajo de 1.240 px, la
   entrada queda en una sola columna. */
.stt-lectura{--stt-stone:var(--wp--preset--color--stone,#E8E8E3);--stt-ink:var(--wp--preset--color--ink,#0B1B2B);--stt-muted:var(--wp--preset--color--muted,#5B6675);--stt-brand:var(--wp--preset--color--brand,#10B981);--stt-bg:var(--wp--preset--color--bg,#FAFAF7)}
.stt-lectura-texto{max-width:720px;margin-inline:auto}
.stt-lectura-indice,.stt-lectura-lado{display:none}

/* La letra del texto: 17 px en el móvil (la tipografía fluida del tema la bajaba a 14,2 px) y 18 px desde 900 px. La
   entradilla de cada artículo trae la suya en línea (font-size:1.0625rem): se iguala a la del texto. */
.single-post .wp-block-post-content{font-size:1.0625rem}
@media (min-width:900px){
	.single-post .wp-block-post-content{font-size:1.125rem}
	.stt-lectura-texto p[style*="font-size:1.0625rem"]{font-size:1.125rem !important}
}

/* Los títulos de apartado: el tamaño lo pone theme.json (el h2 y el h3, arreglados el 26-oct); aquí, solo el aire. */
.stt-lectura-texto h2{margin:2.6rem 0 .8rem;scroll-margin-top:1.5rem}
.stt-lectura-texto h3{margin:1.8rem 0 .5rem;scroll-margin-top:1.5rem}

/* En pantallas estrechas: el índice plegado antes del primer apartado y compartir al final. */
.stt-indice-movil{margin:1.8rem 0;border:1px solid var(--stt-stone);border-radius:12px;background:#fff;font-family:var(--wp--preset--font-family--sans,sans-serif)}
.stt-indice-movil summary{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;font-size:.95rem;font-weight:600;color:var(--stt-ink);cursor:pointer;list-style:none}
.stt-indice-movil summary::-webkit-details-marker{display:none}
.stt-indice-movil summary span{font-size:.78rem;font-weight:400;color:var(--stt-muted)}
.stt-indice-movil summary::after{content:"";margin-left:auto;width:.5rem;height:.5rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s ease}
.stt-indice-movil[open] summary::after{transform:rotate(-135deg)}
.stt-indice-movil ol{margin:0;padding:0 1rem 1rem 2.3rem;font-size:.92rem;line-height:1.4}
.stt-indice-movil li{margin:.35rem 0}
.stt-indice-movil a{color:var(--stt-ink);text-decoration:none}
.stt-compartir-movil{margin:2.6rem 0 0;padding:1.1rem 1.2rem 1.2rem;border:1px solid var(--stt-stone);border-radius:12px;background:#fff;font-family:var(--wp--preset--font-family--sans,sans-serif)}
.stt-compartir-movil .stt-lado-compartir a,.stt-compartir-movil .stt-lado-compartir button{font-size:.9rem;padding:.7rem 1.1rem}

@media (min-width:1240px){
	.stt-indice-movil,.stt-compartir-movil{display:none}
	.stt-lectura{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,720px) minmax(0,1fr);column-gap:2.5rem;align-items:start}
	.stt-lectura-texto{grid-column:2;grid-row:1;max-width:none;margin:0;min-width:0}
	.stt-lectura-indice,.stt-lectura-lado{display:block;grid-row:1;font-family:var(--wp--preset--font-family--sans,sans-serif)}
	.stt-lectura-indice{grid-column:1;justify-self:end;width:100%;max-width:220px;position:sticky;top:2rem;max-height:calc(100vh - 4rem);overflow-y:auto}
	/* La columna derecha ocupa todo el alto del artículo, para que su bloque de arriba se quede fijo hasta el final. */
	.stt-lectura-lado{grid-column:3;justify-self:start;align-self:stretch;width:100%;max-width:240px}
	/* Fijo desde el borde de arriba, con fondo: lo de debajo pasa por detrás al bajar y no asoma por encima. */
	.stt-lado-fijo{position:sticky;top:0;z-index:1;margin-top:-2rem;padding:2rem 0 .4rem;background:var(--stt-bg)}
	.stt-lado-fijo::after{content:"";position:absolute;left:0;right:0;top:100%;height:1.6rem;background:linear-gradient(var(--stt-bg),rgba(250,250,247,0));pointer-events:none}
	/* El simulador incrustado (.stt-embed, 1.180 px) va por encima de las dos columnas, y la que toca se aparta mientras
	   lo tiene encima (clase .apartada, desde inc/lectura.php): así no se ven cortadas. */
	.stt-lectura .stt-embed{position:relative;z-index:2}
	.stt-lectura-indice,.stt-lectura-lado{transition:opacity .2s ease,visibility .2s}
	.stt-lectura-indice.apartada,.stt-lectura-lado.apartada{opacity:0;visibility:hidden}
}

.stt-lectura-rotulo{margin:0 0 .6rem;font-family:var(--wp--preset--font-family--mono,monospace);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--stt-muted)}

.stt-lectura-indice ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--stt-stone)}
.stt-lectura-indice li{margin:0}
.stt-lectura-indice a{display:block;margin-left:-2px;padding:.32rem 0 .32rem .85rem;border-left:2px solid transparent;font-size:.82rem;line-height:1.35;color:var(--stt-muted);text-decoration:none;transition:color .15s ease,border-color .15s ease}
.stt-lectura-indice a:hover{color:var(--stt-ink)}
.stt-lectura-indice a.activo{color:var(--stt-ink);font-weight:600;border-left-color:var(--stt-brand)}

/* Arriba: el simulador y la unidad */
.stt-lado-fijo .stt-lectura-rotulo:not(:first-child){margin-top:1.2rem}
.stt-lado-sim,.stt-lado-unidad{display:block;border:1px solid var(--stt-stone);border-radius:12px;background:#fff;text-decoration:none;color:var(--stt-ink);transition:border-color .15s ease,box-shadow .15s ease}
.stt-lado-sim:hover,.stt-lado-unidad:hover{border-color:var(--stt-brand);box-shadow:0 6px 18px rgba(11,27,43,.08)}
.stt-lado-sim img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:contain;background:#f5f7fa;border-radius:11px 11px 0 0}
.stt-lado-t{display:block;padding:.75rem .9rem .2rem;font-size:.92rem;font-weight:600;line-height:1.3}
.stt-lado-cta{display:block;padding:0 .9rem .8rem;font-size:.8rem;font-weight:600;color:var(--stt-brand)}
.stt-lado-unidad .stt-lado-t{padding-top:.7rem}

/* Debajo: más artículos, compartir, «Sobre mí», las unidades y los simuladores */
.stt-lado-bloque{margin-top:1.8rem}
.stt-lado-grupo{margin:.85rem 0 .15rem;font-size:.74rem;font-weight:600;color:var(--stt-ink)}
.stt-lado-lista{list-style:none;margin:0;padding:0}
.stt-lado-lista li{margin:0}
.stt-lado-lista a{display:block;padding:.17rem 0;font-size:.8rem;line-height:1.35;color:var(--stt-muted);text-decoration:none}
.stt-lado-lista a:hover{color:var(--stt-ink);text-decoration:underline}
.stt-lado-lista li.actual a{color:var(--stt-ink);font-weight:600}
.stt-lado-mas .stt-lado-lista a{padding:.3rem 0;font-size:.85rem;color:var(--stt-ink)}
.stt-lado-compartir{display:flex;flex-wrap:wrap;gap:.4rem}
.stt-lado-compartir a,.stt-lado-compartir button{font:inherit;font-size:.78rem;font-weight:600;line-height:1.2;padding:.4rem .75rem;border-radius:999px;border:1px solid var(--stt-stone);background:#fff;color:var(--stt-ink);text-decoration:none;cursor:pointer;transition:border-color .15s ease}
.stt-lado-compartir a:hover,.stt-lado-compartir button:hover{border-color:var(--stt-brand)}
.stt-lado-autor a{display:flex;gap:.75rem;align-items:flex-start;font-size:.8rem;line-height:1.45;color:var(--stt-muted);text-decoration:none}
.stt-lado-autor strong{color:var(--stt-ink)}
.stt-lado-autor img{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover}
.stt-lado-autor .stt-lado-cta{display:inline;padding:0}

/* el móvil, paso 2 (28-oct-2026): el rótulo, de 11,2 a 12 px, y los botones de compartir, de 42 a 44 */
@media (max-width:781px){.stt-lectura-rotulo{font-size:.75rem}.stt-compartir-movil .stt-lado-compartir a,.stt-compartir-movil .stt-lado-compartir button{min-height:44px}}