/* Blog post → case studies (html/com_content/article/_related_cases.php, SEO audit 2026-10-19).
   #ds-boost: id-level specificity so T4's image and link rules don't win (see docs/05-design-system.md). */
:root :is(#ds-boost, .pxrc) {
	margin: 40px 0 8px;
	padding: 24px;
	border: 1px solid var(--ds-line);
	border-radius: var(--ds-r-lg);
	background: var(--ds-soft);
}
:root :is(#ds-boost, .pxrc-head) { margin-bottom: 16px; }
:root :is(#ds-boost, .pxrc-eyebrow) {
	margin: 0 0 6px;
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ds-green-ink);
}
:root :is(#ds-boost, .pxrc-title) {
	margin: 0;
	font-size: var(--ds-h3-content);
	font-weight: 700;
	line-height: 1.3;
	color: var(--ds-navy);
}
:root :is(#ds-boost, .pxrc-list) {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 12px;
}
:root :is(#ds-boost, .pxrc-case) {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--ds-line);
	border-radius: var(--ds-r-md);
	background: #fff;
	color: var(--ds-navy);
	text-decoration: none;
	transition: box-shadow .2s, transform .2s;
}
:root :is(#ds-boost, .pxrc-case):hover,
:root :is(#ds-boost, .pxrc-case):focus-visible {
	color: var(--ds-navy);
	text-decoration: none;
	box-shadow: var(--ds-sh-hover);
	transform: translateY(-2px);
}
:root :is(#ds-boost, .pxrc-case) img {
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	object-position: top;
	margin: 0;
	border-bottom: 1px solid var(--ds-line);
	border-radius: 0;
}
:root :is(#ds-boost, .pxrc-case) span {
	padding: 14px 16px 16px;
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.4;
}
:root :is(#ds-boost, .pxrc-case) i { margin-left: 4px; font-size: .8em; color: var(--ds-green-ink); }
@media (max-width: 575.98px) {
	:root :is(#ds-boost, .pxrc) { padding: 18px; margin-top: 32px; }
}