/* Client Review Carousel — Fiverr-style cards */
.crc {
	--crc-card: #fff;
	--crc-name: #222325;
	--crc-meta: #74767e;
	--crc-star: #222325;
	--crc-text: #404145;
	--crc-arrow-bg: #fff;
	--crc-arrow-icon: #1a5cff;
	--crc-hover: #fb0715;
	--crc-dot: #fff;
	--crc-desktop: 2;
	--crc-tablet: 2;
	--crc-mobile: 1;
	--crc-lines: 5;
	--crc-per: var(--crc-desktop);
	--crc-gap: 28px;
	--crc-arrow-size: 48px;

	box-sizing: border-box;
	width: 100%;
	padding: 8px 0;
}
.crc *, .crc *::before, .crc *::after { box-sizing: border-box; }

@media (max-width: 1024px) {
	.crc { --crc-per: var(--crc-tablet); --crc-gap: 20px; --crc-arrow-size: 42px; }
}
@media (max-width: 767px) {
	.crc { --crc-per: var(--crc-mobile); --crc-gap: 16px; --crc-arrow-size: 36px; }
}

.crc__carousel {
	display: flex;
	align-items: center;
	gap: 20px;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 12px;
}
.crc__viewport {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	touch-action: pan-y;
	padding: 20px 6px 30px;
	margin: -20px -6px -30px;
}
.crc__track {
	display: flex;
	align-items: stretch;
	gap: var(--crc-gap);
	transition: transform .55s cubic-bezier(.22, .8, .24, 1);
	will-change: transform;
}
.crc__slide {
	flex: 0 0 calc((100% - (var(--crc-per) - 1) * var(--crc-gap)) / var(--crc-per));
	min-width: 0;
	display: flex;
}
.crc--static .crc__track { justify-content: center; }

/* Card */
.crc .crc__card {
	width: 100%;
	margin: 0;
	padding: 24px 26px 26px;
	background: var(--crc-card);
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(10, 25, 70, .18);
	text-align: left;
	display: flex;
	flex-direction: column;
	user-select: none;
}

.crc__head {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-bottom: 16px;
	border-bottom: 1px solid #e4e5e7;
}
.crc .crc__avatar {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	max-width: none;
	margin: 0;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	-webkit-user-drag: none;
}
.crc__avatar--initials {
	display: flex !important;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 17px;
	font-weight: 700;
	letter-spacing: .02em;
}
.crc__who { min-width: 0; }
.crc .crc__name {
	margin: 0 0 3px;
	padding: 0;
	color: var(--crc-name);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	overflow-wrap: anywhere;
}
.crc .crc__country {
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 7px;
	color: var(--crc-meta);
	font-size: 14px;
	line-height: 1.3;
}
.crc .crc__flag {
	width: 20px;
	height: 15px;
	max-width: none;
	margin: 0;
	border-radius: 2px;
	object-fit: cover;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .06);
}

.crc__rating {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 16px 0 10px;
	color: var(--crc-star);
}
.crc__stars { display: inline-flex; gap: 2px; }
.crc__star { display: inline-flex; width: 16px; height: 15px; }
.crc__star svg { width: 100%; height: 100%; display: block; }
.crc__star.is-empty { opacity: .22; }
.crc .crc__score { font-size: 16px; font-weight: 700; line-height: 1; margin-left: 2px; }

.crc .crc__text {
	margin: 0;
	padding: 0;
	color: var(--crc-text);
	font-size: 16px;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--crc-lines);
	overflow: hidden;
}
.crc .crc__text.is-open { -webkit-line-clamp: unset; display: block; }

.crc .crc__more {
	align-self: flex-start;
	margin: 8px 0 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--crc-name);
	font-size: 15px;
	font-weight: 700;
	text-decoration: underline;
	cursor: pointer;
}
.crc .crc__more[hidden] { display: none; }
.crc .crc__more:hover, .crc .crc__more:focus { background: none; color: var(--crc-hover); }

/* Arrows */
.crc .crc__arrow {
	flex: 0 0 auto;
	width: var(--crc-arrow-size);
	height: var(--crc-arrow-size);
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--crc-arrow-bg);
	color: var(--crc-arrow-icon);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(0, 0, 0, .15);
	transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.crc .crc__arrow svg { width: 44%; height: 44%; }
.crc .crc__arrow:hover,
.crc .crc__arrow:focus-visible { background: var(--crc-hover); color: #fff; transform: scale(1.06); }
.crc .crc__arrow:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.crc--static .crc__arrow { visibility: hidden; }

/* Dots */
.crc__dots {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 22px 0 0;
}
.crc .crc__dot {
	width: 10px;
	height: 10px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--crc-dot);
	opacity: .4;
	cursor: pointer;
	transition: opacity .2s ease, transform .2s ease;
}
.crc .crc__dot:hover { opacity: .7; }
.crc .crc__dot.is-active { opacity: 1; transform: scale(1.25); }
.crc--static .crc__dots { display: none; }

@media (max-width: 767px) {
	.crc__carousel { gap: 6px; padding: 0 4px; }
	.crc .crc__card { padding: 20px 18px 22px; }
	.crc .crc__text { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
	.crc__track, .crc__arrow { transition: none !important; }
}
