/* ==========================================================
   article.css — Página de DETALLE DE NOTICIA (rediseño LV).
   Diseña SOLO la columna del artículo (<main>). Extiende BEM (.article__*)
   sobre tokens.css + base.css y reutiliza las primitivas existentes
   (.kicker, .byline, .deck, .headline + .t-*, .media, .related, .btn,
   .ad-slot, .live-tag). Un único DOM responsive (1024px / 640px).

   Reglas de unidades del proyecto: font-size en REM (escala --fs-*),
   letter-spacing en EM, gaps/paddings de layout en PX, bordes en PX.
   ========================================================== */

/* ── Tokens NUEVOS (documentados, mínimos, auto-adaptan a dark) ── */
:root {
	--article-rail: 360px; /* raíl derecho (= prototipo aprobado) */
	--gutter: 80px; /* margen lateral de la columna de lectura (= prototipo) */
	--read: 720px; /* (reservado) */
	--measure: 44rem; /* (reservado) */
	--measure-wide: 48rem; /* (reservado) */
	--article-body: var(--fs-21); /* cuerpo de lectura (ajustable por el lector) */
	--accent-ai-soft: color-mix(in oklab, var(--accent-ai) 14%, var(--paper));
	--live-bg: color-mix(in oklab, var(--live) 10%, var(--paper));
	--lv-blue-tint: #e8eef7;
}
[data-textsize="s"] {
	--article-body: var(--fs-17);
}
[data-textsize="l"] {
	--article-body: var(--fs-21);
}
[data-textsize="xl"] {
	--article-body: var(--fs-23);
}

/* ══════════════════════════════════════════════════════════
   ESTRUCTURA
══════════════════════════════════════════════════════════ */
.article {
	display: block;
}

/* Cabecera del artículo (antetítulo · h1 · entradilla) — inset lateral = gutter (= masthead-inset del prototipo) */
.article__head {
	padding: 0 var(--gutter);
	margin: 0 0 32px;
}
.article__eyebrows {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}
.article__live {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 700;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--live);
	background: var(--live-bg);
	padding: 4px 9px;
	border-radius: var(--r-chip);
}
.article__live-dot {
	position: relative;
	width: 7px;
	height: 7px;
	flex: 0 0 auto;
}
.article__live-dot::before,
.article__live-dot::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: var(--live);
}
.article__live-dot::after {
	animation: lv-pulse 1.8s ease-out infinite;
}
@media (prefers-reduced-motion: reduce) {
	.article__live-dot::after {
		animation: none;
	}
}

.article .headline.t-article {
	font-size: clamp(var(--fs-31), 3.6vw, var(--fs-50));
	line-height: 1.06;
	letter-spacing: -0.01em;
	font-weight: 600;
	margin-top: 0;
}
.article__deck {
	margin: 18px 0 0;
	font-family: var(--f-headline);
	font-weight: 100;
	font-size: var(--fs-21);
	line-height: 1.4;
	color: var(--deck);
	text-wrap: pretty;
}

/* Hero a todo el ancho de contenido (candidata a LCP) */
.article__hero {
	margin: 0 0 40px;
}
.article__hero .media {
	border: none;
}
.article__figcaption {
	margin-top: 10px;
	display: flex;
	justify-content: space-between;
	gap: 18px;
	font-family: var(--f-sans);
	font-size: var(--fs-13);
	line-height: 1.45;
	color: var(--meta);
	text-wrap: pretty;
}
.article__credit {
	flex-shrink: 0;
	color: var(--meta-soft);
	white-space: nowrap;
}

/* Rejilla: columna de lectura + raíl */
.article__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--article-rail);
	gap: var(--gutter);
	align-items: start;
}
.article__col {
	min-width: 0;
	padding-left: var(--gutter);
	padding-right: 0;
}

/* Medida de lectura: el texto fluye a ~70 car.; los bloques ricos van anchos */
/* La columna de lectura define su medida vía padding-left: var(--gutter) en .article__col
   (= prototipo). El titular comparte la misma izquierda con padding lateral en .article__head. */

/* ══════════════════════════════════════════════════════════
   FIRMA / BYLINE + acciones
══════════════════════════════════════════════════════════ */
.article__byline {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 0;
	border-top: 1px solid var(--hair);
	border-bottom: 1px solid var(--hair);
}
.article__byline-id {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}
/* Byline de 2 filas: fila 1 = foto + (nombre + cargo); fila 2 = fechas + iconos. */
.article__byline--stacked {
	flex-direction: column;
	align-items: stretch;
	gap: 12px;
}
.article__role {
	margin-top: 2px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	text-transform: uppercase;
	color: var(--meta);
}
.article__byline-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.article__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	flex-shrink: 0;
	display: grid;
	place-items: center;
	overflow: hidden;
	background: linear-gradient(135deg, var(--lv-blue), var(--accent-quote, #6b4a52));
	border: 2px solid var(--paper);
	color: #fff;
	font-family: var(--f-sans);
	font-weight: 600;
	font-size: var(--fs-16);
}
/* Multi-firma: avatares solapados (el .article__byline-id aporta gap:14px entre
   hijos flex, así que -26px deja un solape efectivo de ~12px, como en el directo). */
.article__byline-id .article__avatar + .article__avatar {
	margin-left: -26px;
}
.article__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.article__author {
	font-family: var(--f-sans);
	font-size: var(--fs-13);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--ink);
}
.article__byline-meta {
	margin-top: 2px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-11);
	text-transform: uppercase;
	color: var(--meta);
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex-wrap: wrap;
}
.article__byline-meta .sep {
	color: var(--meta-soft);
	display: none;
}
.article__actions {
	display: flex;
	gap: 6px;
	flex-shrink: 0;
}
.article__actions .iconbtn[aria-pressed="true"] {
	background: var(--ink);
	border-color: var(--ink);
	color: var(--paper);
}

/* Control de tamaño de texto */
.article__textsize {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--hair);
	border-radius: var(--r-pill);
	overflow: hidden;
	display: none; /* oculto por ahora, pendiente de aprobación final del bloque */
}
.article__textsize button {
	border: 0;
	background: transparent;
	cursor: pointer;
	color: var(--ink);
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-weight: 600;
	line-height: 1;
	padding: 0 11px;
	height: 34px;
}
.article__textsize button:first-child {
	font-size: var(--fs-12);
}
.article__textsize button:last-child {
	font-size: var(--fs-16);
	border-left: 1px solid var(--hair);
}
.article__textsize button:hover {
	background: var(--paper-2);
	color: var(--lv-blue);
}

/* ══════════════════════════════════════════════════════════
   AUDIO en línea (escuchar artículo) — barra compacta
══════════════════════════════════════════════════════════ */
.article__audio-inline {
	margin-top: 20px;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	border: 1px solid var(--hair);
	background: var(--paper-2);
}
.article__playbtn {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	flex-shrink: 0;
	border: none;
	cursor: pointer;
	background: var(--lv-blue);
	color: #fff;
	display: grid;
	place-items: center;
}
.article__playbtn:hover {
	background: var(--lv-blue-deep);
}
.article__audio-txt {
	min-width: 0;
	flex: 1;
}
.article__audio-title {
	font-family: var(--f-sans);
	font-size: var(--fs-13);
	letter-spacing: var(--letter-spacing-kicker);
	font-weight: 600;
	color: var(--ink);
	text-transform: uppercase;
}
.article__audio-sub {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
	margin-top: 2px;
}
.article__audio-dur {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
	flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════════
   BARRA DE TRANSPARENCIA (confianza) — <details>
══════════════════════════════════════════════════════════ */
.article__transparency {
	margin-top: 16px;
	border: 1px solid var(--hair);
	background: var(--paper);
	display: none !important; /* oculto por ahora, pendiente de aprobación final del bloque */
}
.article__transparency > summary {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	padding: 12px 16px;
	cursor: pointer;
	list-style: none;
}
.article__transparency > summary::-webkit-details-marker {
	display: none;
}
.article__updated {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-family: var(--f-sans);
	font-size: var(--fs-12);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--ink);
}
.article__updated .dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--live);
	box-shadow: 0 0 0 3px var(--live-bg);
}
.article__verified {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-family: var(--f-sans);
	font-size: var(--fs-12);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	color: var(--lv-blue);
}
.article__transparency .spacer {
	flex: 1;
}
.article__disclose {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
}
.article__disclose .chev {
	transition: transform 0.2s;
}
.article__transparency[open] .article__disclose .chev {
	transform: rotate(180deg);
}
.article__transparency-body {
	padding: 14px 16px 16px;
	border-top: 1px solid var(--hair-soft);
}
.article__transparency-body p {
	margin: 0 0 14px;
	font-family: var(--f-text);
	font-size: var(--fs-15);
	line-height: 1.55;
	color: var(--ink-soft);
	text-wrap: pretty;
}
.article__sources {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 6px;
}
.article__sources li {
	display: grid;
	grid-template-columns: 16px 1fr;
	gap: 8px;
	align-items: start;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	color: var(--ink-soft);
}
.article__sources svg {
	color: var(--lv-blue);
	margin-top: 2px;
}
.article__transparency-links {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid var(--hair-soft);
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
}
.article__transparency-links a {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--lv-blue);
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

/* ══════════════════════════════════════════════════════════
   RESUMEN IA — <details>, filete sienna (--accent-ai)
══════════════════════════════════════════════════════════ */
.article__summary {
	margin-top: 32px;
	border: 1px solid var(--hair);
	border-left: 3px solid var(--accent-ai);
	background: var(--paper);
	padding: 20px 24px;
	display: none !important; /* oculto por ahora, pendiente de aprobación final del bloque */
}
.article__summary > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	cursor: pointer;
	list-style: none;
}
.article__summary > summary::-webkit-details-marker {
	display: none;
}
.article__summary-id {
	display: flex;
	align-items: center;
	gap: 10px;
}
.article__summary-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--accent-ai-soft);
	color: var(--accent-ai);
	flex-shrink: 0;
}
.article__label {
	font-family: var(--f-sans);
	font-size: var(--fs-11_5);
	font-weight: 700;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--ink);
}
.article__sublabel {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta-soft);
	margin-top: 2px;
}
.article__summary-toggle {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
}
.article__summary-toggle .chev {
	transition: transform 0.2s;
}
.article__summary[open] .article__summary-toggle .chev {
	transform: rotate(180deg);
}
.article__summary-list {
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 12px;
}
.article__summary-list li {
	display: grid;
	grid-template-columns: 22px 1fr;
	gap: 12px;
	align-items: start;
	font-family: var(--f-text);
	font-size: var(--fs-17);
	line-height: 1.5;
	color: var(--ink);
	text-wrap: pretty;
}
.article__summary-list .n {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	font-weight: 700;
	color: var(--accent-ai);
	margin-top: 4px;
}

/* ══════════════════════════════════════════════════════════
   CUERPO — tipografía de lectura
══════════════════════════════════════════════════════════ */
.article__body {
	margin-block: var(--margin-block);
	font-family: var(--f-text);
	font-size: var(--article-body);
	line-height: 1.5;
	color: var(--ink);
}
.article__body > p {
	margin-block: var(--margin-block);
	text-wrap: pretty;
}
.article__body a {
	color: #37709f;
	text-decoration: none;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}
.article__body a:hover {
	text-decoration-thickness: 2px;
}
.article__body h2 {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-27);
	line-height: 1.15;
	letter-spacing: -0.01em;
	margin-block: var(--margin-block);
	color: var(--ink);
	text-wrap: balance;
}
.article__body h3 {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-22);
	line-height: 1.2;
	margin-block: var(--margin-block);
	color: var(--ink);
	text-wrap: balance;
}
.article__crosshead {
	font-family: var(--f-text);
	font-weight: 700;
	color: var(--ink);
	margin-block: var(--margin-block);
}
.article__body ul,
.article__body ol {
	margin-block: var(--margin-block);
	padding-left: 1.2em;
}
.article__body li {
	margin-bottom: 0.5em;
	padding-left: 0.2em;
}
.article__body ul li::marker {
	color: var(--lv-blue);
}
.article__body ol li::marker {
	color: var(--lv-blue);
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-weight: 700;
}

/* Cita / pull-quote */
.article__pullquote {
	margin-block: var(--margin-block);
	padding: 4px 0 4px 24px;
	border-left: 3px solid var(--lv-blue);
	font-family: var(--f-headline);
	font-weight: 500;
	font-size: var(--fs-27);
	line-height: 1.28;
	color: var(--ink);
	text-wrap: pretty;
	margin-left: 0;
	margin-right: 0;
}
.article__pullquote .attr {
	display: block;
	margin-top: 14px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-weight: 600;
	font-size: var(--fs-12);
	text-transform: uppercase;
	color: var(--meta);
}

/* Ladillo destacado / nota del editor / fact-check */
.article__note {
	margin-block: var(--margin-block);
	padding: 25px;
	border-left: 3px solid var(--lv-blue);
	background: var(--lv-blue-tint);
}
.article__note-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}
.article__note-head .article__label {
	color: var(--lv-blue);
}
.article__note p {
	margin: 0;
	font-family: var(--f-text);
	font-size: var(--fs-16_5);
	line-height: 1.55;
	color: var(--ink-soft);
	text-wrap: pretty;
}

/* Imagen inline / vídeo / galería — usan .media (ratio reservado) */
.article__media-block {
	margin-block: var(--margin-block);
	margin-left: 0;
	margin-right: 0;
}
.article__media-block .media {
	cursor: zoom-in;
}
.article__zoom {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	background: rgba(8, 10, 14, 0.55);
	color: #fff;
	display: grid;
	place-items: center;
}
.article__video-veil {
	position: absolute;
	inset: 0;
	z-index: 2;
	background: linear-gradient(transparent 45%, rgba(0, 0, 0, 0.6));
	pointer-events: none;
}
.article__video-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	width: 68px;
	height: 68px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	background: rgba(255, 255, 255, 0.95);
	color: var(--lv-blue-deep);
	display: grid;
	place-items: center;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}
.article__video-badge {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 700;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: #fff;
	background: var(--live);
	padding: 4px 9px;
	border-radius: var(--r-chip);
}
.article__video-bar {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	color: #fff;
}
.article__video-bar .t {
	flex: 1;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	font-weight: 500;
	text-wrap: pretty;
}
.article__video-bar .d {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	opacity: 0.9;
}

/* Galería mosaico */
.article__gallery {
	margin-block: var(--margin-block);
}
.article__gallery-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
}
.article__gallery-head .article__label {
	color: var(--lv-blue);
}
.article__gallery-grid {
	display: grid;
	grid-template-columns: 2fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 6px;
	aspect-ratio: 3 / 2;
}
.article__gallery-grid .media {
	border: none;
}
.article__gallery-grid > a:first-child {
	grid-row: 1 / 3;
}
.article__gallery-more {
	position: absolute;
	inset: 0;
	z-index: 3;
	background: rgba(8, 10, 14, 0.6);
	display: grid;
	place-items: center;
	color: #fff;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-30);
}

/* Lectura relacionada inline */
.article__related {
	margin-block: var(--margin-block);
	border: 1px solid var(--hair);
}
.article__related-head {
	display: flex;
	padding: 9px 16px;
	border-bottom: 1px solid var(--hair);
	background: var(--paper-2);
}
.article__related-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	list-style: none; /* el grid es <ul><li>: sin marcadores */
	margin: 0 !important; /* el bloque del related controla su margen, no los ítems */
	padding: 0 !important; /* el bloque del related controla su padding, no los ítems */
	margin-block: 0 !important; /* el bloque del related controla su margen, no los ítems */
}
/* Un solo relacionado → ocupa el ancho completo (1 columna) */
.article__related-grid:has(> li:only-child) {
	grid-template-columns: 1fr;
}
.article__related-grid a {
	display: block;
	padding: 14px 16px;
	color: var(--ink);
	text-decoration: none; /* el related va dentro de .article__body (que subraya los <a>) */
}

.article__related-grid a:hover {
	opacity: 0.7;
}

/* Separador entre columnas (en el <a> del 1er <li>, no en todos) */
.article__related-grid > li:not(:last-child) > a {
	border-right: 1px solid var(--hair);
}

.article__related-grid li {
	margin: 0;
	padding: 0;
}

.article__related-kicker {
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--lv-blue);
	margin-bottom: 6px;
}
.article__related-title {
	font-family: var(--f-headline);
	font-weight: 100;
	font-size: var(--fs-18);
	line-height: 1.25;
	letter-spacing: 0.01em;
	color: var(--ink);
	text-wrap: balance;
}
.article__related-author {
	margin-top: 6px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
	text-transform: uppercase;
}

/* Documento clave */
.article__doc {
	margin-block: var(--margin-block);
	border: 1px solid var(--hair);
	display: grid;
	grid-template-columns: 120px 1fr;
}
.article__doc-thumb {
	background: var(--paper-2);
	border-right: 1px solid var(--hair);
	padding: 16px;
	display: grid;
	place-items: center;
}
.article__doc-paper {
	background: var(--paper);
	border: 1px solid var(--hair);
	width: 100%;
	aspect-ratio: 3/4;
	padding: 10px 8px;
	display: grid;
	gap: 4px;
	align-content: start;
	box-shadow: 2px 2px 0 var(--hair-soft);
}
.article__doc-paper i {
	display: block;
	height: 2.5px;
	border-radius: 2px;
	background: var(--hair);
}
.article__doc-paper i:first-child {
	width: 60%;
	background: var(--lv-blue);
}
.article__doc-body {
	padding: 18px 20px;
}
.article__doc-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	flex-wrap: wrap;
}
.article__doc-meta .sep {
	color: var(--meta-soft);
}
.article__doc-meta .t {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12_5);
	color: var(--meta);
}
.article__doc blockquote {
	margin: 0 0 14px;
	font-family: var(--f-text);
	font-style: italic;
	font-size: var(--fs-18);
	line-height: 1.5;
	color: var(--ink);
	text-wrap: pretty;
}
.article__doc-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}
.article__doc-foot .src {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12_5);
	color: var(--meta);
}

/* Glosario / términos clave */
.article__glossary {
	margin-block: var(--margin-block);
	padding: 4px 0 4px 18px;
	border-left: 2px solid var(--hair);
}
.article__glossary-head {
	margin-bottom: 14px;
}
.article__glossary dl {
	margin: 0;
	display: grid;
	gap: 14px;
}
.article__glossary dt {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-16);
	color: var(--ink);
	margin-bottom: 3px;
}
.article__glossary dd {
	margin: 0;
	font-family: var(--f-text);
	font-size: var(--fs-15);
	line-height: 1.5;
	color: var(--meta);
	text-wrap: pretty;
}

/* Encuesta de lectores */
.article__poll {
	margin-block: var(--margin-block);
	border: 1px solid var(--hair);
	border-top: 3px solid var(--lv-blue);
	padding: 20px 22px;
	background: var(--paper);
}
.article__poll-q {
	margin: 8px 0 16px;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-22);
	line-height: 1.25;
	color: var(--ink);
	text-wrap: balance;
}
.article__poll-opts {
	display: grid;
	gap: 8px;
}
.article__poll-opt {
	position: relative;
	overflow: hidden;
	text-align: left;
	cursor: pointer;
	border: 1px solid var(--hair);
	padding: 11px 14px;
	background: var(--paper);
	font-family: var(--f-sans);
	font-size: var(--fs-15);
	letter-spacing: var(--letter-spacing-kicker);
	color: var(--ink);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.article__poll-opt .bar {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	background: var(--paper-2);
	z-index: 0;
	transition: width 0.5s ease;
}
.article__poll-opt .lbl,
.article__poll-opt .pct {
	position: relative;
	z-index: 1;
}
.article__poll-opt .pct {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-weight: 600;
	color: var(--meta);
	opacity: 0;
}
.article__poll.is-voted .article__poll-opt .pct {
	opacity: 1;
}
.article__poll.is-voted .article__poll-opt[aria-pressed="true"] {
	border-color: var(--ink);
}
.article__poll.is-voted .article__poll-opt[aria-pressed="true"] .bar {
	background: var(--lv-blue-tint);
}
.article__poll.is-voted .article__poll-opt[aria-pressed="true"] .pct {
	color: var(--lv-blue);
}
.article__poll-foot {
	margin-top: 12px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12_5);
	color: var(--meta);
}

/* Embeds sociales (X / Instagram / TikTok) */
.article__embed {
	margin-block: var(--margin-block);
	margin-inline: auto;
	display: flex;
	justify-content: center;
}
.article__embed-card {
	width: 100%;
	border: 1px solid var(--hair);
	background: var(--paper);
	overflow: hidden;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
}
.article__embed--x .article__embed-card {
	max-width: 520px;
}
.article__embed--ig .article__embed-card {
	max-width: 460px;
}
.article__embed--tt .article__embed-card {
	max-width: 340px;
}
.article__embed-head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
}
.article__embed-avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	flex-shrink: 0;
	display: grid;
	place-items: center;
	color: #fff;
	font-weight: 700;
	font-size: var(--fs-16);
	background: var(--lv-blue);
}
.article__embed-name {
	display: flex;
	align-items: center;
	gap: 5px;
	font-weight: 700;
	font-size: var(--fs-15);
	color: var(--ink);
}
.article__embed-handle {
	font-size: var(--fs-13);
	color: var(--meta);
}
.article__embed-text {
	margin: 0;
	padding: 0 16px;
	font-family: var(--f-text);
	font-size: var(--fs-17);
	line-height: 1.5;
	color: var(--ink);
	text-wrap: pretty;
}
.article__embed--x .article__embed-text {
	margin-bottom: 14px;
}
.article__embed-foot {
	display: flex;
	gap: 16px;
	align-items: center;
	padding: 12px 16px;
	font-size: var(--fs-13);
	color: var(--meta);
	border-top: 1px solid var(--hair-soft);
	margin-top: 12px;
}
.article__embed-foot .when {
	margin-left: auto;
}
.article__embed-media {
	position: relative;
}
.article__embed-igbar {
	padding: 12px 16px;
}
.article__embed-igactions {
	display: flex;
	gap: 16px;
	color: var(--ink);
	margin-bottom: 10px;
}
.article__verified-ic {
	color: #1d9bf0;
}

/* ══════════════════════════════════════════════════════════
   MURO DE PAGO (premium) — corte + módulo de suscripción
══════════════════════════════════════════════════════════ */
.article__paywall {
	position: relative;
	margin: 0 0 40px;
	padding-top: 96px;
	display: none !important; /* oculto por ahora, pendiente de aprobación final del bloque */
}
.article__paywall-fade {
	position: absolute;
	left: 0;
	right: 0;
	top: -8px;
	height: 104px;
	pointer-events: none;
	background: linear-gradient(to bottom, transparent, var(--paper) 88%);
}
.article__paywall-box {
	border-top: 3px solid var(--lv-yellow);
	background: var(--paper-2);
	padding: 36px 40px 40px;
	text-align: center;
}
.article__paywall-box .article__label {
	color: var(--lv-blue);
}
.article__paywall-title {
	margin: 12px auto 8px;
	max-width: 26ch;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-30);
	line-height: 1.12;
	color: var(--ink);
	text-wrap: balance;
}
.article__paywall-sub {
	margin: 0 auto 22px;
	max-width: 46ch;
	font-family: var(--f-text);
	font-size: var(--fs-16_5);
	line-height: 1.5;
	color: var(--ink-soft);
	text-wrap: pretty;
}
.article__paywall-benefits {
	list-style: none;
	margin: 0 auto 24px;
	padding: 0;
	display: inline-grid;
	gap: 9px;
	text-align: left;
}
.article__paywall-benefits li {
	display: grid;
	grid-template-columns: 18px 1fr;
	gap: 9px;
	align-items: start;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-14);
	color: var(--ink);
}
.article__paywall-benefits svg {
	color: var(--lv-blue);
	margin-top: 1px;
}
.article__paywall-cta {
	display: flex;
	gap: 12px;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.article__paywall .btn-cta {
	height: 44px;
	font-size: var(--fs-13);
}
.article__paywall-login {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	color: var(--meta);
}
.article__paywall-login a {
	color: var(--lv-blue);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Aviso de revisión (solo demo): separa lo "gateado" para poder revisarlo */
.article__review-note {
	margin: 8px 0 36px;
	padding: 10px 14px;
	border: 1px dashed var(--hair);
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta-soft);
	text-align: center;
	text-transform: uppercase;
	display: none !important; /* oculto por ahora, pendiente de aprobación final del bloque */
}

/* ══════════════════════════════════════════════════════════
   "EN CIFRAS" — figuras clave
══════════════════════════════════════════════════════════ */
.article__section-head {
	display: flex;
	align-items: baseline;
	gap: 14px;
	margin-bottom: 20px;
}
.article__section-head .rule {
	flex: 1;
	height: 1px;
	background: var(--hair);
}
.article__section-head .article__label {
	color: var(--lv-blue);
	white-space: nowrap;
}

.article__figures {
	margin: var(--section-gap) 0;
}
.article__figures-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border-top: 2px solid var(--ink);
}
.article__figure {
	padding: 20px 20px 20px 0;
}
.article__figure:nth-child(odd) {
	border-right: 1px solid var(--hair);
}
.article__figure:nth-child(even) {
	padding-left: 20px;
}
.article__figure:nth-child(n + 3) {
	border-top: 1px solid var(--hair);
}
.article__figure .v {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-38);
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--lv-blue);
	margin-bottom: 10px;
}
.article__figure .l {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-14);
	line-height: 1.45;
	color: var(--meta);
	text-wrap: pretty;
}

/* Tags + volver arriba */
.article__tags {
	margin: 30px 0 0;
	padding-top: 24px;
	border-top: 1px solid var(--hair);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.article__tag-list {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}
.article__tag {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	font-weight: 500;
	color: var(--ink);
	padding: 5px 10px;
	border: 1px solid var(--hair);
	border-radius: var(--r-pill);
	white-space: nowrap;
}
.article__tag:hover {
	border-color: var(--lv-blue);
	color: var(--lv-blue);
}

/* ══════════════════════════════════════════════════════════
   QUIÉN ES QUIÉN — fichas
══════════════════════════════════════════════════════════ */
.article__people {
	margin: var(--section-gap) 0;
}
.article__people-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}
.article__person {
	border: 1px solid var(--hair);
	padding: 20px;
	display: grid;
	gap: 12px;
	background: var(--paper);
	transition: border-color 0.15s;
}
.article__person:hover {
	border-color: var(--lv-blue);
}
.article__person-photo {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--lv-blue-tint);
	border: 1px solid var(--hair);
	display: grid;
	place-items: center;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-22);
	color: var(--lv-blue);
}
.article__person-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.article__person-status {
	display: inline-block;
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: var(--r-chip);
	background: var(--paper-2);
	color: var(--meta);
	margin-bottom: 8px;
}
.article__person-status--inv {
	background: var(--live-bg);
	color: var(--live);
}
.article__person-name {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-18);
	line-height: 1.2;
	color: var(--ink);
	margin-bottom: 4px;
}
.article__person-role {
	font-family: var(--f-sans);
	font-size: var(--fs-12);
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--meta);
	margin-bottom: 10px;
	line-height: 1.3;
}
.article__person-bio {
	margin: 0;
	font-family: var(--f-text);
	font-size: var(--fs-15);
	line-height: 1.5;
	color: var(--ink-soft);
	text-wrap: pretty;
}

/* ══════════════════════════════════════════════════════════
   CRONOLOGÍA — scroller horizontal con nodos
══════════════════════════════════════════════════════════ */
.article__timeline {
	margin: var(--section-gap) 0;
}
.article__timeline-bar {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 8px;
}
.article__timeline-bar .rule {
	flex: 1;
	height: 1px;
	background: var(--hair);
}
.article__timeline-arrows {
	display: flex;
	gap: 8px;
}
.article__timeline-title {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-28);
	line-height: 1.15;
	margin: 12px 0 24px;
	color: var(--ink);
	text-wrap: balance;
}
.article__timeline-scroller {
	overflow-x: auto;
	scrollbar-width: none;
	margin: 0 -2px;
}
.article__timeline-scroller::-webkit-scrollbar {
	display: none;
}
.article__timeline-list {
	list-style: none;
	margin: 0;
	padding: 24px 2px 0;
	display: flex;
	gap: 24px;
	border-top: 1px solid var(--ink);
	width: max-content;
}
.article__timeline-item {
	position: relative;
	flex: 0 0 248px;
	width: 248px;
}
.article__timeline-node {
	position: absolute;
	top: -29px;
	left: 0;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--lv-blue);
}
.article__timeline-item--now .article__timeline-node {
	background: var(--accent-ai);
	box-shadow: 0 0 0 4px var(--accent-ai-soft);
}
.article__timeline-date {
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	margin-bottom: 8px;
	color: var(--meta);
}
.article__timeline-item--now .article__timeline-date {
	color: var(--accent-ai);
}
.article__timeline-h {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-17);
	line-height: 1.25;
	color: var(--ink);
	margin-bottom: 8px;
	text-wrap: balance;
}
.article__timeline-p {
	font-family: var(--f-text);
	font-size: var(--fs-14);
	line-height: 1.45;
	color: var(--meta);
	text-wrap: pretty;
}

/* ══════════════════════════════════════════════════════════
   COMENTARIOS — <details> con botón ancho
══════════════════════════════════════════════════════════ */
.article__comments {
	margin: 30px 0 0;
	border-top: 1px solid var(--hair);
	padding-top: 30px;
}
.article__comments-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	height: 52px;
	border: 1px solid var(--hair);
	cursor: pointer;
	background: var(--paper);
	list-style: none;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	font-weight: 600;
	color: var(--ink);
}
.article__comments-toggle::-webkit-details-marker {
	display: none;
}
.article__comments[open] .article__comments-toggle {
	background: var(--paper-2);
}
.article__comments-count {
	min-width: 26px;
	height: 22px;
	padding: 0 8px;
	border-radius: var(--r-pill);
	background: var(--lv-blue);
	color: #fff;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	font-weight: 600;
	display: inline-grid;
	place-items: center;
}
.article__comments-body {
	margin-top: 24px;
}
.article__comment-form {
	border: 1px solid var(--hair);
	padding: 16px;
	margin-bottom: 24px;
	background: var(--paper);
}
.article__comment-form textarea {
	width: 100%;
	border: 0;
	outline: 0;
	resize: none;
	padding: 0;
	background: transparent;
	font-family: var(--f-text);
	font-size: var(--fs-15);
	color: var(--ink);
}
.article__comment-form-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid var(--hair-soft);
}
.article__comment-form-foot span {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
}
.article__comment {
	display: grid;
	grid-template-columns: 40px 1fr;
	gap: 14px;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--hair-soft);
}
.article__comment:last-child {
	border-bottom: none;
}
.article__comment-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--paper-2);
	border: 1px solid var(--hair);
	display: grid;
	place-items: center;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-weight: 600;
	font-size: var(--fs-14);
	color: var(--ink);
}
.article__comment-top {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
	flex-wrap: wrap;
}
.article__comment-author {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-14);
	font-weight: 600;
	color: var(--ink);
}
.article__comment-sub {
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	color: var(--lv-blue);
	background: var(--lv-blue-tint);
	padding: 2px 6px;
	border-radius: var(--r-chip);
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
}
.article__comment-date {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12_5);
	color: var(--meta);
}
.article__comment p {
	margin: 0 0 10px;
	font-family: var(--f-text);
	font-size: var(--fs-16);
	line-height: 1.55;
	color: var(--ink);
	text-wrap: pretty;
}
.article__comment-acts {
	display: flex;
	gap: 14px;
}
.article__comment-acts button {
	border: 0;
	background: transparent;
	padding: 0;
	cursor: pointer;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12_5);
	color: var(--meta);
	display: inline-flex;
	align-items: center;
	gap: 5px;
}
.article__comment-acts button:hover {
	color: var(--lv-blue);
}

/* ══════════════════════════════════════════════════════════
   SIGUE LEYENDO (recirculación)
══════════════════════════════════════════════════════════ */
.article__recirc {
	margin-top: var(--section-gap);
	padding-top: 32px;
	border-top: 2px solid var(--ink);
}
.article__recirc-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}
.article__recirc-head h2 {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-26);
	line-height: 1.1;
	margin: 0;
	letter-spacing: -0.01em;
	color: var(--ink);
}
.article__recirc-all {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	font-weight: 600;
	color: var(--lv-blue);
	display: inline-flex;
	align-items: center;
	gap: 5px;
	white-space: nowrap;
}
.article__recirc-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border-top: 1px solid var(--hair);
}
.article__recirc-item {
	display: grid;
	grid-template-columns: 1fr 96px;
	gap: 16px;
	padding: 20px 0;
	border-bottom: 1px solid var(--hair);
	align-items: start;
	color: var(--ink);
}
.article__recirc-item:nth-child(odd) {
	border-right: 1px solid var(--hair);
	padding-right: 24px;
}
.article__recirc-item:nth-child(even) {
	padding-left: 24px;
}
.article__recirc-item:nth-last-child(-n + 2) {
	border-bottom: none;
}
.article__recirc-kicker {
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--lv-blue);
	margin-bottom: 8px;
}
.article__recirc-title {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-18);
	line-height: 1.22;
	color: var(--ink);
	margin-bottom: 10px;
	text-wrap: balance;
}
.article__recirc-meta {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
}
.article__recirc-thumb {
	width: 96px;
}
.article__recirc-thumb .media {
	border: none;
}

/* ══════════════════════════════════════════════════════════
   MÓDULOS DE CIERRE — ancho completo (fuera del raíl)
══════════════════════════════════════════════════════════ */
.article__extras {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--article-rail);
	gap: var(--gutter);
	align-items: start;

	min-width: 0;
	padding-left: var(--gutter);
	padding-right: 0;
}
.article__extras > section:first-child {
	margin-top: 0;
}

/* ══════════════════════════════════════════════════════════
   RAÍL DERECHO
══════════════════════════════════════════════════════════ */
.article__rail {
	display: grid;
	gap: 28px;
	align-content: start;
}
.article__rail-block-head {
	border-top: 2px solid var(--ink);
	padding-top: 12px;
	margin-bottom: 14px;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Sigue el caso */
.article__follow {
	border: 1px solid var(--hair);
	padding: 16px 18px;
	background: var(--paper);
	display: none !important;
}

.article__ticker-wrap {
	display: none !important;
}

.article__follow-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
}
.article__follow-head .article__label {
	color: var(--live);
}
.article__follow h3 {
	margin: 0 0 4px;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-19);
	line-height: 1.15;
	color: var(--ink);
}
.article__follow p {
	margin: 0 0 14px;
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	color: var(--meta);
}
.article__follow .btn {
	width: 100%;
	justify-content: center;
	height: 38px;
}

/* Newsletter */
.article__news {
	border: 1px solid var(--hair);
	border-top: 3px solid var(--lv-blue);
	padding: 18px;
}
.article__news .article__label {
	color: var(--lv-blue);
}
.article__news h3 {
	margin: 8px 0 6px;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-18);
	line-height: 1.2;
	color: var(--ink);
}
.article__news p {
	margin: 0 0 12px;
	font-family: var(--f-text);
	font-size: var(--fs-14);
	line-height: 1.5;
	color: var(--ink-soft);
}
.article__news-form {
	display: flex;
	gap: 6px;
}
.article__news-form input {
	flex: 1;
	min-width: 0;
	height: 36px;
	padding: 0 10px;
	border: 1px solid var(--hair);
	background: var(--paper);
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	color: var(--ink);
	outline: none;
}
.article__news-form input:focus {
	border-color: var(--lv-blue);
}
.article__news-form .btn {
	height: 36px;
}

/* Al minuto */
.article__ticker-head .article__label {
	color: var(--live);
}
.article__ticker-head .dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--live);
	box-shadow: 0 0 0 3px var(--live-bg);
}
.article__ticker {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
.article__ticker::before {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 10px;
	left: 3px;
	width: 1px;
	background: var(--hair);
}
.article__ticker li {
	position: relative;
	padding-left: 18px;
	padding-bottom: 16px;
}
.article__ticker li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 5px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--paper);
	border: 1.5px solid var(--meta-soft);
}
.article__ticker li:first-child::before {
	background: var(--live);
	border-color: var(--live);
}
.article__ticker-time {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-12);
	color: var(--meta);
	margin-bottom: 3px;
}
.article__ticker a {
	font-family: var(--f-text);
	font-size: var(--fs-15);
	line-height: 1.4;
	color: var(--ink);
	text-wrap: pretty;
}
.article__ticker a:hover {
	color: var(--lv-blue);
}
.article__ticker-all {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	font-weight: 600;
	color: var(--lv-blue);
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/* Anuncio raíl (primitiva .ad-slot) */
.article__rail .ad-slot {
	margin: 0 auto;
}
.article__ad-note {
	text-align: center;
	margin-top: 8px;
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--meta-soft);
}

.article__mostread {
	display: none !important;
}

/* Lo más leído */
.article__mostread ol {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
}
.article__mostread li {
	display: grid;
	grid-template-columns: 24px 1fr;
	gap: 10px;
	align-items: start;
}
.article__mostread .n {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-22);
	color: var(--lv-blue);
	line-height: 1;
}
.article__mostread a {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-16);
	line-height: 1.3;
	color: var(--ink);
	text-wrap: balance;
}
.article__mostread a:hover {
	color: var(--lv-blue);
}

.article__authormore {
	display: none !important;
}

/* Más de la autora */
.article__authormore-list {
	display: grid;
	gap: 14px;
}
.article__authormore-list a {
	display: block;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--hair-soft);
}
.article__authormore-list a:last-child {
	border-bottom: none;
}
.article__authormore-kicker {
	font-family: var(--f-sans);
	font-size: var(--fs-11);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--lv-blue);
	margin-bottom: 5px;
}
.article__authormore-title {
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-16);
	line-height: 1.25;
	color: var(--ink);
	text-wrap: balance;
}

/* ══════════════════════════════════════════════════════════
   AUDIO FLOTANTE (desktop bottom-right / móvil barra inferior)
══════════════════════════════════════════════════════════ */
.article__audio-float {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 40;
	width: 320px;
	max-width: calc(100vw - 32px);
	background: var(--paper);
	border: 1px solid var(--hair);
	box-shadow: var(--shadow-lg);
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	transform: translateY(150%);
	transition: transform 0.3s ease;
}
.article__audio-float.is-on {
	transform: translateY(0);
}
.article__audio-float .t {
	flex: 1;
	min-width: 0;
}
.article__audio-float .title {
	font-family: var(--f-sans);
	letter-spacing: var(--letter-spacing-kicker);
	font-size: var(--fs-13);
	font-weight: 600;
	color: var(--ink);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.article__audio-float .prog {
	margin-top: 5px;
	height: 2px;
	background: var(--hair);
	overflow: hidden;
}
.article__audio-float .prog i {
	display: block;
	height: 2px;
	width: 22%;
	background: var(--accent-ai);
}
.article__audio-float-close {
	border: 0;
	background: transparent;
	cursor: pointer;
	color: var(--meta);
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	flex-shrink: 0;
}
@media (prefers-reduced-motion: reduce) {
	.article__audio-float {
		transition: none;
	}
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE — un único DOM. ≤1024 tablet · ≤640 móvil.
══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
	/* El raíl baja a una columna debajo de la lectura */
	.article__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--section-gap);
	}
	.article__rail {
		grid-template-columns: repeat(2, 1fr);
		align-items: start;
	}
	.article__rail > * {
		grid-column: auto;
	}
	.article__rail .ad-slot {
		grid-column: 1 / -1;
	}
	/* tablet: sin gutter; columna de lectura centrada */
	.article {
		--gutter: 0px;
	}
	.article__head {
		max-width: 700px;
		margin-inline: auto;
	}
	.article__col {
		padding-left: 0;
	}
	.article__col > * {
		max-width: 700px;
		margin-inline: auto;
	}
	.article__people-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.article__head {
		margin-bottom: 20px;
	}

	.article__media-block {
		margin-left: -16px;
		margin-right: -16px;
	}

	.article .headline.t-article {
		font-size: var(--fs-32);
		line-height: 1.1;
	}

	.article__eyebrows {
		margin-bottom: 8px;
	}

	.article__hero {
		margin-bottom: 20px;
		margin-left: -16px;
		margin-right: -16px;
	}

	.article__figcaption {
		margin-left: 16px;
		margin-right: 16px;
	}

	.article__deck {
		font-size: var(--fs-19);
	}
	.article__body {
		font-size: var(--fs-19);
		line-height: 1.65;
	}

	.article__rail {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	/* Figuras 1 columna */
	.article__figures-grid {
		grid-template-columns: 1fr;
	}
	.article__figure {
		padding: 18px 0;
		border-right: none !important;
		padding-left: 0 !important;
	}
	.article__figure:nth-child(n + 2) {
		border-top: 1px solid var(--hair);
	}

	/* Fichas: scroller horizontal */
	.article__people-grid {
		display: flex;
		gap: 12px;
		overflow-x: auto;
		scrollbar-width: none;
		margin: 0 -16px;
		padding: 4px 16px;
		scroll-snap-type: x mandatory;
	}
	.article__people-grid::-webkit-scrollbar {
		display: none;
	}
	.article__person {
		flex: 0 0 240px;
		scroll-snap-align: start;
	}

	/* Cronología: lista vertical */
	.article__timeline-arrows {
		display: none;
	}
	.article__timeline-scroller {
		overflow: visible;
		margin: 0;
	}
	.article__timeline-list {
		display: block;
		width: auto;
		border-top: none;
		padding-top: 8px;
		position: relative;
	}
	.article__timeline-list::before {
		content: "";
		position: absolute;
		top: 6px;
		bottom: 6px;
		left: 6px;
		width: 1px;
		background: var(--hair);
	}
	.article__timeline-item {
		width: auto;
		padding: 0 0 18px 28px;
	}
	.article__timeline-node {
		top: 4px;
		left: 0;
		width: 13px;
		height: 13px;
		border: 2px solid var(--ink);
		background: var(--paper);
	}
	.article__timeline-item--now .article__timeline-node {
		border: none;
	}

	/* Documento: apilado */
	.article__doc {
		grid-template-columns: 1fr;
	}
	.article__doc-thumb {
		display: none;
	}

	/* Relacionados / recirc: 1 columna */
	.article__related-grid {
		grid-template-columns: 1fr;
	}
	.article__related-grid > li:not(:last-child) > a {
		border-right: none;
		border-bottom: 1px solid var(--hair);
	}
	.article__recirc-grid {
		grid-template-columns: 1fr;
	}
	.article__recirc-item,
	.article__recirc-item:nth-child(odd),
	.article__recirc-item:nth-child(even) {
		border-right: none;
		padding-left: 0;
		padding-right: 0;
	}
	.article__recirc-item:nth-last-child(-n + 2) {
		border-bottom: 1px solid var(--hair);
	}
	.article__recirc-item:last-child {
		border-bottom: none;
	}

	.article__paywall-box {
		padding: 28px 20px 32px;
	}
	.article__paywall-title {
		font-size: var(--fs-24);
	}

	/* el audio flotante ocupa todo el ancho como barra inferior */
	.article__audio-float {
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		max-width: none;
		border-left: none;
		border-right: none;
		border-bottom: none;
	}
}