/**
 * Variant CSS: testimonials--quad-zebra-aligned-rows
 * Layer 2 — Path B testimonials role (2026-06-10).
 * Exactly FOUR full-width testimonial rows in a ZEBRA layout: odd rows place
 * the avatar+stars block on the LEFT with left-aligned quote text; even rows
 * mirror it (row-reverse → avatar on the RIGHT, right-aligned text). The eye
 * zig-zags left/right down the column, reading like a back-and-forth
 * conversation. Rows are hairline-separated.
 * Distinct from stacked-rows-avatars (every row identical, avatar always left)
 * and quad-quote-grid (static 2×2 card grid). On mobile the zig-zag flattens:
 * avatar on top, everything left-aligned, no horizontal overflow.
 * Every selector scoped to .universal-testimonials--quad-zebra-aligned-rows.
 */

body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows {
	background: var(--background);
	color: var(--text-primary);
}

/* ---- intro (centered → auto horizontal margins, A8) ------------------- */
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__intro {
	text-align: center;
	margin: 0 auto var(--space-7, 48px) auto;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__kicker {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-widest, 0.16em) !important;
	text-transform: uppercase !important;
	color: var(--accent) !important;
	margin: 0 auto var(--space-3, 12px) auto !important;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__headline {
	font-family: var(--font-display) !important;
	color: var(--text-primary) !important;
	margin: 0 auto !important;
}

/* ---- rows stack: even vertical rhythm, hairline seams ----------------- */
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__rows {
	display: flex;
	flex-direction: column;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row {
	gap: var(--space-6, 32px) !important;
	align-items: center !important;
	padding: var(--space-6, 32px) 0;
	border-top: 1px solid var(--divider-primary);
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row:last-child {
	border-bottom: 1px solid var(--divider-primary);
}

/* ---- even rows mirror: avatar swaps to the right, text right-aligns --- */
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row--even {
	flex-direction: row-reverse !important;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row--even .universal-testimonials__side {
	text-align: center;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row--even .universal-testimonials__body {
	text-align: right;
}

/* ---- side column: avatar + stars, fixed-ish width --------------------- */
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__side {
	flex: 0 0 auto;
	width: 120px;
	text-align: center;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__avatar {
	margin: 0 auto var(--space-2, 8px) auto !important;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__avatar img {
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--background-card, var(--background-alt));
	box-shadow: 0 0 0 1px var(--divider-primary);
}

/* ---- star motif (static, decorative — not a fabricated metric) ------- */
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__stars {
	font-size: var(--text-sm) !important;
	line-height: 1 !important;
	letter-spacing: 0.08em !important;
	color: var(--accent) !important;
	margin: 0 !important;
}

/* ---- body column: quote + author ------------------------------------- */
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__body {
	flex: 1 1 auto;
	min-width: 0;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__quote {
	font-family: var(--font-display) !important;
	font-size: var(--text-lg) !important;
	line-height: var(--leading-snug, 1.4) !important;
	color: var(--text-primary) !important;
	margin: 0 0 var(--space-3, 12px) 0 !important;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__name {
	font-family: var(--font-display) !important;
	font-size: var(--text-sm) !important;
	font-weight: 600 !important;
	color: var(--text-primary) !important;
	margin: 0 !important;
	line-height: 1.3 !important;
}
body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__authorrole {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	/* --text-secondary clears AA 4.5:1 on the section bg across themes */
	color: var(--text-secondary) !important;
	margin: 2px 0 0 0 !important;
	line-height: 1.3 !important;
}

/* ---- mobile (≤640): flatten the zig-zag — avatar on top, all left ----- */
@media (max-width: 640px) {
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row,
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row--even {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: var(--space-3, 12px) !important;
	}
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__side {
		display: flex;
		align-items: center;
		gap: var(--space-3, 12px);
		width: auto;
		text-align: left;
	}
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__avatar {
		margin: 0 !important;
	}
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row--even .universal-testimonials__side,
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__row--even .universal-testimonials__body {
		text-align: left;
	}
	body.aibt-universal .universal-testimonials--quad-zebra-aligned-rows .universal-testimonials__kicker {
		letter-spacing: 0 !important; /* A5: avoid uppercase line-break artifacts */
	}
}
