/*
 * Home page: the core and plugin blocks around the home blocks (templates/front-page.html, classes ns-home-*).
 * Enqueued by HomeSectionsBlock, so it only loads where the home sections render.
 */

/* Section head: H2 with a link on the right */
.ns-home-head {
	margin-bottom: var(--wp--preset--spacing--60);
}

.ns-home-head > * {
	margin: 0 !important;
}

.ns-home-head__link a,
.ns-home-sources__links a {
	font-weight: 600;
	text-decoration: none;
}

.ns-home-head__link a:hover,
.ns-home-sources__links a:hover {
	text-decoration: underline;
}

/* Most-viewed foods: one row of six on wide screens, the swipe row below that */
@media (min-width: 1100px) {
	.ns-home-foods .ns-related__nav {
		display: none;
	}

	.ns-home-foods .ns-related__scroller {
		overflow: visible;
		margin-inline: 0;
		padding: 0;
	}

	.ns-home-foods .ns-related__track {
		display: grid;
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.ns-home-foods .ns-related__track > .ns-related__item {
		flex: none;
	}
}

.ns-home-foods > p {
	margin-top: var(--wp--preset--spacing--40);
}

/* Latest from the blog: thumbnail rows on phones */
@media (max-width: 599px) {
	.ns-home-blog__posts {
		gap: 0 !important;
	}

	.ns-home-blog__card {
		display: grid !important;
		grid-template-columns: 112px minmax(0, 1fr);
		align-items: start;
		gap: var(--wp--preset--spacing--30) !important;
		min-height: 0 !important;
		padding: var(--wp--preset--spacing--40) 0 !important;
		border: 0 !important;
		border-bottom: 1px solid var(--wp--preset--color--line) !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}

	.ns-home-blog__card > .wp-block-post-featured-image {
		margin: 0 !important;
		border-radius: var(--wp--custom--radius--sm, 4px);
		overflow: hidden;
	}

	/* Blog images are 16:10 infographics: show them whole. */
	.ns-home-blog__card > .wp-block-post-featured-image img {
		aspect-ratio: 16 / 10 !important;
	}

	.ns-home-blog__body {
		margin: 0 !important;
		padding: 0 !important;
	}

	.ns-home-blog__body .wp-block-post-excerpt {
		display: none;
	}

	.ns-home-blog__body .wp-block-post-title {
		font-size: var(--wp--preset--font-size--label);
		line-height: var(--wp--custom--line-height--label);
	}
}

/* How we source our data */
.ns-home-sources__links {
	line-height: 2;
}
