/* Case archive only. Shared tokens, real project media, no global overrides. */
.cases-archive__main { padding-top: var(--space-10); }
.cases-archive .archive-intro { margin-bottom: var(--space-8); max-width: none; }
.cases-archive .archive-intro__title { font-size: var(--text-section-title); }

.case-showcase {
	display: grid;
	gap: var(--space-6);
	padding-bottom: var(--space-10);
	border-bottom: 1px solid var(--color-line-strong);
}
.case-showcase__viewport { display: grid; min-width: 0; contain: layout; touch-action: pan-y pinch-zoom; }
.case-showcase__slide {
	display: none;
	grid-area: 1 / 1;
	align-content: start;
	gap: var(--space-6);
	min-width: 0;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--transition-base);
}
.case-showcase__slide.is-active { display: grid; visibility: visible; opacity: 1; pointer-events: auto; }
.case-showcase__media { position: relative; align-self: start; aspect-ratio: 8 / 5; min-width: 0; }
.case-showcase__desktop,
.case-showcase__mobile {
	overflow: hidden;
	border: 1px solid var(--color-line-strong);
	border-radius: var(--radius-md);
	background: var(--color-surface);
}
.case-showcase__desktop { width: 100%; }
.case-showcase__desktop img,
.case-showcase__mobile img { display: block; width: 100%; height: auto; }
.case-showcase__media--paired .case-showcase__desktop { width: 88%; }
.case-showcase__mobile { position: absolute; right: 0; bottom: 0; width: 25%; box-shadow: var(--shadow-soft); }
.case-showcase__mobile:only-child { position: static; margin-inline: auto; }
.case-showcase__content { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.case-showcase__content:only-child { grid-column: 1 / -1; }
.case-showcase__type,
.case-teaser__type {
	font-family: var(--font-headline);
	font-size: var(--text-small);
	font-weight: 500;
	letter-spacing: var(--tracking-caps-sm);
	text-transform: uppercase;
	color: var(--color-text-muted);
}
.case-showcase__title { margin-top: var(--space-3); font-size: var(--text-h3); line-height: var(--leading-heading); text-transform: none; overflow-wrap: anywhere; }
.case-showcase__summary { margin-top: var(--space-5); font-size: var(--text-base); line-height: var(--leading-base); color: var(--color-text-body); }
.case-showcase__metrics,
.case-showcase__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); width: 100%; margin-top: var(--space-6); }
.case-showcase__metrics li + li,
.case-showcase__facts li + li { padding-left: var(--space-5); border-left: 1px solid var(--color-line-strong); }
.case-showcase__metrics strong { display: block; font-family: var(--font-headline); font-size: var(--text-h3); font-weight: 500; line-height: var(--leading-heading); }
.case-showcase__metrics span { display: block; margin-top: var(--space-2); font-size: var(--text-small); line-height: var(--leading-base); color: var(--color-text-body); }
.case-showcase__metrics small { display: block; margin-top: var(--space-3); font-size: var(--text-small); line-height: var(--leading-base); color: var(--color-text-muted); }
.case-showcase__facts { font-family: var(--font-headline); font-size: var(--text-card-title); line-height: var(--leading-heading); }
.case-showcase__link { margin-top: var(--space-6); }
.case-showcase__controls { display: grid; grid-row: 1; gap: var(--space-4); }
.case-showcase__controls[hidden] { display: grid; visibility: hidden; }
.case-showcase__arrows { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.case-showcase__arrow {
	display: grid;
	place-items: center;
	width: var(--button-height-sm);
	height: var(--button-height-sm);
	padding: var(--space-3);
	border: 1px solid var(--color-line-strong);
	border-radius: var(--radius-sm);
	transition: background-color var(--transition-fast), border-color var(--transition-fast);
}
.case-showcase__arrow:hover { background: var(--color-surface-strong); border-color: var(--color-primary); }
.case-showcase__arrow--previous .icon { transform: rotate(180deg); }
.case-showcase__counter { font-family: var(--font-headline); font-size: var(--text-small); letter-spacing: var(--tracking-caps-sm); font-variant-numeric: tabular-nums; }
.case-showcase__tabs { display: grid; grid-template-columns: repeat(var(--case-tab-count, 3), minmax(0, 1fr)); gap: var(--space-2); min-width: 0; }
.case-showcase__tab {
	min-width: 0;
	min-height: var(--button-height-sm);
	padding: var(--space-2);
	border-bottom: 2px solid transparent;
	font-family: var(--font-headline);
	font-size: var(--text-small);
	font-weight: 500;
	line-height: var(--leading-base);
	color: var(--color-text-muted);
	transition: color var(--transition-fast), border-color var(--transition-fast);
}
.case-showcase__tab[aria-selected="true"] { color: var(--color-text); border-color: var(--color-primary); }
.cases-index { padding-top: var(--space-10); }
.cases-index__title,
.cases-archive-cta__title { font-size: var(--text-section-title); line-height: var(--leading-heading); }
.cases-index .case-filter { margin-top: var(--space-6); margin-bottom: var(--space-6); }
.cases-index .case-filter__item { display: inline-flex; align-items: center; min-height: var(--button-height-sm); padding: var(--space-2) var(--space-3); font-size: var(--text-label); letter-spacing: var(--tracking-caps-sm); }
.cases-index__grid { display: grid; gap: var(--space-6); }
.case-teaser { align-self: start; min-width: 0; background: var(--color-surface); }
.case-teaser__link { display: block; contain: layout; border: 1px solid var(--color-line); transition: border-color var(--transition-fast); }
.case-teaser__link:hover,
.case-teaser__link:focus-visible { border-color: var(--color-primary-line); }
.case-teaser__media { overflow: hidden; }
.case-teaser__media img { display: block; width: 100%; height: auto; }
.case-teaser__body { padding: var(--space-5); }
.case-teaser__title { font-size: var(--text-card-title); line-height: var(--leading-heading); text-transform: none; }
.case-teaser__type { margin-top: var(--space-3); font-size: var(--text-label); }
.case-teaser__more { display: inline-flex; align-items: center; gap: var(--space-3); margin-top: var(--space-4); font-family: var(--font-headline); font-size: var(--text-label); font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--color-primary); }
.cases-archive-cta { padding-block: var(--space-12); border-block: 1px solid var(--color-line); background: var(--color-surface); }
.cases-archive-cta__inner { display: grid; gap: var(--space-6); align-items: center; }
.cases-archive-cta__text { max-width: var(--container-narrow); margin-top: var(--space-5); color: var(--color-text-body); }
.cases-archive-cta__inner > .button { justify-self: start; }

@media (min-width: 48rem) {
	.cases-archive__main { padding-top: var(--space-12); }
	.case-showcase { gap: var(--space-10); padding-bottom: var(--space-12); }
	.case-showcase__arrows { justify-content: flex-start; }
	.case-showcase__tabs { gap: var(--space-6); }
	.case-showcase__tab { font-size: var(--text-base); }
	.cases-index { padding-top: var(--space-12); }
	.cases-index__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cases-archive-cta { padding-block: var(--space-16); }
}
@media (min-width: 64rem) {
	.cases-archive .archive-intro { margin-bottom: var(--space-10); }
	.case-showcase__slide { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: var(--space-12); }
	.case-showcase__media { aspect-ratio: 8 / 5.4; }
	.case-showcase__title { font-size: clamp(var(--text-h3), 3vw, 2.75rem); }
	.case-showcase__content { padding-top: var(--space-2); }
	.case-showcase__link { order: 1; margin-top: var(--space-8); }
	.case-showcase__controls { grid-row: 2; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-8); align-items: center; }
	.case-showcase__tabs { padding-left: var(--space-8); border-left: 1px solid var(--color-line-strong); }
	.cases-index__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cases-archive-cta__inner { grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-12); }
	.cases-archive-cta__title { font-size: var(--text-h3); }
}
@media (prefers-reduced-motion: reduce) {
	.case-showcase__slide { transition: none; }
}
@media (scripting: none) {
	.case-showcase__controls[hidden] { display: none; }
}