/**
 * Dumar Sport — noticias (cada noticia y el listado /actualidad/).
 *
 * Se carga solo en esas páginas, después de main.css y de gallery.css (del
 * que reutiliza compartir y la paginación). El texto va sobre papel, en una
 * columna de lectura cómoda, con acento verde sombra; la franja de galerías
 * y la cabecera del listado van sobre grafito con acento lima. Sin
 * degradados ni efectos.
 *
 * Índice
 *  1. Cabecera de la noticia
 *  2. Imagen destacada
 *  3. Texto (bloques del editor)
 *  4. Compartir
 *  5. Galerías de la noticia
 *  6. Rejilla de noticias
 *  7. Listado de actualidad
 */

/* La columna de lectura: unos 70 caracteres por línea */
.news-head,
.news-body {
	--lectura: 46rem;
}

/* 1. Cabecera de la noticia
   ========================================================================== */

.news-head {
	padding-block: 24px 20px;
}

.news-head > * {
	max-width: var(--lectura);
	margin-inline: auto;
}

.news-head__back {
	margin-bottom: 18px;
}

.news-head__back .link {
	font-size: 0.875rem;
}

.news-head__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin-bottom: 14px;
	color: var(--ds-gris-pista);
	font-family: var(--font-display);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.news-head__title {
	font-size: clamp(2.125rem, 1.35rem + 3.4vw, 4rem);
	overflow-wrap: anywhere;
	text-wrap: balance;
}

.news-head__standfirst {
	margin-top: 16px;
	font-size: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
	line-height: 1.45;
}

/* Autoría y competición: rótulo pequeño encima y valor debajo */
.news-head__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 36px;
	margin-top: 20px;
	padding-top: 12px;
	border-top: 1px solid var(--ds-gris-linea);
}

.news-head__facts dt {
	color: var(--ds-gris-pista);
	font-family: var(--font-display);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
}

.news-head__facts dd {
	margin: 2px 0 0;
	font-weight: 600;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.news-head__facts a {
	border-bottom: 2px solid var(--ds-acento-claro);
}

@media (min-width: 768px) {
	.news-head {
		padding-block: 36px 28px;
	}
}

/* 2. Imagen destacada
   ==========================================================================
   Entera, sin recortes ni deformaciones (--r es su proporción; la fija la
   plantilla). Horizontal: a todo el ancho del contenedor. Vertical o
   cuadrada: centrada y con la altura limitada a la pantalla. */

.news-cover {
	margin-block: 8px 28px;
}

.news-cover__media {
	aspect-ratio: var(--r, 3 / 2);
	background: var(--ds-gris-linea);
}

.news-cover__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.news-cover--portrait .news-cover__media {
	width: min(100%, calc(78vh * var(--r, 0.667)));
	margin-inline: auto;
}

.news-cover__caption {
	max-width: 46rem;
	margin: 10px auto 0;
	color: var(--ds-gris-pista);
	font-size: 0.9375rem;
	line-height: 1.45;
}

/* Fuera del contenedor en móvil: la foto llega a los bordes */
@media (max-width: 599px) {
	.news-cover:not(.news-cover--portrait) {
		padding-inline: 0;
	}

	.news-cover__caption {
		padding-inline: var(--gutter);
	}
}

/* 3. Texto (bloques del editor)
   ========================================================================== */

.news-body {
	padding-bottom: 40px;
}

.news-content,
.news-share {
	max-width: var(--lectura);
	margin-inline: auto;
}

.news-content {
	font-size: 1.125rem;
	line-height: 1.65;
	overflow-wrap: break-word;
}

.news-content > * + * {
	margin-top: 1.1em;
}

.news-content a {
	color: var(--ds-texto-acento-claro);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.news-content h2,
.news-content h3,
.news-content h4 {
	margin-top: 1.6em;
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1.1;
}

.news-content h2 {
	font-size: 1.875rem;
}

.news-content h3 {
	font-size: 1.5rem;
}

.news-content h4 {
	font-size: 1.25rem;
}

/* Solo las listas del texto: no las cuadrículas del plugin ni de los bloques */
.news-content > ul,
.news-content > ol,
.news-content .wp-block-list {
	padding-left: 1.4em;
}

.news-content > ul,
.news-content ul.wp-block-list {
	list-style: square;
}

.news-content > ol,
.news-content ol.wp-block-list {
	list-style: decimal;
}

.news-content > ul li + li,
.news-content > ol li + li,
.news-content .wp-block-list li + li {
	margin-top: 0.35em;
}

.news-content > ul li::marker,
.news-content > ol li::marker,
.news-content .wp-block-list li::marker {
	color: var(--ds-acento-claro);
}

/* Cita: filete verde a la izquierda, texto mayor */
.news-content blockquote {
	margin-inline: 0;
	padding: 4px 0 4px 20px;
	border-left: 4px solid var(--ds-acento-claro);
	font-size: 1.25rem;
	line-height: 1.5;
}

.news-content blockquote cite {
	display: block;
	margin-top: 8px;
	color: var(--ds-gris-pista);
	font-size: 0.9375rem;
	font-style: normal;
}

.news-content figure {
	margin-inline: 0;
}

/* Imágenes del editor: nunca más anchas que su sitio ni deformadas */
.news-content img {
	max-width: 100%;
	height: auto;
}

.news-content figcaption,
.news-content .wp-element-caption {
	margin-top: 8px;
	color: var(--ds-gris-pista);
	font-size: 0.9375rem;
	line-height: 1.45;
	text-align: left;
}

/* Imagen interior recuperada del archivo histórico, en la posición de su
   marcador (dentro del párrafo original): bloque propio, sin recortar. */
.ds-interior {
	display: block;
	margin-block: 1.25em;
}

.ds-interior__img {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 80vh;
	height: auto;
}

.ds-interior__credito {
	display: block;
	margin-top: 8px;
}

/* Crédito de la foto (fotógrafo o créditos de la biblioteca) */
.ds-credito {
	color: var(--ds-gris-pista);
	font-family: var(--font-display);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Bloques a ancho amplio o completo: hasta el ancho del contenedor */
.news-content > .alignwide,
.news-content > .alignfull {
	width: min(100vw - var(--gutter) * 2, var(--container));
	max-width: none;
	margin-left: 50%;
	transform: translateX(-50%);
}

.news-content .alignleft {
	float: left;
	max-width: 50%;
	margin: 0.3em 1.5em 1em 0;
}

.news-content .alignright {
	float: right;
	max-width: 50%;
	margin: 0.3em 0 1em 1.5em;
}

.news-content .aligncenter {
	margin-inline: auto;
}

.news-content::after {
	content: "";
	display: table;
	clear: both;
}

/* Tablas: se desplazan dentro de su caja si no caben */
.news-content .wp-block-table {
	overflow-x: auto;
}

.news-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
}

.news-content th,
.news-content td {
	padding: 8px 10px;
	border-bottom: 1px solid var(--ds-gris-linea);
	text-align: left;
	vertical-align: top;
}

.news-content th {
	border-bottom-width: 2px;
	font-family: var(--font-display);
	letter-spacing: 0.04em;
}

/* Vídeos y otros incrustados: a lo ancho de la columna */
.news-content iframe {
	max-width: 100%;
}

.news-content hr {
	border: 0;
	border-top: 1px solid var(--ds-gris-linea);
}

/* Galería del plugin dentro del texto ([dumarsport_galeria]) */
.news-content .ds-galeria {
	margin-block: 1.5em;
}

/* Formulario de las noticias protegidas con contraseña */
.news-content .post-password-form input[type="password"] {
	min-height: 44px;
	padding: 8px 10px;
	border: 1px solid var(--ds-gris-pista);
	font: inherit;
}

.news-content .post-password-form input[type="submit"] {
	min-height: 44px;
	padding: 8px 18px;
	border: 0;
	background: var(--ds-acento-claro);
	color: var(--ds-sobre-acento-claro);
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
}

/* 4. Compartir (sobre papel)
   ========================================================================== */

.news-share {
	margin-top: 32px;
}

.news-share .share__button {
	border-color: var(--ds-acento-claro);
	color: var(--ds-grafito);
}

.news-share .share__button:hover {
	background: var(--ds-acento-claro);
	color: var(--ds-sobre-acento-claro);
}

.news-share .share__status {
	color: var(--ds-gris-pista);
}

/* 5. Galerías de la noticia
   ========================================================================== */

.news-galleries,
.news-archive__head {
	--accent: var(--ds-acento-oscuro);
	--on-accent: var(--ds-sobre-acento-oscuro);

	background: var(--ds-grafito);
	color: var(--ds-blanco);
}

.news-galleries {
	padding-block: 28px 36px;
}

.news-galleries .kicker--solid {
	margin-bottom: 16px;
}

@media (min-width: 768px) {
	.news-galleries {
		padding-block: 40px 48px;
	}
}

/* 6. Rejilla de noticias (relacionadas y listado)
   ========================================================================== */

.news-grid {
	display: grid;
	gap: 28px 24px;
}

@media (min-width: 600px) {
	.news-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.news-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* 7. Listado de actualidad
   ========================================================================== */

.news-archive__head {
	padding-block: 20px 22px;
}

.news-archive__title {
	font-size: clamp(2.5rem, 1.5rem + 4.5vw, 5rem);
	overflow-wrap: anywhere;
}

.news-archive__count {
	margin-top: 10px;
	color: var(--ds-gris-claro);
	font-size: 0.9375rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Filtro por categoría: enlaces normales, el actual marcado en lima */
.news-filter ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 18px;
}

.news-filter a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--ds-gris-borde);
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.news-filter a:hover {
	border-color: var(--accent);
}

.news-filter a[aria-current="page"] {
	border-color: var(--accent);
	background: var(--accent);
	color: var(--on-accent);
}

.news-archive__body {
	padding-block: 32px 48px;
}

.news-archive__empty {
	padding: 18px 20px;
	border: 1px solid var(--ds-gris-linea);
	background: var(--ds-blanco);
	color: var(--ds-gris-pista);
}

@media (min-width: 768px) {
	.news-archive__head {
		padding-block: 28px 30px;
	}

	.news-archive__body {
		padding-block: 44px 64px;
	}
}

/* Dos fondos heredados auditados: recuperar el contraste del enlace sin
   tocar la paleta global, la tipografía ni el contenido conservado. */
.news-content .news-content__contrast-repair {
	background-color: var(--ds-papel) !important;
}

/* Conservar el aspecto medido del H1 heredado al corregir su semántica.
   La segunda cabecera mantiene también su separación original. */
.news-content h2.news-content__legacy-heading,
.news-content div.news-content__legacy-heading {
	margin: 0;
	font-family: inherit;
	font-size: 2em;
	font-weight: 700;
	line-height: inherit;
}

.news-content > .news-content__legacy-heading:not(:first-child) {
	margin-top: 1.1em;
}

/* 8. Búsqueda y página no encontrada
   Reutilizan la cabecera grafito del listado (7). El buscador es el de la
   cabecera del sitio (form.search, main.css), aquí a lo ancho de la columna.
   ========================================================================== */

.search-page__summary {
	overflow-wrap: anywhere;
}

.search-page__form {
	max-width: 36rem;
	margin-top: 18px;
}

.search-page__form .search__input {
	padding-block: 12px 11px;
	font-size: 1rem;
}

.error-page__text {
	max-width: 40rem;
	margin-top: 12px;
	color: var(--ds-gris-claro);
	font-size: 1.0625rem;
	line-height: 1.55;
}

/* 9. Páginas estáticas
   Usan la cabecera y el texto de la noticia (1 y 3); solo la paginación
   interna (<!--nextpage-->) necesita estilo propio.
   ========================================================================== */

.static-page .news-head {
	padding-top: 32px;
}

.static-page__pages {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 2em;
	font-family: var(--font-display);
	font-weight: 600;
}