/* LR — Carrossel de logos (§17 / 03 — Trusted by). Valores = layout aprovado. */

.lr-logo-carousel__inner {
	max-width: var(--lr-max);
	margin: 0 auto;
	padding: clamp(40px, 5vw, 72px) var(--lr-gutter);
}

.lr-logos {
	position: relative;
}

.lr-logos__label {
	margin: 0 0 24px;
	font-size: calc(13px * var(--lr-ts, 1));
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--lr-primary);
}

.lr-logos__band {
	position: relative;
	overflow: hidden;
	background-color: var(--lr-mint);
}

.lr-logos--bleed .lr-logos__band {
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
}

.lr-logos--fade .lr-logos__band {
	-webkit-mask-image: linear-gradient(90deg, transparent, var(--lr-black) 8%, var(--lr-black) 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, var(--lr-black) 8%, var(--lr-black) 92%, transparent);
}

.lr-logos__track {
	display: flex;
	width: max-content;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lr-logos--marquee .lr-logos__track {
	animation: lr-logos-marquee var(--lr-logos-dur, 40s) linear infinite;
	will-change: transform;
}

.lr-logos--reverse .lr-logos__track {
	animation-direction: reverse;
}

.lr-logos--pause-hover .lr-logos__band:hover .lr-logos__track,
.lr-logos--pause-hover:focus-within .lr-logos__track,
.lr-logos.is-paused .lr-logos__track,
.lr-logos.is-offscreen .lr-logos__track {
	animation-play-state: paused;
}

@keyframes lr-logos-marquee {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-50%);
	}
}

.lr-logos__item {
	flex: 0 0 auto;
	width: var(--lr-logos-item-w, clamp(200px, 18vw, 280px));
	height: var(--lr-logos-item-h, 110px);
	margin: 0 var(--lr-logos-gap, 16px) 0 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	list-style: none;
}

.lr-logos__item::before,
.lr-logos__item::marker {
	content: none;
}

.lr-logos__link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.lr-logos__item .lr-logos__logo {
	display: block;
	width: var(--lr-logo-w, auto);
	height: var(--lr-logo-h, 48px);
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

/* Fileira estática: autoplay desligado, reduzir movimento ou animações desativadas. */
.lr-logos--static .lr-logos__track {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--lr-logos-static-min, 96px)), 1fr));
	width: 100%;
	max-width: var(--lr-max);
	margin: 0 auto;
	padding: 0 var(--lr-gutter);
	box-sizing: border-box;
	gap: var(--lr-logos-gap, 16px);
	animation: none;
	transform: none;
}

.lr-logos--static .lr-logos__item {
	width: auto;
	margin: 0;
}

/* Parado, a faixa não precisa do degradê lateral (que apagaria os logos das pontas). */
.lr-logos--static .lr-logos__band {
	-webkit-mask-image: none;
	mask-image: none;
}

@media (max-width: 767px) {
	.lr-logos--static .lr-logos__item {
		height: min(var(--lr-logos-item-h, 110px), 88px);
	}
}

.lr-logos--static .lr-logos__item[aria-hidden="true"],
.lr-logos--static .lr-logos__toggle {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.lr-logos--marquee .lr-logos__track {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--lr-logos-static-min, 96px)), 1fr));
		width: 100%;
		max-width: var(--lr-max);
		margin: 0 auto;
		padding: 0 var(--lr-gutter);
		box-sizing: border-box;
		gap: var(--lr-logos-gap, 16px);
		animation: none;
		transform: none;
	}

	.lr-logos--marquee .lr-logos__item {
		width: auto;
		margin: 0;
	}

	.lr-logos--marquee .lr-logos__band {
		-webkit-mask-image: none;
		mask-image: none;
	}

	.lr-logos--marquee .lr-logos__item[aria-hidden="true"],
	.lr-logos__toggle {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) and (max-width: 767px) {
	.lr-logos--marquee .lr-logos__item {
		height: min(var(--lr-logos-item-h, 110px), 88px);
	}
}

/* Pausar / reproduzir (WCAG 2.2.2). */
.lr-logos .lr-logos__toggle {
	position: absolute;
	right: 0;
	bottom: 8px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 999px;
	background-color: var(--lr-white);
	color: var(--lr-primary);
	font-size: calc(11px * var(--lr-ts, 1));
	line-height: 1;
}

.lr-logos__toggle-icon::before {
	content: "\275A\275A";
	letter-spacing: -.1em;
}

.lr-logos__toggle[aria-pressed="true"] .lr-logos__toggle-icon::before {
	content: "\25B6";
	letter-spacing: 0;
}

.lr-logos__toggle-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.lr-logos:not(.lr-logos--btn-visible) .lr-logos__toggle:not(:focus-visible) {
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.lr-logos--empty {
	padding: 24px;
	font-size: calc(12px * var(--lr-ts, 1));
	text-align: center;
	background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--lr-black) 4%, transparent) 0 10px, transparent 10px 20px);
}

/* Sem botão quando não há movimento. */
.lr-logos.lr-logos--static .lr-logos__toggle {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.lr-logos.lr-logos--marquee .lr-logos__toggle {
		display: none;
	}
}