/**
 * Legacy `testimonial` post type: archive (/testimonial/) and singles.
 * archive-testimonial.php and single-testimonial.php.
 *
 * The look is sigma/testimonials' own, not a new one: a gray-light band, the
 * quote in Cormorant Bold navy, the name beneath, gold as the accent. Sizes
 * are the block's tokens, stepped down for a phone and for the archive where
 * several quotes stack; no new colors, fonts or tokens.
 */

.testimonials-cpt {
	display: flex;
	flex-direction: column;
	/* Header plus band should reach the footer on a short single instead of
	   leaving white page under the quote (the bare version's empty gap). */
	min-height: 60vh;
}

.testimonials-cpt__article {
	display: flex;
	flex: 1 0 auto;
	flex-direction: column;
}

.testimonials-cpt__header {
	box-sizing: border-box;
	max-width: calc(var(--width-content) + 2 * var(--space-xl));
	margin-inline: auto;
	padding: var(--space-xl) var(--space-sm) var(--space-lg);
	text-align: center;
}

.testimonials-cpt__title {
	margin: 0;
	color: var(--color-navy);
	overflow-wrap: anywhere;
}

/* The band grows to fill the main, so it meets the footer edge to edge. */
.testimonials-cpt__band {
	box-sizing: border-box;
	flex: 1 0 auto;
	padding: var(--space-xl) var(--space-sm) var(--space-2xl);
	background-color: var(--color-gray-light);
	color: var(--color-navy);
}

.testimonials-cpt__list {
	display: grid;
	gap: var(--space-2xl);
}

.testimonials-cpt__card,
.testimonials-cpt__band > .testimonials-cpt__quote,
.testimonials-cpt__more {
	max-width: 944px;
	margin-inline: auto;
	text-align: center;
}

.testimonials-cpt__list > .testimonials-cpt__card {
	width: 100%;
	box-sizing: border-box;
}

.testimonials-cpt__quote {
	margin: 0;
	color: var(--color-navy);
}

.testimonials-cpt__quote p {
	margin: 0;
	font-family: var(--font-serif);
	font-size: clamp(var(--text-card-heading), 2.2vw, var(--text-h3));
	font-weight: var(--weight-serif-bold);
	font-style: normal;
	line-height: var(--leading-heading);
	color: var(--color-navy);
	overflow-wrap: break-word;
}

.testimonials-cpt__quote p + p {
	margin-top: var(--space-sm);
}

/* The single carries one quote on its own, so it takes the block's size. */
.testimonials-cpt--single .testimonials-cpt__quote p {
	font-size: clamp(var(--text-h3), 4vw, var(--text-quote));
}

/* Quote marks wrap the whole quote, not each paragraph. */
.testimonials-cpt__quote p:first-child::before {
	content: "\201C";
}

.testimonials-cpt__quote p:last-child::after {
	content: "\201D";
}

.testimonials-cpt__name {
	margin: var(--space-md) 0 0;
	font-family: var(--font-serif);
	font-size: var(--text-h3);
	font-weight: var(--weight-serif-bold);
	line-height: var(--leading-heading);
	color: var(--color-navy);
}

/* A short gold rule over the name, the block's accent, in place of stars. */
.testimonials-cpt__name::before {
	content: "";
	display: block;
	width: 3.75rem;
	height: 0.1875rem;
	margin: 0 auto var(--space-md);
	background-color: var(--color-gold);
}

.testimonials-cpt__name a,
.testimonials-cpt__more a {
	color: var(--color-navy);
	text-decoration: underline;
	text-decoration-color: var(--color-gold);
	text-decoration-thickness: 0.125rem;
	text-underline-offset: 0.2em;
}

.testimonials-cpt__name a:hover,
.testimonials-cpt__more a:hover {
	color: var(--color-gold-deep);
}

.testimonials-cpt__name a:focus-visible,
.testimonials-cpt__more a:focus-visible {
	outline: 2px solid var(--color-gold-deep);
	outline-offset: 4px;
}

/* Back link and the other names: one wrapping row, a thumb apart on a phone. */
.testimonials-cpt__more {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-xs) var(--space-lg);
	margin-top: var(--space-2xl);
	font-family: var(--font-serif);
	font-size: var(--text-card-heading);
	font-weight: var(--weight-serif-bold);
	line-height: var(--leading-heading);
}

.testimonials-cpt__more a {
	display: inline-block;
	padding-block: var(--space-xs);
}

@media (min-width: 768px) {
	.testimonials-cpt__header {
		padding: var(--space-2xl) var(--space-xl) var(--space-xl);
	}

	.testimonials-cpt__band {
		padding: var(--space-2xl) var(--space-xl);
	}
}