/* ==========================================================================
   Matchreel 1.8 — fasce di loghi in home ("Le aziende pioniere", "Parlano di noi")
   e pastiglia dei posti disponibili.
   ========================================================================== */

.mr-logos {
	position: relative;
	padding-block: clamp(2.5rem, 5vw, 3.75rem);
	background: #fff;
	border-top: 1px solid var(--mr-border);
}
.mr-logos--stampa { background: var(--mr-surface); }
.mr-logos + .mr-logos { border-top: 1px solid var(--mr-border); }

.mr-logos__head {
	position: relative;
	max-width: var(--mr-wrap);
	margin: 0 auto clamp(1.5rem, 3vw, 2.25rem);
	padding-inline: var(--mr-gutter);
	text-align: center;
}
.mr-logos__title {
	margin: 0;
	font-size: clamp(1.375rem, 2.4vw, 1.75rem);
	line-height: 1.2;
	letter-spacing: -.02em;
	color: var(--mr-text);
	text-wrap: balance;
}
.mr-logos__subtitle {
	max-width: 620px;
	margin: .5rem auto 0;
	color: var(--mr-muted);
	font-size: 1rem;
	line-height: 1.5;
	text-wrap: balance;
}

/* ---------- Loghi ---------- */
.mr-logos__viewport { position: relative; }
.mr-logos__list {
	display: flex;
	align-items: center;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mr-logos__item {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-inline: clamp(1.25rem, 3vw, 2.25rem);
}
.mr-logos__link {
	display: flex;
	align-items: center;
	justify-content: center;
	height: clamp(44px, 5vw, 60px);
	border-radius: 10px;
	outline-offset: 6px;
}
.mr-logos__img {
	display: block;
	width: auto;
	height: 100%;
	max-width: clamp(110px, 14vw, 180px);
	object-fit: contain;
	filter: grayscale(1);
	opacity: .62;
	transition: filter .3s var(--mr-ease), opacity .3s var(--mr-ease);
}
a.mr-logos__link:hover .mr-logos__img,
a.mr-logos__link:focus-visible .mr-logos__img {
	filter: none;
	opacity: 1;
}

/* Pochi loghi: fermi e centrati, su più righe se serve */
.mr-logos.is-static .mr-logos__list {
	flex-wrap: wrap;
	justify-content: center;
	row-gap: 1.5rem;
	max-width: var(--mr-wrap-wide);
	margin-inline: auto;
	padding-inline: var(--mr-gutter);
}
.mr-logos.is-static .mr-logos__item { padding-inline: clamp(.75rem, 1.5vw, 1.25rem); }

/* Posti liberi tra le aziende pioniere */
.mr-logos__item--free span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: clamp(120px, 12vw, 150px);
	height: clamp(44px, 5vw, 60px);
	border: 1.5px dashed #D9D3DE;
	border-radius: 12px;
	color: var(--mr-muted);
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .01em;
}

/* Scorrimento continuo da destra verso sinistra */
.mr-logos.is-scrolling .mr-logos__viewport {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}
.mr-logos__marquee {
	display: flex;
	width: max-content;
	animation: mr-logos-scroll var(--mr-logos-duration, 40s) linear infinite;
}
.mr-logos__viewport:hover .mr-logos__marquee,
.mr-logos__viewport:focus-within .mr-logos__marquee,
.mr-logos.is-paused .mr-logos__marquee {
	animation-play-state: paused;
}
@keyframes mr-logos-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

/* Pulsante per fermare lo scorrimento: visibile al passaggio del mouse e con la tastiera */
.mr-logos__toggle {
	position: absolute;
	right: var(--mr-gutter);
	bottom: 0;
	z-index: 2;
	padding: .3rem .7rem;
	border: 1px solid var(--mr-border);
	border-radius: 999px;
	background: #fff;
	color: var(--mr-muted);
	font: 600 .75rem/1.2 Inter, Arial, Helvetica, sans-serif;
	cursor: pointer;
	opacity: 0;
	transition: opacity .2s var(--mr-ease), color .2s;
}
.mr-logos:hover .mr-logos__toggle,
.mr-logos__toggle:focus-visible,
.mr-logos.is-paused .mr-logos__toggle { opacity: 1; }
.mr-logos__toggle:hover { color: var(--mr-primary); }
.mr-logos__toggle-play { display: none; }
.mr-logos__toggle[aria-pressed="true"] .mr-logos__toggle-pause { display: none; }
.mr-logos__toggle[aria-pressed="true"] .mr-logos__toggle-play { display: inline; }
@media (hover: none), (max-width: 781px) {
	.mr-logos__toggle { position: static; opacity: 1; margin-top: .75rem; }
}

/* Chi ha chiesto meno animazioni vede i loghi fermi */
@media (prefers-reduced-motion: reduce) {
	.mr-logos__marquee { animation: none; width: auto; }
	.mr-logos__marquee .mr-logos__list[aria-hidden="true"],
	.mr-logos__marquee .mr-logos__item[aria-hidden="true"],
	.mr-logos__toggle { display: none; }
	.mr-logos.is-scrolling .mr-logos__viewport { -webkit-mask-image: none; mask-image: none; }
	.mr-logos__marquee .mr-logos__list {
		flex-wrap: wrap;
		justify-content: center;
		row-gap: 1.5rem;
		max-width: var(--mr-wrap-wide);
		margin-inline: auto;
		padding-inline: var(--mr-gutter);
	}
}

/* ---------- Posti e invito ---------- */
.mr-logos__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .75rem 1rem;
	margin-top: clamp(1.5rem, 3vw, 2.25rem);
	padding-inline: var(--mr-gutter);
}
.mr-seats-pill {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .45rem .9rem;
	border-radius: 999px;
	background: var(--mr-grad-soft);
	color: var(--mr-text);
	font-size: .9375rem;
	font-weight: 500;
}
.mr-seats-pill strong { color: var(--mr-primary); font-weight: 700; }
.mr-seats-pill.is-full { background: var(--mr-surface); color: var(--mr-muted); }
.is-style-mr-dark .mr-seats-pill { background: rgba(255, 255, 255, .1); color: #fff; }
.is-style-mr-dark .mr-seats-pill strong { color: #FF9ED9; }
.mr-logos__cta { background: #fff; }