/**
 * Elementor Testimonial Carousel Widget v2 — default look.
 * Centered cards: source pill, italic Lato 18 quote wrapped in tan serif
 * quotation marks, name and role. Everything overridable from the Style tab.
 */

.etc-tc {
	--etc-per-view: 1;
	--etc-gap: 24px;
	--etc-tan: #c4b58f;
	--etc-ink: #2b2b2b;
	--etc-arrow-size: 44px;
	--etc-dot: 10px;
	--etc-nav-gap: 24px;
	position: relative;
	font-family: 'Lato', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--etc-ink);
}

/* Track */
.etc-tc__track {
	display: flex;
	gap: var(--etc-gap);
	margin: 0;
	padding: 6px 0 12px;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
}
.etc-tc__track::-webkit-scrollbar { display: none; }
.etc-tc__track:focus-visible { outline: 2px solid var(--etc-tan); outline-offset: 4px; }

.etc-tc__slide {
	flex: 0 0 calc((100% - (var(--etc-per-view) - 1) * var(--etc-gap)) / var(--etc-per-view));
	min-width: 0;
	display: flex;
	scroll-snap-align: start;
}

/* Card */
.etc-tc .etc-tc__card {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	margin: 0;
	padding: 32px;
	box-sizing: border-box;
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 12px;
	text-align: center;
	transition: box-shadow 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
}

/* Source pill */
.etc-tc__pill {
	display: inline-block;
	max-width: 100%;
	padding: 6px 16px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--etc-ink);
	background: #ffffff;
	border: 1px solid var(--etc-tan);
	border-radius: 999px;
}

/* Quote */
.etc-tc .etc-tc__quote {
	flex: 1 1 auto;
	margin: 0;
	padding: 0 8px;
	border: 0;
	background: none;
	font-style: italic;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.6;
	quotes: none;
	color: inherit;
}
.etc-tc .etc-tc__quote p { margin: 0 0 1em; font: inherit; color: inherit; }
.etc-tc .etc-tc__quote p:last-child { margin-bottom: 0; }
.etc-tc .etc-tc__quote::before,
.etc-tc .etc-tc__quote::after { content: none; }

.etc-tc .etc-tc__mark {
	display: inline-block;
	font-family: Georgia, 'Times New Roman', serif;
	font-style: normal;
	font-weight: 400;
	font-size: 2.2em;
	line-height: 0;
	vertical-align: -0.42em;
	color: var(--etc-tan);
}
.etc-tc .etc-tc__mark--open  { margin-right: 0.08em; }
.etc-tc .etc-tc__mark--close { margin-left: 0.08em; }

/* Author */
.etc-tc__author {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin: 0;
	min-width: 0;
}
.etc-tc__name { font-size: 18px; font-weight: 400; line-height: 1.4; color: inherit; }
.etc-tc__role { font-size: 18px; font-weight: 400; line-height: 1.4; color: inherit; opacity: 0.7; }

/* Navigation */
.etc-tc__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin-top: var(--etc-nav-gap);
}
.etc-tc--static .etc-tc__nav { display: none; }

.etc-tc .etc-tc__arrow {
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: var(--etc-arrow-size);
	height: var(--etc-arrow-size);
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 1px solid var(--etc-tan);
	border-radius: 50%;
	background: transparent;
	color: var(--etc-ink);
	box-shadow: none;
	line-height: 0;
	cursor: pointer;
	transition: background-color 0.2s, color 0.2s, border-color 0.2s, opacity 0.2s;
}
.etc-tc .etc-tc__arrow:hover:not(:disabled),
.etc-tc .etc-tc__arrow:focus-visible {
	background: var(--etc-tan);
	border-color: var(--etc-tan);
	color: #ffffff;
}
.etc-tc .etc-tc__arrow:disabled { opacity: 0.35; cursor: default; }
.etc-tc__arrow svg { width: 45%; height: 45%; }
.rtl .etc-tc__arrow svg,
[dir="rtl"] .etc-tc__arrow svg { transform: scaleX(-1); }

.etc-tc__dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.etc-tc__dots[hidden] { display: none; }
.etc-tc .etc-tc__dot {
	-webkit-appearance: none;
	appearance: none;
	width: var(--etc-dot);
	height: var(--etc-dot);
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.2);
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.2s, transform 0.2s;
}
.etc-tc .etc-tc__dot[aria-current="true"] { background: var(--etc-tan); transform: scale(1.3); }

.etc-tc .etc-tc__arrow:focus-visible,
.etc-tc .etc-tc__dot:focus-visible { outline: 2px solid var(--etc-tan); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
	.etc-tc .etc-tc__arrow, .etc-tc .etc-tc__dot, .etc-tc .etc-tc__card { transition: none; }
}
