/* ==========================================================================
   Case study single (single-case_study.php, .wf-case-study) and the
   /case-studies/ archive (page-case-studies.php, .wf-case-studies) -- both
   alongside .wf-industry.wf-service on <main>, see inc/case-study.php.

   Loaded AFTER assets/css/industry.css and assets/css/service.css, which own
   the shared section primitives both templates reuse (.wf-industry__section,
   .wf-home-head, .wf-svc-prose, .wf-ind-cases__* card markup, the stat-cards
   element). Only the case-study-only blocks live here: the client strip, the
   story-block alternation, the pull quote, the gallery grid, and the archive
   card's logo/stat-line additions.

   SPECIFICITY NOTE -- same as industry.css/service.css/contact.css:
   Elementor's kit stylesheet ships element rules at 0-1-1
   (.elementor-kit-6 a / button / img), which beat a bare single class, so the
   .wf-case-study/.wf-case-studies scope on every rule (plus the resets below)
   is load-bearing, not cosmetic.
   ========================================================================== */

/* ---------- Scope resets ---------- */
body .wf-case-study a,
body .wf-case-studies a {
	color: inherit;
}

body .wf-case-study img,
body .wf-case-studies img {
	border-radius: 0;
	max-width: 100%;
	height: auto;
}

.wf-case-study [hidden],
.wf-case-studies [hidden] {
	display: none !important;
}

/* ---------- Client strip (single only) ---------- */
.wf-case-study__client {
	background: var(--wf-bg);
	border-bottom: 1px solid var(--wf-border);
}

.wf-case-study__client-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 24px;
	padding-block: 24px;
}

.wf-case-study__client-logo {
	max-height: 48px;
	width: auto;
}

.wf-case-study__client-name {
	margin: 0;
	font: 600 .9375rem/1.4 var(--wf-font-body);
	color: var(--wf-text-dark);
}

.wf-case-study__client-length {
	margin: 0;
	font: 400 .875rem/1.4 var(--wf-font-body);
	color: var(--wf-text-mute);
}

.wf-case-study__client-chips {
	margin: 0 0 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.wf-case-study .wf-case-study__chip {
	display: inline-block;
	padding: 6px 12px;
	border: 1px solid var(--wf-border);
	border-radius: var(--wf-radius-sm);
	font: 600 .75rem/1.2 var(--wf-font-body);
	letter-spacing: .02em;
	color: var(--wf-steel);
	transition: border-color var(--wf-dur) var(--wf-ease), color var(--wf-dur) var(--wf-ease);
}

.wf-case-study .wf-case-study__chip:hover {
	border-color: var(--wf-blue);
	color: var(--wf-blue);
}

/* ---------- Story blocks (Challenge / Solution / Results) ---------- */
.wf-case-study .wf-case-study__section--story {
	background: var(--wf-white);
}

.wf-case-study .wf-case-study__section--story.wf-case-study__section--alt {
	background: var(--wf-bg);
}

/* ---------- Pull quote ---------- */
.wf-case-study__quote {
	max-width: 780px;
	margin: 0 auto;
	padding: 0;
	border: 0;
	text-align: center;
}

.wf-case-study__quote-text {
	margin: 0;
	font: 700 1.5rem/1.5 var(--wf-font-display);
	color: var(--wf-navy);
}

.wf-case-study__quote-text::before {
	content: '\201C';
	display: block;
	font: 700 3rem/1 var(--wf-font-display);
	color: var(--wf-cyan);
	margin-bottom: 8px;
}

.wf-case-study__quote-attribution {
	display: block;
	margin-top: 20px;
	font: 400 .9375rem/1.4 var(--wf-font-body);
	font-style: normal;
	color: var(--wf-text-mute);
}

/* ---------- Gallery ---------- */
.wf-case-study__gallery {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

@media (min-width: 640px) {
	.wf-case-study__gallery {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1000px) {
	.wf-case-study__gallery {
		grid-template-columns: repeat(3, 1fr);
	}
}

.wf-case-study__gallery-item {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--wf-radius-md);
}

.wf-case-study .wf-case-study__gallery-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------- Archive card additions (client logo + first-metric stat line,
   template-parts/case-study/card.php with show_logo/show_metric true) ----- */
.wf-case-studies__card-logo {
	display: block;
	max-height: 32px;
	width: auto;
	margin-bottom: 12px;
}

.wf-case-studies__card-stat {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 12px 0 0;
}

.wf-case-studies__card-stat-num {
	font: 700 1.25rem/1 var(--wf-font-display);
	color: var(--wf-blue);
}

.wf-case-studies__card-stat-label {
	font: 400 .8125rem/1.3 var(--wf-font-body);
	color: var(--wf-text-mute);
}