/**
 * Case + Show-case — Figma 269-10305 / 269-10458.
 */

body.single-case .us-orbit-header,
body.single-show-case .us-orbit-header {
	background: var(--wp--preset--color--offwhite, #f5f2ed);
}

.us-orbit-single-portfolio {
	display: flex;
	flex-direction: column;
	gap: 0;
	background: var(--wp--preset--color--white, #fff);
}

/* Hero — see rebrand-base (.us-orbit-single-portfolio .us-orbit-single-hero) */

/* Intro — centered 650px column, 60px padding */
.us-orbit-single-portfolio__intro {
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	padding: 3.75rem var(--us-orbit-container-padding-x, 1.5rem);
	background: var(--wp--preset--color--white, #fff);
}

.us-orbit-single-portfolio__intro-inner {
	width: 100%;
	max-width: 40.625rem;
}

.us-orbit-single-portfolio__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading, "stolzl", sans-serif);
	font-size: 2rem;
	font-weight: 500;
	line-height: 2.25rem;
	text-transform: uppercase;
	color: var(--wp--preset--color--black, #000);
}

.us-orbit-single-portfolio__content {
	margin-block-start: 0.625rem;
	font-family: var(--wp--preset--font-family--body, "helvetica-neue-lt-pro", "Helvetica Neue", Helvetica, Arial, sans-serif);
	font-size: 1.125rem;
	line-height: 1.444;
	color: var(--wp--preset--color--black, #000);
}

.us-orbit-single-portfolio__content > :first-child {
	margin-block-start: 0;
}

.us-orbit-single-portfolio__content > :last-child {
	margin-block-end: 0;
}

/* Related — Figma 269-10435 content slider (Other cases / Other shows) */
.us-orbit-single-portfolio__related {
	background: var(--wp--preset--color--white, #fff);
}

.us-orbit-single-portfolio__related-inner {
	box-sizing: border-box;
	width: 100%;
	padding: 1.5rem max(
			1.25rem,
			calc((100% - min(100%, var(--wp--style--global--wide-size, 82.5rem))) / 2)
		)
		3.75rem;
}

/* >3 slides: carousel bleeds to viewport; heading stays on content track */
.us-orbit-single-portfolio__related-inner:has(.us-orbit-single-portfolio__related-slider--expanded) {
	padding-inline: 0;
}

.us-orbit-single-portfolio__related-slider {
	width: 100%;
}

/* Figma heading2 — 48/52 + archive arrow (269:10305). */
.us-orbit-single-portfolio__related-slider--case .us-content-slider__header {
	padding-block: 1.5rem;
}

.us-orbit-single-portfolio__related-slider--case .us-content-slider__title {
	font-size: 3rem;
	line-height: 3.25rem;
	text-transform: none;
}

/* ≤3 slides: three equal columns on the content track */
@media (min-width: 64rem) {
	.us-orbit-single-portfolio__related-slider--compact.us-orbit-single-portfolio__related-slider--case .us-content-slider__slide,
	.us-orbit-single-portfolio__related-slider--compact.us-orbit-single-portfolio__related-slider--show-case .us-content-slider__slide {
		--us-slide-size: calc(
			(var(--us-slider-track-width) - (var(--us-slider-gap) * (var(--us-slider-visible) - 1))) / var(--us-slider-visible)
		);
	}
}

/* Figma card-article2 — 392×220.5 media, 40/48 title, 16/24 excerpt */
.us-orbit-single-portfolio__related-slider--case .us-content-slider__card-media--landscape {
	aspect-ratio: 392 / 220.5;
}

.us-orbit-single-portfolio__related-slider--case .us-content-slider__card-body--case {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.65625rem;
	padding-block: 1.5rem;
	padding-inline: 0;
}

.us-orbit-single-portfolio__related-slider--case .us-content-slider__card--case .us-content-slider__card-title {
	display: -webkit-box !important;
	overflow: hidden;
	width: 100%;
	font-size: 2.5rem;
	line-height: 3rem !important;
	text-transform: uppercase;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	transition: var(--us-hover-transition);
}

.us-orbit-single-portfolio__related-slider--case .us-content-slider__card--case:hover .us-content-slider__card-title,
.us-orbit-single-portfolio__related-slider--case .us-content-slider__card--case:focus-within .us-content-slider__card-title {
	color: var(--wp--preset--color--orange, #f89626);
}

.us-orbit-single-portfolio__related-slider--case .us-content-slider__card--case .us-content-slider__card-excerpt {
	display: -webkit-box;
	overflow: hidden;
	margin: 0;
	width: 100%;
	font-family: var(--wp--preset--font-family--body, "helvetica-neue-lt-pro", sans-serif);
	font-size: 1rem;
	line-height: 1.5rem;
	font-weight: 400;
	color: var(--wp--preset--color--black, #000);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
}

.us-orbit-single-portfolio__related-slider--show-case .us-content-slider__header {
	padding-block-start: 1.5rem;
}
