/**
 * Quotes — split / centered families + arrangement + quote chrome + width.
 * Companion to app.css. Forbidden: Splide; CSS overflow-x marketed as a carousel.
 */
.tw-quotes-split,
.tw-quotes-split__copy,
.tw-quotes-split__panel,
.tw-quotes-centered,
.tw-quotes-centered__panel,
.tw-quotes-body,
.tw-quotes-mosaic,
.tw-quotes-featured {
	min-width: 0;
}

.tw-quotes-split,
.tw-quotes-centered {
	gap: var(--tw-intro-panel-gap, calc(var(--tw-content-gap, 1rem) * 2));
}

.tw-quotes-split {
	display: flex;
	flex-direction: column;
}

.tw-quotes-centered {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.tw-quotes-split__panel,
.tw-quotes-centered__panel {
	gap: var(--tw-content-gap, 1rem);
}

.tw-quotes-split .tw-section-intro,
.tw-quotes-centered .tw-section-intro {
	display: flex;
	flex-direction: column;
	gap: var(--tw-content-gap, 1rem);
}

.tw-quotes-body--width[data-tw-quotes-width="theme"] {
	width: min(100%, var(--tw-container-max-width, 80rem));
	margin-inline: auto;
}

.tw-quotes-body--width[data-tw-quotes-width="sm"] {
	width: min(100%, 42rem);
	margin-inline: auto;
}

.tw-quotes-body--width[data-tw-quotes-width="md"] {
	width: min(100%, 48rem);
	margin-inline: auto;
}

.tw-quotes-body--width[data-tw-quotes-width="lg"] {
	width: min(100%, 56rem);
	margin-inline: auto;
}

.tw-quotes-body--width[data-tw-quotes-width="full"] {
	width: 100%;
	max-width: none;
}

.tw-quotes-body[data-tw-quotes-item-style="dark"] [data-tw-quotes-panel="dark"],
.tw-quotes-body[data-tw-quotes-item-style="dark"] .tw-quotes-featured__lead > figure,
.tw-quotes-body[data-tw-quotes-item-style="dark"] [data-tw-quotes-slide],
.tw-quotes-body[data-tw-quotes-item-style="dark"] .tw-quotes-mosaic > *,
.tw-quotes-body[data-tw-quotes-item-style="dark"] [data-tw-quotes-stacked] > * {
	background-color: var(--tw-color-text, #0f172a);
}

.tw-quotes-mosaic,
.tw-quotes-featured {
	display: grid;
	gap: var(--tw-content-gap, 1rem);
	grid-template-columns: minmax(0, 1fr);
	align-items: stretch;
}

.tw-quotes-mosaic > * {
	min-width: 0;
	height: 100%;
}

.tw-quotes-featured > *,
.tw-quotes-featured__list,
.tw-quotes-featured__list > li {
	min-width: 0;
}

.tw-quotes-featured__lead {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	align-self: stretch;
	min-width: 0;
	min-height: 0;
	width: 100%;
}

.tw-quotes-featured__lead > figure {
	height: auto;
	width: 100%;
	box-sizing: border-box;
	padding: var(--tw-card-padding, 1.5rem);
}

.tw-quotes-featured__list {
	display: flex;
	flex-direction: column;
	gap: var(--tw-content-gap, 1rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.tw-quotes-featured__list > li {
	border-block-start: 1px solid var(--tw-color-border);
}

.tw-quotes-featured__list > li:first-child {
	border-block-start: 0;
}

@media (min-width: 768px) {
	.tw-quotes-mosaic[data-tw-quotes-count="2"] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tw-quotes-mosaic[data-tw-quotes-count="3"] {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	}

	.tw-quotes-mosaic[data-tw-quotes-count="3"] > :first-child {
		grid-row: span 2;
	}

	.tw-quotes-mosaic[data-tw-quotes-count="4"],
	.tw-quotes-mosaic[data-tw-quotes-count="5"],
	.tw-quotes-mosaic[data-tw-quotes-count="6"] {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.tw-quotes-mosaic[data-tw-quotes-count="4"] > :first-child,
	.tw-quotes-mosaic[data-tw-quotes-count="5"] > :first-child,
	.tw-quotes-mosaic[data-tw-quotes-count="6"] > :first-child {
		grid-column: span 4;
		grid-row: span 2;
	}

	.tw-quotes-mosaic[data-tw-quotes-count="4"] > :not(:first-child),
	.tw-quotes-mosaic[data-tw-quotes-count="5"] > :not(:first-child),
	.tw-quotes-mosaic[data-tw-quotes-count="6"] > :not(:first-child) {
		grid-column: span 2;
	}
}

@media (min-width: 1024px) {
	.tw-quotes-featured:not([data-tw-quotes-count="1"]) {
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
		align-items: stretch;
	}

	.tw-quotes-featured:not([data-tw-quotes-count="1"]) .tw-quotes-featured__lead > figure {
		position: sticky;
		top: 6rem;
		z-index: 1;
	}
}

/* overflow:hidden on bleed shells is a sticky containing block that never scrolls.
   Clip media on .tw-section-bg; clip (not hidden) on the section so the lead can travel. */
section[data-section="quotes"].tw-section--bleed-bg,
section[data-section="quotes"].tw-section--bleed-band {
	overflow: clip;
}

@media (max-width: 1023.98px) {
	[data-tw-quotes-mobile-stack="above"] .tw-quotes-split__panel {
		order: -1;
	}
}

@media (min-width: 1024px) {
	.tw-quotes-split {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: stretch;
	}

	.tw-quotes-split[data-tw-quotes-split-ratio="60_40"] {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	}

	.tw-quotes-split[data-tw-quotes-split-ratio="75_25"] {
		grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
	}

	.tw-quotes-split[data-tw-quotes-panel-side="start"][data-tw-quotes-split-ratio="60_40"] {
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	}

	.tw-quotes-split[data-tw-quotes-panel-side="start"][data-tw-quotes-split-ratio="75_25"] {
		grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
	}

	.tw-quotes-split[data-tw-quotes-panel-side="start"] .tw-quotes-split__panel {
		order: -1;
	}

	.tw-quotes-split .tw-quotes-split__copy {
		align-self: stretch;
	}

	.tw-quotes-split .tw-quotes-split__copy .tw-section-intro {
		position: sticky;
		top: 6rem;
	}
}