/**
 * News Element — Magazine 9 block (news-element's magazine-9).
 * Structure only; column widths, heights, spacing, overlay and colours come
 * from the block's controls. Runs inside the Grid view
 * (.ne-grid-items.mag_nine_one / .mag_nine_two).
 */

/* Two columns: big post | thumbnail list. :where() (2026-10-31) keeps the 50/50 a default under Column width
   (wcol_1 / wcol_2): this file loads after the post CSS and, at equal specificity, used to win. */
:where(.ne-grid-items[class*="mag_nine_"] > .mag9-first),
:where(.ne-grid-items[class*="mag_nine_"] > .mag9-rest) {
	flex: 0 0 50%;
	max-width: 50%;
}

.ne-grid-items[class*="mag_nine_"] > .mag9-rest {
	display: block;
}

.mag9-first .post-item {
	align-self: flex-start; /* don't stretch to the list column's height */
	display: block;
	width: 100%;
}

.mag9-first .ft-thumbwrap {
	display: block;
}

.mag9-classic .excerpt-wrap {
	margin-top: 15px;
}

.mag9-overlay .excerpt-wrap {
	box-sizing: border-box;
	padding: 20px;
}

/* Thumbnail rows. */
.mag9-row {
	gap: 15px;
}

.mag9-row:not(:last-child) {
	margin-bottom: 20px;
}

.mag9-row .ft-thumbwrap {
	display: block;
	flex: 0 0 auto;
	width: 120px;
}

.mag9-row .excerpt-wrap {
	flex: 1 1 0;
	min-width: 0;
}

@media (max-width: 767px) {
	.ne-grid-items[class*="mag_nine_"] > .mag9-first,
	.ne-grid-items[class*="mag_nine_"] > .mag9-rest {
		flex-basis: 100% !important;
		max-width: 100% !important;
	}
}

/* Title defaults (Post title controls override). */
:where(.mag9-first) .ne-title {
	margin: 8px 0;
	font-size: 26px;
	line-height: 1.3;
}

:where(.mag9-row) .ne-title {
	margin: 0 0 4px;
	font-size: 16px;
	line-height: 1.4;
}

.mag9-first .ne-title a,
.mag9-row .ne-title a {
	text-decoration: none;
}