.shk-related-articles {
	padding:
		64px
		var(--shk-page-gutter)
		48px;
	background: #ffffff;
	overflow: hidden;
}

/* Same width as article content */
.shk-related-articles__inner {
	width: min(70vw, 920px);
	margin-inline: auto;
}

.shk-related-articles__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 28px;
}

.shk-related-articles__heading {
	margin: 0;
	color: var(--shk-text);
	font: var(--text-h4);
/* 	font-family: "Oswald", sans-serif;
	font-size: 28px;
	font-weight: 400;
	line-height: 32px; */
}

.shk-related-articles__controls {
	display: flex;
	align-items: center;
	gap: 14px;
}
.shk-related-articles__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--shk-orange);
	font-family: "Lato", sans-serif;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	opacity: 1;
	transition:
		color 180ms ease,
		opacity 180ms ease;
}

.shk-related-articles__arrow:hover,
.shk-related-articles__arrow:focus-visible {
	background: transparent;
	color: #d9650b;
	transform: none;
}

.shk-related-articles__arrow:disabled {
	background: transparent;
	color: var(--shk-orange);
	opacity: 0.28;
	cursor: not-allowed;
	transform: none;
}

.shk-related-articles__arrow:focus-visible {
	outline: 1px solid var(--shk-orange);
	outline-offset: 3px;
	border-radius: 2px;
}

.shk-related-articles__viewport {
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-behavior: smooth;
	scrollbar-width: none;
	scroll-snap-type: x mandatory;
	overscroll-behavior-inline: contain;
}

.shk-related-articles__viewport::-webkit-scrollbar {
	display: none;
}

.shk-related-articles__track {
	display: flex;
	gap: 24px;
	width: max-content;
}

/* About 3 full cards plus a partial fourth */
.shk-related-articles__slide {
	flex:
		0
		0
		calc(
			(
				min(70vw, 920px) - (24px * 3)
			) / 3.35
		);
	min-width: 0;
	scroll-snap-align: start;
}

@media (max-width: 1024px) {
	.shk-related-articles {
		padding-top: 56px;
		padding-bottom: 80px;
	}

	.shk-related-articles__inner {
		width: min(82vw, 900px);
	}

	.shk-related-articles__slide {
		flex:
			0
			0
			calc(
				(
					min(82vw, 900px) - (24px * 2)
				) / 2.25
			);
	}
}

@media (max-width: 767px) {
	.shk-related-articles {
		padding-top: 48px;
		padding-bottom: 64px;
	}

	.shk-related-articles__inner {
		width: 100%;
	}

	.shk-related-articles__header {
		margin-bottom: 24px;
	}

	.shk-related-articles__heading {
		font-size: 28px;
		line-height: 32px;
	}

	.shk-related-articles__controls {
		gap: 8px;
	}

	.shk-related-articles__slide {
		flex:
			0
			0
			calc(
				(
					100vw - (var(--shk-page-gutter) * 2) - 24px
				) / 1.15
			);
	}
}

@media (prefers-reduced-motion: reduce) {
	.shk-related-articles__viewport {
		scroll-behavior: auto;
	}

	.shk-related-articles__arrow {
		transition: none;
	}
}

.shk-related-articles button.shk-related-articles__arrow,
.shk-related-articles button.shk-related-articles__arrow:hover,
.shk-related-articles button.shk-related-articles__arrow:focus,
.shk-related-articles button.shk-related-articles__arrow:active {
	border: 0;
	background: transparent;
	box-shadow: none;
}