.opinie {
	padding: clamp(var(--space-9), 6vw, var(--space-11)) var(--gutter);
}

.opinie__inner {
	max-width: var(--container-max);
	margin: 0 auto;
}

.opinie__title {
	margin: 0;
	color: var(--color-black);
	font-family: var(--ff-heading);
	font-weight: 700;
	font-size: clamp(28px, 4vw, 48px);
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.opinie__carousel {
	position: relative;
	margin-top: clamp(var(--space-8), 5vw, var(--space-9));
}

.opinie__track {
	display: flex;
	gap: var(--space-6);
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: var(--space-2);
}

.opinie__track::-webkit-scrollbar {
	display: none;
}

.opinie__card {
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
	flex: 0 0 100%;
	padding: var(--space-7);
	background: var(--color-black);
	border: 1px solid var(--color-white);
	opacity: 0.65;
	filter: blur(3px);
	scroll-snap-align: start;
	transform-origin: left center;
	transform: scale(0.96);
	transition: opacity 0.4s var(--ease, ease), filter 0.4s var(--ease, ease), border-color 0.4s var(--ease, ease), transform 0.4s var(--ease, ease);
}

.opinie__card.is-active {
	position: relative;
	z-index: 1;
	opacity: 1;
	filter: blur(0);
	transform: scale(1);
}

.opinie__quote {
	margin: 0;
	color: var(--color-white);
	font-size: 17px;
	line-height: 1.6;
}

.opinie__foot {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--space-4);
	margin: auto calc(-1 * var(--space-7)) calc(-1 * var(--space-7)) calc(-1 * var(--space-7));
	padding: var(--space-4) var(--space-7);
	background: var(--color-white);
}

.opinie__avatar {
	flex-shrink: 0;
	width: auto;
	max-width: 100px;
	height: 32px;
	object-fit: contain;
	object-position: left center;
}

.opinie__meta {
	min-width: 0;
}

.opinie__author {
	margin: 0;
	color: var(--color-black);
	font-weight: 700;
	font-size: 15px;
}

.opinie__role {
	margin: var(--space-1) 0 0;
	color: var(--color-neutral-500);
	font-size: 13px;
}

.opinie__nav {
	display: flex;
	justify-content: flex-end;
	gap: var(--space-3);
	margin-top: var(--space-6);
}

.opinie__nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: none;
	border: 1px solid var(--color-neutral-200);
	color: var(--color-black);
	font-size: 18px;
	transition: color 0.45s var(--ease, ease), border-color 0.3s var(--ease, ease);
}

.opinie__nav-btn:hover,
.opinie__nav-btn:focus-visible {
	border-color: var(--color-black);
}

@media (min-width: 700px) {
	.opinie__card {
		flex-basis: clamp(320px, 45vw, 420px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.opinie__card {
		transition-duration: 0.01ms;
	}
}