/*
 * FM Centro — estilos.
 *
 * Paleta: sale del logo (disco azul, anillo dorado). El azul noche viste lo que
 * es «radio» (cabecera, al aire, dial, reproductor, pie); el papel frío, lo que
 * es «leer». El oro marca lo que pasa ahora (la aguja, el programa al aire, el
 * botón de escuchar). El rojo solo para el punto de «en vivo».
 * Cada categoría tiene su color (--cat): La Araucanía, bosque; Nacional, señal.
 *
 * Tipos: Archivo (variable, con ancho) para titulares e interfaz; Literata para
 * el cuerpo de las notas.
 */

@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo-wdth.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
}
@font-face {
	font-family: "Literata";
	src: url("../fonts/literata.woff2") format("woff2");
	font-weight: 200 900;
	font-display: swap;
}
@font-face {
	font-family: "Literata";
	src: url("../fonts/literata-italic.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
}

:root {
	--noche: #14254f;
	--noche-2: #1d3366;
	--noche-3: #2a4580;
	--senal: #2457c5;
	--oro: #f2b320;
	--papel: #f4f6fa;
	--papel-2: #e7ecf4;
	--blanco: #fff;
	--tinta: #172036;
	--tinta-2: #4b5671;
	--linea: #d9e0eb;
	--vivo: #e0362b;
	--bosque: #0f6b5c;
	--whatsapp: #128c4a;

	--sans: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
	--serif: "Literata", Georgia, "Times New Roman", serif;
	--angosta: 80%;

	--ancho: 1200px;
	--ancho-texto: 720px;
	--borde: 16px;
	--radio: 4px;
	--barra: 68px;

	--cat: var(--senal);
}
.cat-laraucania { --cat: var(--bosque); }
.cat-nacional { --cat: var(--senal); }

*, *::before, *::after { box-sizing: border-box; }

html {
	background: var(--noche);
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: 16px;
}

/* En iPhone, Safari pinta la franja del notch (y el rebote del scroll) con el fondo
   de la página: por eso el fondo es el azul de la radio y el papel vive en <main>. */
body {
	margin: 0;
	overflow-x: clip;
	background: var(--noche);
	color: var(--tinta);
	font-family: var(--sans);
	font-size: 1rem;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--senal); }
a:hover { color: var(--noche); }
h1, h2, h3, h4 { margin: 0; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; }

:focus-visible { outline: 3px solid var(--senal); outline-offset: 2px; border-radius: 2px; }
.cabecera :focus-visible, .al-aire :focus-visible, .reproductor :focus-visible,
.pie :focus-visible, .dial :focus-visible, .archivo-cabeza :focus-visible { outline-color: var(--oro); }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.saltar {
	position: absolute; left: 8px; top: -60px; z-index: 100;
	background: var(--oro); color: var(--noche); padding: 10px 16px; font-weight: 700; border-radius: var(--radio);
}
.saltar:focus { top: 8px; }

.envoltura { max-width: var(--ancho); margin-inline: auto; padding-inline: var(--borde); }
.envoltura-texto { max-width: calc(var(--ancho-texto) + 2 * var(--borde)); margin-inline: auto; padding-inline: var(--borde); }

#swup { display: block; background: var(--papel); }
#contenido:focus { outline: none; }

/* Navegación suave: un fundido corto al cambiar de página. */
.transition-fade { transition: opacity .16s ease; }
html.is-animating .transition-fade { opacity: 0; }

.icono { width: 1.25em; height: 1.25em; flex: none; }

/* ---------- Cabecera ---------- */

.cabecera { background: var(--noche); color: var(--blanco); position: relative; z-index: 30; }
.cabecera__in {
	max-width: var(--ancho); margin-inline: auto;
	padding: calc(8px + env(safe-area-inset-top)) max(var(--borde), env(safe-area-inset-right)) 8px max(var(--borde), env(safe-area-inset-left));
	display: flex; align-items: center; gap: 12px;
}
.cabecera__logo { flex: none; margin-right: auto; }
.cabecera__logo img { height: 46px; width: auto; }

.nav__abrir {
	display: grid; place-items: center; width: 52px; height: 52px; margin-right: -8px;
	background: none; border: 0; border-radius: var(--radio); color: var(--blanco); cursor: pointer;
}
.nav__abrir .icono { width: 34px; height: 34px; }

.boton-vivo {
	display: none; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 10px;
	background: var(--oro); color: var(--noche); border: 0; border-radius: var(--radio);
	font-weight: 750; font-stretch: 90%; cursor: pointer;
}

/* Íconos de play/pausa en todos los botones de la radio. */
[data-fm-play] .icono:nth-of-type(2) { display: none; }
[data-fm-play][aria-pressed="true"] .icono:nth-of-type(1) { display: none; }
[data-fm-play][aria-pressed="true"] .icono:nth-of-type(2) { display: block; }

/* Menú del celular: panel que entra desde la derecha, a todo el alto. */
.nav__panel {
	position: fixed; top: 0; right: 0; bottom: 0; z-index: 60;
	width: min(86vw, 360px);
	display: flex; flex-direction: column;
	background: var(--noche); color: var(--blanco);
	padding: 0 var(--borde) calc(16px + env(safe-area-inset-bottom));
	box-shadow: -16px 0 40px rgb(10 20 45 / .4);
	transform: translateX(100%); visibility: hidden;
	transition: transform .26s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .26s;
	overflow-y: auto; overscroll-behavior: contain;
}
html.menu-abierto .nav__panel {
	transform: none; visibility: visible;
	transition: transform .26s cubic-bezier(.2, .8, .2, 1), visibility 0s;
}
.nav__panel-cabeza {
	display: flex; align-items: center; justify-content: flex-end;
	min-height: 62px; border-bottom: 1px solid rgb(255 255 255 / .14);
}
.nav__cerrar {
	display: grid; place-items: center; width: 52px; height: 52px; margin-right: -8px;
	background: none; border: 0; color: var(--blanco); cursor: pointer; border-radius: var(--radio);
}
.nav__cerrar .icono { width: 30px; height: 30px; }
.nav__lista { padding-top: 8px; }
.nav__lista a {
	display: flex; align-items: center; gap: 10px; min-height: 56px;
	color: var(--blanco); text-decoration: none;
	font-size: 1.375rem; font-weight: 700; font-stretch: 85%;
	border-bottom: 1px solid rgb(255 255 255 / .1);
}
.nav__lista a[aria-current="page"] { color: var(--oro); }
.nav__credito {
	margin-top: auto; padding-top: 24px;
	font-size: .75rem; color: rgb(255 255 255 / .5);
}
.nav__credito a { color: rgb(255 255 255 / .65); }
.nav__fondo {
	position: fixed; inset: 0; z-index: 55;
	background: rgb(10 20 45 / .55);
	opacity: 0; visibility: hidden;
	transition: opacity .26s ease, visibility 0s linear .26s;
}
html.menu-abierto .nav__fondo { opacity: 1; visibility: visible; transition: opacity .26s ease, visibility 0s; }
html.menu-abierto { overflow: hidden; }
/* El panel vive dentro de la cabecera: con el menú abierto, la cabecera pasa sobre la barra del reproductor. */
html.menu-abierto .cabecera { z-index: 70; }


@media (min-width: 960px) {
	.cabecera-espacio { height: 90px; } /* 66 px de logo + 12 px arriba y abajo */
	.cabecera__in { padding-top: calc(12px + env(safe-area-inset-top)); padding-bottom: 12px; gap: 28px; }
	.cabecera__logo img { height: 66px; }
	.nav__abrir, .nav__panel-cabeza, .nav__credito, .nav__fondo { display: none; }
	.nav__panel {
		position: static; width: auto; display: block; padding: 0; background: none; box-shadow: none;
		transform: none; visibility: visible; transition: none; overflow: visible;
	}
	.nav__lista { display: flex; gap: 4px; padding: 0; }
	.nav__lista a {
		font-size: 1rem; font-weight: 600; font-stretch: 100%; min-height: 44px; padding: 0 10px; border: 0;
		color: rgb(255 255 255 / .86);
		background-image: linear-gradient(var(--oro), var(--oro));
		background-size: 0 3px; background-position: 50% 100%; background-repeat: no-repeat;
		transition: background-size .15s ease, color .15s ease;
	}
	.nav__lista a:hover { color: var(--blanco); background-size: calc(100% - 20px) 3px; }
	.nav__lista a[aria-current="page"] { color: var(--blanco); background-size: calc(100% - 20px) 3px; }
	.nav__buscar span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

	/* Al bajar: la cabecera queda fija, compacta y con el botón para escuchar. */
	html.cabecera-fija .cabecera {
		position: fixed; top: 0; left: 0; right: 0;
		box-shadow: 0 6px 20px rgb(10 20 45 / .3);
		animation: baja .22s cubic-bezier(.2, .8, .2, 1);
	}
	html.cabecera-fija .cabecera__in { padding-top: calc(6px + env(safe-area-inset-top)); padding-bottom: 6px; }
	html.cabecera-fija .cabecera__logo img { height: 44px; }
	html.cabecera-fija .boton-vivo { display: inline-flex; }
	html.menu-abierto { overflow: visible; }
}
@keyframes baja { from { transform: translateY(-100%); } }

/* ---------- Al aire (portada y radio) ---------- */

.al-aire { background: var(--noche); color: var(--blanco); }
.al-aire__in {
	max-width: var(--ancho); margin-inline: auto; padding: 20px var(--borde) 18px;
	display: grid; gap: 16px; align-items: end;
}
.al-aire__rotulo {
	display: flex; align-items: center; gap: 8px;
	font-size: .9375rem; font-weight: 600; color: rgb(255 255 255 / .78);
}
.punto {
	width: 10px; height: 10px; border-radius: 50%; background: var(--vivo); flex: none;
	box-shadow: 0 0 0 0 rgb(224 54 43 / .6);
}
html[data-radio="sonando"] .punto { animation: latido 1.6s ease-out infinite; }
@keyframes latido {
	0% { box-shadow: 0 0 0 0 rgb(224 54 43 / .55); }
	100% { box-shadow: 0 0 0 10px rgb(224 54 43 / 0); }
}
.al-aire__programa {
	margin-top: 4px;
	font-size: clamp(2.25rem, 7vw, 4.75rem); line-height: .98;
	font-weight: 820; font-stretch: 72%; letter-spacing: -.01em;
	color: var(--blanco); text-wrap: balance;
}
.al-aire__horario { margin-top: 10px; font-size: 1.0625rem; color: rgb(255 255 255 / .8); }

.al-aire__boton {
	display: inline-flex; align-items: center; gap: 14px; justify-self: start;
	background: none; border: 0; padding: 0; color: var(--blanco); cursor: pointer;
	font-size: 1.125rem; font-weight: 700; font-stretch: 90%;
}
.al-aire__circulo {
	display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%;
	background: var(--oro); color: var(--noche);
	transition: transform .12s ease;
}
.al-aire__circulo .icono { width: 30px; height: 30px; }
.al-aire__boton:hover .al-aire__circulo { transform: scale(1.05); }
.al-aire__boton:active .al-aire__circulo { transform: scale(.97); }

@media (min-width: 760px) {
	.al-aire__in { grid-template-columns: 1fr auto; padding-top: 36px; padding-bottom: 28px; gap: 32px; }
	.al-aire__boton { justify-self: end; flex-direction: column; gap: 10px; font-size: 1rem; }
	.al-aire__circulo { width: 96px; height: 96px; }
	.al-aire__circulo .icono { width: 42px; height: 42px; }
}

/* ---------- El dial ---------- */

.dial {
	background: var(--noche-2);
	overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
}
.dial::-webkit-scrollbar { display: none; }
.dial__pista {
	position: relative; min-width: 1440px; /* 60 px por hora */
	padding: 0 24px;
}
@media (min-width: 1200px) {
	.dial__pista { min-width: 0; max-width: var(--ancho); margin-inline: auto; padding: 0 var(--borde); }
}
.dial__franjas {
	display: grid; grid-template-columns: repeat(96, minmax(0, 1fr));
	border-left: 1px solid rgb(255 255 255 / .18);
}
.dial__franja {
	min-width: 0; padding: 12px 8px 14px;
	border-right: 1px solid rgb(255 255 255 / .18);
	border-top: 3px solid transparent;
	color: rgb(255 255 255 / .72);
}
.dial__hora { display: block; font-size: .75rem; font-variant-numeric: tabular-nums; color: rgb(255 255 255 / .55); }
.dial__nombre {
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
	margin-top: 2px; font-size: .875rem; line-height: 1.2; font-weight: 600; font-stretch: 85%;
	hyphens: auto; -webkit-hyphens: auto;
}
/* Programas de una hora: letra más chica para que el nombre quepa sin cortarse a la mitad. */
.dial__franja--corta { padding-inline: 5px; }
.dial__franja--corta .dial__nombre { font-size: .6875rem; font-stretch: 75%; -webkit-line-clamp: 4; }
.dial__franja.es-ahora {
	border-top-color: var(--oro);
	background: rgb(242 179 32 / .12);
	color: var(--blanco);
}
.dial__franja.es-ahora .dial__hora { color: var(--oro); }
.dial__aguja {
	position: absolute; top: 0; bottom: 22px;
	left: calc(24px + (100% - 48px) * var(--pos));
	width: 2px; margin-left: -1px; background: var(--oro);
	pointer-events: none;
}
.dial__aguja::before {
	content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
	border: 6px solid transparent; border-top: 8px solid var(--oro); border-bottom: 0;
}
@media (min-width: 1200px) {
	.dial__aguja { left: calc(var(--borde) + (100% - 2 * var(--borde)) * var(--pos)); }
}
.dial__escala { position: relative; height: 22px; }
.dial__escala li {
	position: absolute; top: 3px; left: calc(var(--h) / 24 * 100%);
	transform: translateX(-50%);
	font-size: .6875rem; font-variant-numeric: tabular-nums; color: rgb(255 255 255 / .45);
}
.dial__escala li:first-child { transform: none; }
.dial__escala li:last-child { transform: translateX(-100%); }

/* ---------- Notas ---------- */

.foto { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radio); background: var(--papel-2); }

.sin-foto {
	position: relative; display: flex; align-items: flex-end; width: 100%; aspect-ratio: 16 / 9;
	border-radius: var(--radio); overflow: hidden;
	background-color: var(--cat);
	background-image: repeating-radial-gradient(circle at 0 100%, rgb(255 255 255 / .13) 0 2px, transparent 2px 26px);
	color: var(--blanco); padding: 12px 14px;
}
.sin-foto__cat { font-weight: 800; font-stretch: 75%; font-size: 1.125rem; line-height: 1; margin-left: auto; opacity: .92; }

.nota { position: relative; }
.nota__img { display: block; }
.nota__cat {
	display: inline-block; font-size: .8125rem; font-weight: 700; font-stretch: 90%;
	color: var(--cat); text-decoration: none; margin-bottom: 4px;
}
.nota__cat:hover { text-decoration: underline; color: var(--cat); }
.nota__titulo { font-weight: 720; font-stretch: var(--angosta); line-height: 1.12; letter-spacing: -.005em; text-wrap: pretty; }
.nota__titulo a { color: var(--tinta); text-decoration: none; }
.nota__titulo a:hover { color: var(--senal); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.nota__fecha { margin-top: 6px; font-size: .8125rem; color: var(--tinta-2); }
.nota__bajada { margin-top: 10px; font-family: var(--serif); font-size: 1.0625rem; line-height: 1.55; color: var(--tinta-2); }

.nota--grande .nota__img { margin-bottom: 14px; }
.nota--grande .nota__titulo { font-size: clamp(1.75rem, 4.2vw, 2.75rem); line-height: 1.04; font-weight: 790; font-stretch: 76%; }

.nota--card .nota__img { margin-bottom: 10px; }
.nota--card .nota__titulo { font-size: 1.25rem; }

.nota--linea {
	display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; align-items: start;
	padding-block: 14px; border-top: 1px solid var(--linea);
}
.nota--linea .foto, .nota--linea .sin-foto { aspect-ratio: 3 / 2; }
.nota--linea .sin-foto__cat { display: none; }
.nota--linea .nota__titulo { font-size: 1.0625rem; }

.nota--texto { padding-block: 14px; border-top: 1px solid var(--linea); }
.nota--texto .nota__titulo { font-size: 1.0625rem; }

/* ---------- Portada ---------- */

.titulo-seccion {
	font-size: 1.75rem; font-weight: 820; font-stretch: 75%; line-height: 1.05; color: var(--tinta);
}
.titulo-seccion--chico { font-size: 1.25rem; padding-bottom: 4px; }

.portada-principal { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: 24px; padding-bottom: 8px; }
.portada-principal__lista .nota--linea:first-of-type { border-top-color: var(--tinta); }

@media (min-width: 960px) {
	.portada-principal { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); gap: 40px; padding-top: 36px; }
	.portada-principal__lista .titulo-seccion--chico { margin-top: 2px; }
}

.bloque { padding-top: 40px; }
.bloque__cabeza {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px;
	border-top: 5px solid var(--cat); padding-top: 10px; margin-bottom: 18px;
}
.bloque__cabeza .titulo-seccion { color: var(--cat); font-size: 2rem; }
.bloque__todas { font-weight: 650; font-size: .9375rem; color: var(--tinta); }
.bloque__todas:hover { color: var(--cat); }

.bloque__grilla { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 28px; }
/* En el celular, solo la primera card va grande; las otras pasan a línea. */
.bloque__grilla .nota--card:not(:first-child),
.relacionadas__grilla .nota--card {
	display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; align-items: start;
	padding-block: 14px; border-top: 1px solid var(--linea);
}
.bloque__grilla .nota--card:not(:first-child) .nota__img,
.relacionadas__grilla .nota--card .nota__img { margin: 0; }
.bloque__grilla .nota--card:not(:first-child) .foto,
.bloque__grilla .nota--card:not(:first-child) .sin-foto,
.relacionadas__grilla .nota--card .foto,
.relacionadas__grilla .nota--card .sin-foto { aspect-ratio: 3 / 2; }
.bloque__grilla .nota--card:not(:first-child) .sin-foto__cat,
.relacionadas__grilla .nota--card .sin-foto__cat { display: none; }
.bloque__grilla .nota--card:not(:first-child) .nota__titulo,
.relacionadas__grilla .nota--card .nota__titulo { font-size: 1.0625rem; }
.bloque__grilla .nota--card:first-child { padding-bottom: 14px; }

@media (min-width: 760px) {
	.bloque__grilla { grid-template-columns: repeat(12, minmax(0, 1fr)); }
	.bloque__grilla .nota--card,
	.bloque__grilla .nota--card:not(:first-child) {
		grid-column: span 4; display: block; padding: 0 0 20px; border: 0;
	}
	.bloque__grilla .nota--card:not(:first-child) .nota__img { margin-bottom: 10px; }
	.bloque__grilla .nota--card:not(:first-child) .foto,
	.bloque__grilla .nota--card:not(:first-child) .sin-foto { aspect-ratio: 16 / 9; }
	.bloque__grilla .nota--card:not(:first-child) .sin-foto__cat { display: block; }
	.bloque__grilla .nota--card:not(:first-child) .nota__titulo { font-size: 1.25rem; }
	.bloque__grilla .nota--texto { grid-column: span 3; }
}

/* Escríbenos: invitación a contactar por WhatsApp. */
.escribenos { margin-top: 48px; background: var(--papel-2); }
.escribenos__in { display: grid; gap: 16px; padding-block: 28px; align-items: center; }
.escribenos__titulo { font-size: 1.75rem; font-weight: 820; font-stretch: 75%; }
.escribenos p { margin-top: 4px; color: var(--tinta-2); font-size: 1.0625rem; }
@media (min-width: 760px) {
	.escribenos__in { grid-template-columns: 1fr auto; padding-block: 36px; }
}

/* ---------- Botones ---------- */

.boton {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px;
	padding: 0 20px; border-radius: 6px; border: 0;
	background: var(--noche); color: var(--blanco); text-decoration: none;
	font-weight: 700; font-stretch: 90%; font-size: 1rem; cursor: pointer;
}
.boton:hover { background: var(--noche-3); color: var(--blanco); }
.boton--whatsapp { background: var(--whatsapp); }
.boton--whatsapp:hover { background: #0e7a40; }
.boton--grande { min-height: 56px; font-size: 1.125rem; padding: 0 24px; }

/* ---------- Nota (artículo) ---------- */

.articulo { background: var(--blanco); padding-bottom: 40px; }
.articulo__cabeza { padding-top: 28px; }
.articulo__cat {
	display: inline-block; font-weight: 700; font-stretch: 90%; font-size: .9375rem;
	color: var(--cat); text-decoration: none;
	border-top: 4px solid var(--cat); padding-top: 6px;
}
.articulo__titulo {
	margin-top: 10px;
	font-size: clamp(2rem, 5.6vw, 3.25rem); line-height: 1.04; font-weight: 800; font-stretch: 74%;
	letter-spacing: -.01em; text-wrap: balance;
}
.articulo__bajada {
	margin-top: 14px; font-family: var(--serif); font-size: 1.25rem; line-height: 1.5; color: var(--tinta-2);
}
.articulo__meta {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px;
	margin-top: 20px; padding-block: 10px; border-block: 1px solid var(--linea);
}
.articulo__fecha { font-size: .9375rem; color: var(--tinta-2); }

.compartir { display: flex; align-items: center; gap: 6px; }
.compartir__txt { font-size: .875rem; color: var(--tinta-2); margin-right: 4px; }
.compartir__btn {
	display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	background: var(--papel); color: var(--tinta); border: 0; cursor: pointer; text-decoration: none;
}
.compartir__btn:hover { background: var(--papel-2); color: var(--tinta); }
.compartir__btn--whatsapp { background: var(--whatsapp); color: var(--blanco); }
.compartir__btn--whatsapp:hover { background: #0e7a40; color: var(--blanco); }
.compartir__btn.copiado { background: var(--bosque); color: var(--blanco); }

.articulo__foto { max-width: 1000px; margin: 24px auto 0; padding-inline: var(--borde); }
.articulo__foto figcaption { margin-top: 8px; font-size: .875rem; color: var(--tinta-2); }

.articulo__cuerpo {
	margin-top: 28px;
	font-family: var(--serif); font-size: 1.125rem; line-height: 1.75; color: var(--tinta);
	overflow-wrap: break-word;
}
.articulo__cuerpo > * + * { margin-top: 1.1em; }
.articulo__cuerpo p:empty { display: none; }
.articulo__cuerpo h2, .articulo__cuerpo h3 {
	font-family: var(--sans); font-stretch: 80%; font-weight: 780; line-height: 1.15; margin-top: 1.6em;
}
.articulo__cuerpo h2 { font-size: 1.625rem; }
.articulo__cuerpo h3 { font-size: 1.3125rem; }
.articulo__cuerpo strong, .articulo__cuerpo b { font-weight: 680; }
.articulo__cuerpo a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.articulo__cuerpo img { border-radius: var(--radio); }
.articulo__cuerpo figure { margin-inline: 0; }
.articulo__cuerpo figcaption, .articulo__cuerpo .wp-caption-text { font-family: var(--sans); font-size: .875rem; color: var(--tinta-2); margin-top: 6px; }
.articulo__cuerpo ul, .articulo__cuerpo ol { padding-left: 1.3em; }
.articulo__cuerpo ul { list-style: disc; }
.articulo__cuerpo ol { list-style: decimal; }
.articulo__cuerpo blockquote { margin-inline: 0; padding-left: 18px; border-left: 4px solid var(--cat); font-style: italic; }
.articulo__cuerpo iframe, .articulo__cuerpo video { max-width: 100%; }
.articulo__fuente {
	margin-top: 2em; padding-top: 12px; border-top: 1px solid var(--linea);
	font-family: var(--sans); font-size: .9375rem; color: var(--tinta-2);
}

@media (min-width: 760px) {
	.articulo__cabeza { padding-top: 48px; }
	.articulo__cuerpo { font-size: 1.1875rem; }
}

.relacionadas { padding-top: 36px; }
.relacionadas .titulo-seccion { color: var(--cat); border-top: 5px solid var(--cat); padding-top: 10px; margin-bottom: 16px; }
.relacionadas__grilla { display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) {
	.relacionadas__grilla { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
	.relacionadas__grilla .nota--card { display: block; padding: 0; border: 0; }
	.relacionadas__grilla .nota--card .nota__img { margin-bottom: 10px; }
	.relacionadas__grilla .nota--card .foto,
	.relacionadas__grilla .nota--card .sin-foto { aspect-ratio: 16 / 9; }
}

/* ---------- Archivos, búsqueda, páginas ---------- */

.archivo-cabeza { background: var(--noche); color: var(--blanco); padding: 28px 0 24px; }
.archivo-cabeza.cat-laraucania, .archivo-cabeza.cat-nacional { background: var(--cat); }
.archivo-cabeza__titulo { font-size: clamp(2.25rem, 7vw, 3.75rem); font-weight: 820; font-stretch: 72%; line-height: 1; }
.archivo-cabeza__tipo { margin-top: 6px; color: rgb(255 255 255 / .8); }

.lista-archivo { padding-top: 12px; padding-bottom: 24px; }
.lista-archivo > * { max-width: 860px; }
.lista-archivo .nota--linea .nota__titulo { font-size: 1.1875rem; }
.lista-archivo__resumen { padding-top: 16px; color: var(--tinta-2); }
@media (min-width: 760px) {
	.lista-archivo .nota--linea { grid-template-columns: 200px minmax(0, 1fr); gap: 20px; padding-block: 18px; }
	.lista-archivo .nota--linea .nota__titulo { font-size: 1.375rem; }
}

.paginacion { margin-top: 24px; }
.paginacion ul { display: flex; flex-wrap: wrap; gap: 6px; }
.paginacion a, .paginacion span {
	display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 12px;
	border-radius: var(--radio); background: var(--blanco); color: var(--tinta); text-decoration: none; font-weight: 650;
	border: 1px solid var(--linea);
}
.paginacion .current { background: var(--noche); color: var(--blanco); border-color: var(--noche); }
.paginacion .dots { background: none; border: 0; }

.vacio { padding-block: 24px; font-size: 1.125rem; color: var(--tinta-2); }

.buscador { display: flex; gap: 8px; margin-top: 16px; max-width: 560px; }
.buscador input {
	flex: 1; min-width: 0; min-height: 48px; padding: 0 14px; border-radius: 6px; border: 1px solid var(--linea);
	font: inherit; font-size: 1rem; color: var(--tinta); background: var(--blanco);
}
.buscador button {
	min-height: 48px; padding: 0 18px; border: 0; border-radius: 6px; cursor: pointer;
	background: var(--oro); color: var(--noche); font-weight: 750;
}

.pagina-simple { padding-top: 40px; padding-bottom: 40px; }
.pagina-simple h1 { font-size: clamp(2.25rem, 6vw, 3.25rem); font-weight: 820; font-stretch: 74%; line-height: 1.02; }
.pagina-simple > p { margin-top: 14px; font-size: 1.125rem; color: var(--tinta-2); }
.pagina-simple .boton { margin-top: 12px; }

.radio-ayuda .titulo-seccion { font-size: 1.75rem; }

.contacto__intro { font-size: 1.1875rem; }
.contacto .boton--whatsapp { margin-top: 20px; }
.contacto__datos { margin-top: 32px; display: grid; gap: 2px; font-size: 1.0625rem; }
.contacto__datos dt { font-weight: 700; }
.contacto__datos dd { margin: 0 0 14px; overflow-wrap: anywhere; }
@media (min-width: 600px) {
	.contacto__datos { grid-template-columns: max-content 1fr; gap: 12px 20px; }
	.contacto__datos dd { margin: 0; }
}
.contacto__redes { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.contacto__redes a { display: inline-flex; align-items: center; gap: 6px; }

.programacion-hoy { background: var(--noche); }
.programacion { display: grid; gap: 28px; padding-top: 32px; }
@media (min-width: 760px) { .programacion { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); } }
.programacion__dia h2 {
	font-size: 1.375rem; font-weight: 800; font-stretch: 78%;
	border-top: 4px solid var(--tinta); padding-top: 8px; margin-bottom: 4px;
}
.programacion__dia.es-hoy h2 { border-top-color: var(--oro); }
.programacion__hoy { font-size: .875rem; font-weight: 700; color: var(--tinta-2); margin-left: 6px; }
.programacion__dia li {
	display: grid; grid-template-columns: 7.5em 1fr auto; gap: 8px; align-items: baseline;
	padding: 10px 8px; border-bottom: 1px solid var(--linea);
}
.programacion__horas { font-variant-numeric: tabular-nums; color: var(--tinta-2); font-size: .9375rem; }
.programacion__nombre { font-weight: 650; }
.programacion__dia li.es-ahora { background: rgb(242 179 32 / .18); }
.programacion__ahora {
	display: inline-flex; align-items: center; gap: 6px; font-size: .8125rem; font-weight: 700; color: var(--vivo);
}
.programacion__ahora::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--vivo); }

/* ---------- Pie ---------- */

.pie { background: var(--noche); color: rgb(255 255 255 / .82); }
#contenido { padding-bottom: 56px; }
#contenido:has(> .escribenos:last-child), #contenido:has(> .articulo:last-child) { padding-bottom: 0; }
.pie__in { max-width: var(--ancho); margin-inline: auto; padding: 36px var(--borde) 12px; display: grid; gap: 28px; }
.pie__marca img { height: 64px; width: auto; }
.pie__marca p { margin-top: 10px; font-size: .9375rem; }
.pie h2 { font-size: 1rem; font-weight: 750; color: var(--blanco); margin-bottom: 8px; }
.pie li { margin-block: 6px; }
.pie a { color: rgb(255 255 255 / .86); text-decoration: none; }
.pie a:hover { color: var(--oro); }
.pie__redes { display: flex; gap: 8px; margin-top: 10px; }
.pie__redes a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--noche-2); }
.pie__legal {
	max-width: var(--ancho); margin-inline: auto; padding: 16px var(--borde) calc(24px + var(--barra) + env(safe-area-inset-bottom));
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px;
	font-size: .8125rem; color: rgb(255 255 255 / .55);
}
.pie__legal a { color: rgb(255 255 255 / .75); text-decoration: underline; text-underline-offset: 2px; }
.pie__credito { margin-left: auto; }
@media (min-width: 760px) { .pie__in { grid-template-columns: 1.4fr 1fr 1fr 1.4fr; } }

/* ---------- Reproductor fijo ---------- */

.reproductor {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px;
	min-height: var(--barra); padding: 8px var(--borde) calc(8px + env(safe-area-inset-bottom));
	background: var(--noche); color: var(--blanco);
	border-top: 1px solid rgb(255 255 255 / .12);
	box-shadow: 0 -8px 24px rgb(10 20 45 / .28);
}
.reproductor__boton {
	position: relative; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
	background: var(--oro); color: var(--noche); border: 0; cursor: pointer;
}
.reproductor__boton .icono { width: 24px; height: 24px; }
.reproductor__carga {
	position: absolute; inset: -4px; border-radius: 50%;
	border: 3px solid transparent; border-top-color: var(--oro);
	opacity: 0;
}
.reproductor[data-estado="cargando"] .reproductor__carga { opacity: 1; animation: gira .9s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }

.reproductor__texto { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 10px; align-items: baseline; }
.reproductor__vivo {
	grid-column: 1 / -1; display: flex; align-items: center; gap: 6px;
	font-size: .75rem; font-weight: 650; color: rgb(255 255 255 / .72);
}
.reproductor__vivo .punto { width: 8px; height: 8px; }
.reproductor[data-estado="error"] .reproductor__vivo .punto { background: #8a93a8; }
.reproductor__programa {
	font-size: 1.0625rem; font-weight: 750; font-stretch: 82%;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.reproductor__hasta { display: none; font-size: .875rem; color: rgb(255 255 255 / .65); white-space: nowrap; }
.reproductor__volumen { display: none; }

@media (min-width: 600px) {
	.reproductor__texto { grid-template-columns: auto auto; justify-content: start; }
	.reproductor__hasta { display: inline; }
}
@media (min-width: 960px) {
	.reproductor { padding-inline: max(var(--borde), calc((100vw - var(--ancho)) / 2 + var(--borde))); }
	.reproductor__volumen { display: block; }
	.reproductor__volumen input { width: 120px; accent-color: var(--oro); }
}

/* ---------- Menos movimiento ---------- */

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	html { scroll-behavior: auto; }
}
