/* ==========================================================================
   Страница кейса (single-case.php) — детальная страница отдельного кейса.

   Обёртка помечена двумя классами: .article__page .case__page — благодаря
   этому вся типографика (h1/h2/h3, .article__body, отступы, чёрный текст на
   белом фоне) и белый фон main/header под неё приходят бесплатно из
   article.css. Переиспользованы без изменений: .article__layout,
   .article__sidebar, .article__service(-card/-content/-label),
   .article__meta(-item), .article__cats/.article__cat-badge,
   .article__share*, .article__tags/.article__tag, .article__related*,
   .author-page__grid/.author-page__card* (из author.css).

   Здесь — только то, чего не хватает: шапка с логотипом клиента, обложка
   кейса и карточка «Профиль проекта» в сайдбаре.
   ========================================================================== */

.case__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.case__title-group {
	flex: 1;
	min-width: 240px;
}

.case__client-logo {
	max-width: 160px;
	max-height: 64px;
	object-fit: contain;
	flex-shrink: 0;
}

.case__lead {
	font-size: 1.05rem;
	line-height: 1.6;
	color: #444;
	max-width: 750px;
	margin: 12px 0 28px;
}

.case__cover {
	width: 100%;
	margin: 8px 0 32px;
}

.case__cover img {
	width: 100%;
	height: auto;
	max-height: 460px;
	object-fit: cover;
	border-radius: 12px;
	display: block;
}

/* --- Профиль проекта (карточка в сайдбаре) --- */

.case__profile {
	text-align: center;
}

.case__profile-logo {
	max-width: 140px;
	max-height: 56px;
	object-fit: contain;
	margin: 0 auto 16px;
	display: block;
}

.case__facts {
	text-align: left;
	margin: 0 0 20px;
}

.case__facts dt {
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #999;
	margin-top: 14px;
}

.case__facts dt:first-child {
	margin-top: 0;
}

.case__facts dd {
	margin: 3px 0 0;
	font-size: 0.92rem;
	font-weight: 500;
	color: var(--black);
}

.case__profile button[data-popup] {
	width: 100%;
	margin: 4px 0 0;
	background: var(--black);
	border-color: var(--black);
	color: #fff;
}

.case__profile button[data-popup]:hover {
	opacity: 0.85;
	background: var(--black);
}

@media (max-width: 600px) {
	.case__header {
		gap: 16px;
	}

	.case__client-logo {
		max-width: 120px;
		max-height: 48px;
	}

	.case__lead {
		font-size: 0.98rem;
	}

	.case__cover img {
		max-height: 260px;
		border-radius: 8px;
	}
}