/* Section: Case Study */

.tra-case-study {
	--tra-pad-block: 4rem;
}

.tra-case-study__heading {
	margin: 0;
}

.tra-case-study__intro {
	margin-top: 1.5rem;
}

/* Dark result panel (source: bg-brand-primary p-12 rounded-[4rem] my-12 shadow-2xl). */
.tra-case-study__panel {
	position: relative;
	margin: 3rem 0;
	padding: 2rem;
	border-radius: var(--tra-r-2xl);
	background-color: var(--tra-primary);
	box-shadow: var(--tra-shadow-2xl);
	color: #ffffff;
	--tra-ink: #ffffff;
	--tra-ink-soft: rgb(255 255 255 / 0.6);
	--tra-ink-faint: rgb(255 255 255 / 0.4);
	--tra-hairline: rgb(255 255 255 / 0.1);
}

@media (min-width: 768px) {
	.tra-case-study__panel {
		padding: 3rem;
		border-radius: var(--tra-r-4xl);
	}
}

/* Shared prose primitive only flips to white inside .tra-section--dark/.tra-panel. */
.tra-case-study__panel .tra-prose {
	color: rgb(255 255 255 / 0.9);
}

.tra-case-study__person {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2rem;
	margin-bottom: 2.5rem;
}

.tra-case-study__avatar {
	flex: 0 0 auto;
	width: 6rem;
	height: 6rem;
	border: 4px solid var(--tra-gold);
	border-radius: var(--tra-r-pill);
	object-fit: cover;
}

.tra-case-study__name {
	margin: 0;
	font-size: var(--tra-fs-2xl);
	font-weight: 900;
	line-height: 2rem;
	color: #ffffff;
}

.tra-case-study__role {
	margin: 0.25rem 0 0;
	font-size: var(--tra-fs-xs);
	font-weight: 700;
	line-height: 1rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--tra-gold);
}

/* Quote marks live on the <blockquote>, never in the stored value. */
.tra-case-study__quote {
	margin: 0 0 3rem;
	font-size: var(--tra-fs-lg);
	font-style: italic;
	line-height: 1.625;
	quotes: '"' '"';
}

.tra-case-study__quote p {
	margin: 0 0 2rem;
	font-style: italic;
}

.tra-case-study__quote p::before {
	content: open-quote;
}

.tra-case-study__quote p::after {
	content: close-quote;
}

.tra-case-study__stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
}

@media (min-width: 768px) {
	.tra-case-study__stats {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.tra-case-study__stat {
	padding: 1.5rem;
	border: 1px solid rgb(255 255 255 / 0.1);
	border-radius: var(--tra-r-lg);
	background-color: rgb(255 255 255 / 0.05);
}

.tra-case-study__value {
	margin: 0;
	font-size: var(--tra-fs-3xl);
	font-weight: 900;
	line-height: 2.25rem;
	color: var(--tra-gold);
}

.tra-case-study__label {
	margin: 0.25rem 0 0;
	font-size: var(--tra-fs-3xs);
	font-weight: 700;
	line-height: 1rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: rgb(255 255 255 / 0.4);
}

/* Beats Elementor's `.elementor img { border: none; border-radius: 0 }` reset. */
.tra-case-study img.tra-case-study__avatar {
	border: 4px solid var(--tra-gold);
	border-radius: var(--tra-r-pill);
}
