/* Block Đối tác & chứng chỉ (Figma 289:734) */

.block-trust {
	display: grid;
	grid-template-columns: minmax(0, 1fr); /* Không cho cột giãn theo chiều dài dải logo. */
	gap: clamp(48px, 4.8vw, 92px);
	text-align: center;
}

.block-trust__title {
	padding-inline: var(--gutter);
}

.marquee {
	display: flex;
	margin-top: clamp(20px, 1.88vw, 36px);
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

/* "ul.marquee__group" thắng reset "ul[class] { padding: 0 }" của base.css: thiếu padding-right thì logo cuối
   (Samoon) dính sát logo đầu của bản lặp. */
ul.marquee__group {
	display: flex;
	flex: none;
	align-items: center;
	gap: clamp(12px, 1.25vw, 24px);
	padding-right: clamp(12px, 1.25vw, 24px);
	animation: marquee 40s linear infinite;
}

.block-trust__row--certs .marquee__group {
	gap: clamp(32px, 3vw, 64px);
	padding-right: clamp(32px, 3vw, 64px);
	animation-duration: 50s;
}

.marquee:hover .marquee__group {
	animation-play-state: paused;
}

@keyframes marquee {
	to { transform: translateX(-100%); }
}

/* Logo đối tác: ô trắng, logo xám → màu khi rê chuột. */
.block-trust__row--partners .marquee__item {
	display: grid;
	place-items: center;
	width: clamp(160px, 14.6vw, 281px);
	height: clamp(80px, 7.34vw, 141px);
	padding: clamp(16px, 1.5vw, 28px) clamp(20px, 2vw, 40px);
	border-radius: var(--radius-sm);
	background: #fff;
}

.block-trust__row--partners .marquee__item img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.85;
	transition: filter 0.3s, opacity 0.3s;
}

.block-trust__row--partners .marquee__item:hover img {
	filter: none;
	opacity: 1;
}

/* Logo chứng chỉ: không có ô nền. */
.block-trust__row--certs .marquee__item {
	display: flex;
	align-items: center;
}

.block-trust__row--certs .marquee__item img {
	width: auto;
	max-width: clamp(110px, 13.2vw, 254px);
	height: clamp(72px, 7.5vw, 144px);
	object-fit: contain;
}

.marquee__item picture {
	display: contents;
}

/* Giảm chuyển động: bỏ chạy ngang, xếp logo thành lưới và ẩn bản lặp. */
@media (prefers-reduced-motion: reduce) {
	.marquee {
		justify-content: center;
		-webkit-mask-image: none;
		mask-image: none;
	}

	.marquee .marquee__group {
		flex-wrap: wrap;
		justify-content: center;
		flex: 1;
		padding-inline: var(--gutter);
		animation: none;
	}

	.marquee__group[aria-hidden="true"] {
		display: none;
	}
}