/* ── Transport related ───────────────────────────────────────────────────── */

.transport-related {
	margin-top: var(--wp--preset--spacing--60);
}

.transport-related__heading {
	margin-bottom: 1.5rem;
}

/* ── Grid: 3 columns on desktop ─────────────────────────────────────────── */

.transport-related__grid {
	display: flex;
	flex-flow: row wrap;
	gap: 1.5rem;
}

.transport-related__card {
	flex: 1 0 100%;
	max-width: 100%;
	display: flex;
	flex-direction: row;
	gap: 0.75rem;
	padding: 1rem;
	border: 1px solid #9ed3d1;
	border-radius: 0.5rem;
	background: #fff;
}

@media (min-width: 1024px) {
	.transport-related__card {
		flex: 1 0 calc(33.333% - 1rem);
		max-width: calc(33.333% - 1rem);
		flex-direction: row;
		flex-wrap: wrap;
	}
}

/* ── Thumbnail ──────────────────────────────────────────────────────────── */

.transport-related__thumbnail {
	flex: 0 0 5rem;
	max-width: 5rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 1024px) {
	.transport-related__thumbnail {
		flex: 0 0 7rem;
		max-width: 7rem;
	}
}

.transport-related__thumbnail a {
	display: flex;
	align-items: center;
	justify-content: center;
}

.transport-related__thumbnail img {
	max-height: 10rem;
	width: auto;
	max-width: 100%;
	object-fit: contain;
}

/* ── Content ────────────────────────────────────────────────────────────── */

.transport-related__content {
	flex: 1;
	min-width: 0;
}

.transport-related__title {
	color: #000;
	font-family: var(--wp--preset--font-family--titillium-web, 'Titillium Web', sans-serif);
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 28px;
	margin: 0 0 0.25rem;
}

.transport-related__title a {
	color: inherit;
	text-decoration: none;
}

.transport-related__title a:hover {
	text-decoration: underline;
}

.transport-related__kgm {
	font-size: 0.875rem;
	margin: 0 0 0.25rem;
}

.transport-related__summary {
	font-size: 0.875rem;
	margin-bottom: 0.5rem;
}

.transport-related__summary p:last-child {
	margin-bottom: 0;
}

.transport-related__link {
	display: inline-block;
	margin-top: 0.5rem;
	padding: 0.6em 1.2em;
	background-color: var(--wp--preset--color--purso-turkoosi);
	color: var(--wp--preset--color--white, #fff);
	font-size: var(--wp--preset--font-size--medium, 0.875rem);
	font-weight: 300;
	letter-spacing: 0.02em;
	line-height: 1;
	text-decoration: none;
	border: 1px solid transparent;
	border-radius: var(--wp--custom--radius--full, 9999px);
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.transport-related__link:hover {
	background-color: var(--wp--preset--color--white, #fff);
	color: var(--wp--preset--color--purso-turkoosi);
	border-color: var(--wp--preset--color--purso-turkoosi);
}

/* ── Load more ──────────────────────────────────────────────────────────── */

.transport-related .facetwp-load-more {
	display: inline-block;
	margin-top: 1.5rem;
	padding: 0.5rem 1.5rem;
	background: var(--wp--preset--color--purso-turkoosi);
	color: #fff;
	border: none;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	text-transform: uppercase;
}

.transport-related .facetwp-load-more:hover {
	opacity: 0.9;
}