/* Block: Latest posts. Figma: Home 1:51-1:67 */

.latest-posts__heading { margin-bottom: var(--space-m); }

.latest-posts {
	display: grid;
	grid-template-columns: 34.2% 48.6%; /* 609 and 865 of 1780 */
	justify-content: space-between;
	align-items: start;
}

.latest-posts__col--right { margin-top: clamp(40px, 7.6vw, 146px); }
.latest-posts__col .post-feature + .post-feature { margin-top: clamp(64px, 13.75vw, 264px); }
.latest-posts__more { margin-top: clamp(20px, 1.56vw, 30px); }

/* Card ---------------------------------------------------------------------- */
.post-feature__link { display: block; }
.post-feature__media { aspect-ratio: 609 / 520; }
.latest-posts__col--right .post-feature__media { aspect-ratio: 865 / 520; }

.post-feature__head {
	display: flex;
	align-items: flex-end;
	gap: clamp(8px, 0.63vw, 12px);
	margin-top: clamp(18px, 1.56vw, 30px);
}

.post-feature__title {
	padding-bottom: 0.1em;
	border-bottom: 2px solid currentColor;
	transition: opacity 0.3s var(--ease);
}

.post-feature__link:hover .post-feature__title { opacity: 0.6; }

.post-feature__number {
	flex: none;
	writing-mode: vertical-rl;
	line-height: 1;
}

.post-feature__excerpt {
	max-width: 33.5em;
	margin-top: clamp(16px, 1.46vw, 28px);
}

/* Right column mirrors: number first, everything right-aligned. */
.latest-posts__col--right .post-feature__head {
	flex-direction: row-reverse;
	justify-content: flex-start;
}

.latest-posts__col--right .post-feature__title { text-align: right; }

.latest-posts__col--right .post-feature__excerpt {
	margin-left: auto;
	text-align: right;
}

@media (max-width: 1024px) {
	.latest-posts { grid-template-columns: 1fr; gap: var(--space-m); }
	.latest-posts__col--right { margin-top: 0; }
	.latest-posts__col .post-feature + .post-feature { margin-top: var(--space-m); }

	.post-feature__media,
	.latest-posts__col--right .post-feature__media { aspect-ratio: 3 / 2; }

	.latest-posts__col--right .post-feature__head { flex-direction: row; }
	.latest-posts__col--right .post-feature__title { text-align: left; }

	.latest-posts__col--right .post-feature__excerpt {
		margin-left: 0;
		text-align: left;
	}
}
