/* =================================================================
   INTERPLAY — NEWS (listado acordeón)
   ================================================================= */
.news {
	min-height: 100vh;
	background: var(--color-white);
}
.news__inner {
	padding-block: var(--page-top) var(--space-9);   /* mismo espacio de cabecera que contact */
}

.news__title {
	max-width: var(--content-max);
	margin: 0 auto var(--space-8);
	padding-inline: var(--gutter);
	font: var(--font-project-title);       /* 80px */
	letter-spacing: var(--ls-default);
	color: var(--color-black);
}

/* --- Item: a todo el ancho (fondo/filete), contenido centrado --- */
.news-item {
	border-top: 1px solid var(--color-black);
	transition: background-color 0.3s ease;
}
.news-item:last-child { border-bottom: 1px solid var(--color-black); }

.news-item__row {
	max-width: var(--content-max);
	margin-inline: auto;
	padding: var(--space-5) var(--gutter);
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr) 280px 130px;
	gap: var(--space-6);
	align-items: start;
	cursor: pointer;
}

.news-item__date {
	font: var(--font-body);
	letter-spacing: var(--ls-default);
	color: var(--color-black);
	white-space: nowrap;
}
.news-item__title {
	margin: 0;
	font: var(--font-meta-title);          /* 18/600 */
	letter-spacing: var(--ls-default);
	color: var(--color-black);
}

.news-item__summary {
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	margin-top: 0;
	transition: max-height 0.4s ease, opacity 0.4s ease, margin-top 0.4s ease;
}
.news-item__summary p {
	margin: 0;
	font: var(--font-body);
	letter-spacing: var(--ls-default);
	color: var(--color-grey);
}

.news-item__media {
	overflow: hidden;
	transition: max-height 0.4s ease, opacity 0.4s ease;
}
.news-item__img { width: 100%; display: block; }

.news-item__link {
	justify-self: end;
	display: inline-flex;
	align-items: center;
	gap: var(--space-1);
	font: var(--font-meta-title);
	letter-spacing: var(--ls-default);
	color: var(--color-black);
	white-space: nowrap;
}
.news-item__link .icon { transition: transform 0.3s ease; }
.news-item__link:hover .icon { transform: translate(0.15em, -0.15em); }

/* --- Plegado: imagen = tira superior tenue --- */
.news-item[data-expanded="false"] .news-item__media {
	max-height: 40px;
	opacity: 0.45;
}
/* --- Expandido: imagen completa + resumen visible --- */
.news-item[data-expanded="true"] .news-item__media {
	max-height: 340px;
	opacity: 1;
}
.news-item[data-expanded="true"] .news-item__summary {
	max-height: 480px;
	opacity: 1;
	margin-top: var(--space-3);
}

/* --- Hover (solo plegado): fondo negro a todo el ancho, texto blanco --- */
.news-item[data-expanded="false"]:hover { background-color: #121212; }
.news-item[data-expanded="false"]:hover .news-item__date,
.news-item[data-expanded="false"]:hover .news-item__title,
.news-item[data-expanded="false"]:hover .news-item__link { color: var(--color-white); }

.news__pagination {
	max-width: var(--content-max);
	margin: var(--space-7) auto 0;
	padding-inline: var(--gutter);
	display: flex;
	gap: var(--space-3);
	font: var(--font-meta-title);
}
.news__pagination a,
.news__pagination .current { color: var(--color-black); }
.news__pagination .current { text-decoration: underline; text-underline-offset: 4px; }

.news__empty {
	max-width: var(--content-max);
	margin-inline: auto;
	padding-inline: var(--gutter);
	font: var(--font-body);
	color: var(--color-grey);
}

/* --- Responsive --- */
@media (max-width: 1024px) {
	.news-item__row { grid-template-columns: 100px minmax(0, 1fr) 200px 110px; gap: var(--space-4); }
}
@media (max-width: 720px) {
	.news__title { font-size: 48px; line-height: 1.05; }
	.news-item__row {
		grid-template-columns: 1fr;
		gap: var(--space-2);
	}
	.news-item__link { justify-self: start; }
	.news-item[data-expanded="false"] .news-item__media { max-height: 28px; }
	.news-item[data-expanded="true"] .news-item__media { max-height: 60vw; }
}

@media (max-width: 768px) {
	.news__inner { padding-top: 140px; }
}