/* Video card component (same rules as the case-study pages) */
.cs-vt {position: relative; isolation: isolate; overflow: hidden; width: clamp(220px, 17vw, 280px); aspect-ratio: 9 / 16; border-radius: 20px; background: #16141C; cursor: pointer; box-shadow: 0 34px 60px -28px rgba(30, 16, 80, .55), 0 10px 22px -12px rgba(30, 16, 80, .35); transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out);}
.cs-vt:hover, .cs-vt.is-playing {transform: translateY(-6px) scale(1.02); box-shadow: 0 46px 80px -30px rgba(30, 16, 80, .6), 0 14px 28px -14px rgba(30, 16, 80, .4);}
.cs-vt__video {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}
.cs-vt__shade {position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(0deg, rgba(10, 8, 16, .82) 0%, rgba(10, 8, 16, .35) 26%, rgba(10, 8, 16, 0) 46%);}
.cs-vt__play, .cs-vt__sound {position: absolute; top: .85rem; z-index: 2; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #fff; cursor: pointer; background: rgba(30, 28, 36, .42); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: background-color var(--dur-fast) ease, transform var(--dur-fast) var(--ease-out), opacity var(--dur-fast) ease;}
.cs-vt__play {left: .85rem; width: 38px; height: 38px;}
.cs-vt__sound {right: .85rem; width: 32px; height: 32px; opacity: .8;}
.cs-vt__play svg {width: 18px; height: 18px;}
.cs-vt__sound svg {width: 16px; height: 16px;}
.cs-vt__play:hover, .cs-vt__sound:hover {background: rgba(116, 88, 215, .85); transform: scale(1.06); opacity: 1;}
.cs-vt__play:focus-visible, .cs-vt__sound:focus-visible {outline: 2px solid #fff; outline-offset: 2px;}
.cs-vt__i-pause, .cs-vt__i-on {display: none;}
.cs-vt.is-playing .cs-vt__i-play {display: none;}
.cs-vt.is-playing .cs-vt__i-pause {display: block;}
.cs-vt:not(.is-muted) .cs-vt__i-off {display: none;}
.cs-vt:not(.is-muted) .cs-vt__i-on {display: block;}
.cs-vt.is-playing.is-muted .cs-vt__sound {opacity: 1; animation: cs-vt-nudge 1.6s var(--ease-out) 2;}
.cs-vt__meta {position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: grid; gap: .3rem; padding: 1rem 1.1rem 1.1rem; color: #fff; pointer-events: none;}
.cs-vt__name {font-family: var(--f-display); font-weight: 600; font-size: clamp(1.1rem, 1.25vw, 1.35rem); line-height: 1.15;}
.cs-vt__co {font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .78);}
.cs-vt {width: min(280px, 72vw);}
.cs-vt, .cs-vt__play, .cs-vt__sound {transition: none;}
.cs-vt:hover, .cs-vt.is-playing {transform: none;}
.cs-vt.is-playing.is-muted .cs-vt__sound {animation: none;}
@keyframes cs-vt-nudge { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.18); background: rgba(116, 88, 215, .85); } }

/* ==========================================================================
   Home — Testimonials slider (template-parts/home/testimonials.php)
   ========================================================================== */
.tm {
	padding: var(--section-pad) 0;
	background: var(--c-white);
	overflow: hidden;
}
.tm__inner {
	display: grid;
	grid-template-columns: minmax(0, .82fr) minmax(0, 2fr);
	gap: clamp(2rem, 4vw, 4.5rem);
	align-items: stretch;
}

/* Intro column */
.tm__intro { display: flex; flex-direction: column; }
.tm__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	margin: 0 0 1.1rem;
	font-family: var(--f-body);
	font-weight: 700;
	font-size: .95rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--c-ink);
}
.tm__mark {
	width: 10px;
	height: 10px;
	background: var(--c-brand);
	clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
}
.tm__title {
	margin: 0;
	font-family: var(--f-display);
	font-weight: 600;
	font-size: clamp(2.1rem, 3.3vw, 3.6rem);
	line-height: 1.12;
	letter-spacing: -.01em;
	color: var(--c-ink);
}
.tm__lead {
	margin: 1.25rem 0 0;
	max-width: 30ch;
	font-size: var(--fs-body-l);
	line-height: 1.5;
	color: var(--c-ink);
}
.tm__nav {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-top: auto;
	padding-top: 2rem;
}
.tm__arrow {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 0;
	border-radius: 14px;
	background: var(--c-brand);
	color: #fff;
	cursor: pointer;
	transition: background-color var(--dur-fast) ease, translate var(--dur-fast) var(--ease-out), opacity var(--dur-fast) ease;
}
.tm__arrow svg { width: 20px; height: 20px; }
.tm__arrow--prev svg { rotate: 180deg; }
.tm__arrow:hover:not(:disabled) { background: var(--c-brand-2); translate: 0 -2px; }
.tm__arrow:disabled { background: var(--c-surface); color: #B9B5C6; cursor: default; }
.tm__count {
	margin-left: .5rem;
	font-family: var(--f-display);
	font-size: 1rem;
	color: var(--c-muted);
}
.tm__count b { color: var(--c-ink); font-weight: 600; }

/* Slides: stacked in one grid cell so the stage takes the tallest slide's height */
.tm__stage { display: grid; touch-action: pan-y; }
.tm-slide {
	grid-area: 1 / 1;
	display: flex;
	gap: clamp(1rem, 1.6vw, 1.5rem);
	min-width: 0;
	opacity: 0;
	visibility: hidden;
	translate: 40px 0;
	transition: opacity .55s var(--ease-out), translate .55s var(--ease-out), visibility 0s linear .55s;
}
.tm-slide.is-active {
	opacity: 1;
	visibility: visible;
	translate: 0 0;
	transition: opacity .55s var(--ease-out), translate .55s var(--ease-out), visibility 0s;
}
.tm-slide.is-leaving { translate: -40px 0; }

/* Video card (shared .cs-vt component, sized for this layout) */
.tm-slide__video.cs-vt {
	flex: 0 0 clamp(240px, 31%, 380px);
	width: auto;
	aspect-ratio: auto;
	min-height: clamp(380px, 32vw, 540px);
	border-radius: 24px;
}
.tm-slide__video.cs-vt:hover,
.tm-slide__video.cs-vt.is-playing { transform: none; }
.tm-slide__video .cs-vt__play {
	top: 50%;
	left: 50%;
	width: 64px;
	height: 64px;
	translate: -50% -50%;
	background: rgba(13, 11, 20, .55);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.tm-slide__video .cs-vt__play svg { width: 26px; height: 26px; }
.tm-slide.is-text .tm-card { flex: 1 1 100%; }

/* Quote card */
.tm-card {
	--tm-tone: var(--c-yellow);
	position: relative;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 2rem;
	min-width: 0;
	min-height: clamp(380px, 32vw, 540px);
	margin: 0;
	padding: clamp(1.5rem, 2.6vw, 2.75rem);
	border-radius: 24px;
	background: var(--tm-tone);
	color: var(--c-ink);
	overflow: hidden;
}
.tm-card--yellow { --tm-tone: #F8EDA9; }
.tm-card--lilac  { --tm-tone: var(--c-tint); }
.tm-card--green  { --tm-tone: #E4EDC7; }
.tm-card--pink   { --tm-tone: #F9DDF1; }
.tm-card--blue   { --tm-tone: #DCE4F6; }
.tm-card__quote {
	position: relative;
	z-index: 1;
	margin: 0;
	font-family: var(--f-body);
	font-size: clamp(1.15rem, 1.55vw, 1.6rem);
	line-height: 1.55;
	color: var(--c-ink);
}
.tm-card__who {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 1rem;
	padding-right: 7rem;
}
.tm-card__face {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	overflow: hidden;
	border-radius: 50%;
	background: var(--c-brand);
	color: #fff;
	font-family: var(--f-display);
	font-weight: 600;
	font-size: 1.5rem;
}
.tm-card__face img { width: 100%; height: 100%; object-fit: cover; }
.tm-card__id { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.tm-card__id strong {
	font-family: var(--f-display);
	font-weight: 600;
	font-size: 1.2rem;
}
.tm-card__id em {
	font-style: normal;
	font-size: .98rem;
	color: rgba(47, 47, 47, .72);
}
.tm-card__mark {
	position: absolute;
	right: clamp(1.25rem, 2.4vw, 2.5rem);
	bottom: clamp(1.25rem, 2.4vw, 2.25rem);
	width: clamp(84px, 9vw, 150px);
	color: rgba(47, 47, 47, .09);
}

/* Responsive */
@media (max-width: 1024px) {
	.tm__inner { grid-template-columns: 1fr; }
	.tm__nav { margin-top: 1.75rem; padding-top: 0; }
}
@media (max-width: 680px) {
	.tm-slide { flex-direction: column; }
	.tm-slide__video.cs-vt { flex: 0 0 auto; width: 100%; min-height: 0; aspect-ratio: 4 / 5; max-height: 70svh; }
	.tm-card { min-height: 0; }
	.tm-card__who { padding-right: 4.5rem; }
	.tm-card__face { width: 52px; height: 52px; }
}
@media (prefers-reduced-motion: reduce) {
	.tm-slide, .tm-slide.is-active { transition: none; translate: none; }
}

