/* ─── Shared glass card base ─────────────────────────────────────────────────
   The rules on .design-testimonial__card, ::before, ::after, and > * below
   are identical across design-testimonial.css, different-testimonial.css, and
   curriculum-testimonial.css. If a new enqueue is ever added for a shared
   partial, extract these there. Until then keep them in sync manually.
   ─────────────────────────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════════
   DESIGN PAGE — SINGLE TESTIMONIAL
   ═══════════════════════════════════════════════════════════════════════════ */

.design-testimonial {
	padding: var(--ci-section-padding) 0;
	background-color: var(--ci-color-white);
}

.design-testimonial__card {
	max-width: 720px;
	margin: 0 auto !important;
	border-radius: 24px;
	overflow: hidden;
	position: relative;

	background: rgba(210, 210, 210, 0.30);
	backdrop-filter: blur(24px) saturate(80%) brightness(1.05);
	-webkit-backdrop-filter: blur(24px) saturate(80%) brightness(1.05);
	border: 1px solid rgba(0, 0, 0, 0.08);
	box-shadow:
		0 8px 32px rgba(0, 0, 0, 0.12),
		0 2px  8px rgba(0, 0, 0, 0.06),
		inset 0 1px 0 rgba(255, 255, 255, 0.70);
}

.design-testimonial__card::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(
		145deg,
		rgba(255, 255, 255, 0.08) 0%,
		rgba(255, 255, 255, 0.00) 50%
	);
	pointer-events: none;
	z-index: 0;
}

.design-testimonial__card::after { display: none; }

.design-testimonial__card > * {
	position: relative;
	z-index: 1;
}

/* ── Mobile ── */
@media (max-width: 767px) {
	.design-testimonial {
		padding: var(--ci-section-padding-mobile) 0;
	}
}