/* Platecraft Addons – Marquee. marquee.js copies the set of items until the
   row is full and moves the track; without it the items simply sit in a row. */

.pmq {
	--pmq-gap: 40px;
	--pmq-fade: 80px;
	--pmq-img-h: 56px;
	--pmq-icon: 1em;
	--pmq-icon-gap: 0.45em;
	--pmq-card-w: 220px;
	--pmq-card-ratio: 4 / 5;
	--pmq-card-gap: 14px;
	display: flex;
	flex-direction: column;
	gap: var(--pmq-rows-gap, 0px);
	overflow-x: clip;
	padding-block: calc(var(--pmq-bleed, 0%) * 1.2);
}
.pmq__row {
	margin-inline: calc(var(--pmq-bleed, 0%) * -1);
	overflow: hidden;
	padding: 18px 0;
	rotate: var(--pmq-tilt, 0deg);
}
.pmq__row--second {
	rotate: calc(var(--pmq-tilt, 0deg) * -1);
}
.pmq--fade .pmq__row {
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--pmq-fade), #000 calc(100% - var(--pmq-fade)), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 var(--pmq-fade), #000 calc(100% - var(--pmq-fade)), transparent);
}
.pmq__track {
	display: flex;
	width: max-content;
	gap: var(--pmq-gap);
	will-change: transform;
}
.pmq__set {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	gap: var(--pmq-gap);
}
.pmq__item {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	gap: var(--pmq-icon-gap);
	white-space: nowrap;
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.pmq__link {
	display: inline-flex;
	align-items: center;
	gap: var(--pmq-icon-gap);
	color: inherit;
	text-decoration: none;
}
.pmq__text {
	font-size: clamp(1.5rem, 3.2vw, 2.6rem);
	font-weight: 700;
	line-height: 1.1;
	transition: color 0.3s ease;
}
.pmq__icon {
	display: inline-flex;
	color: #c2410c;
	font-size: var(--pmq-icon);
	line-height: 1;
}
.pmq__icon svg {
	width: var(--pmq-icon);
	height: var(--pmq-icon);
	fill: currentColor;
}
.pmq__text + .pmq__icon,
.pmq__icon + .pmq__text {
	font-size: inherit;
}
.pmq__item--icon .pmq__icon {
	font-size: max(var(--pmq-icon), 1.4rem);
}
/* Two classes: Elementor's ".elementor img { height: auto; max-width: 100% }" is stronger than one. */
.pmq .pmq__img {
	display: block;
	width: auto;
	max-width: none;
	height: var(--pmq-img-h);
	object-fit: contain;
	transition: filter 0.3s ease, opacity 0.3s ease, border-color 0.3s ease;
}
.pmq__item--template {
	width: var(--pmq-tpl-w, 320px);
	white-space: normal;
}
.pmq__item--template > .pl-popup__content,
.pmq__item--template .pmq__link {
	width: 100%;
}
/* Image card: picture, title, subtitle. */
.pmq__item--card {
	align-self: flex-start;
	white-space: normal;
}
.pmq__item--card .pmq__link {
	display: block;
}
.pmq__card {
	width: var(--pmq-card-w);
	margin: 0;
}
.pmq__card-media {
	display: block;
	overflow: hidden;
	aspect-ratio: var(--pmq-card-ratio);
	border-radius: 8px;
	background-color: rgba(0, 0, 0, 0.04);
	transition: border-color 0.3s ease;
}
.pmq .pmq__card-img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease, filter 0.3s ease;
}
.pmq__item--card:hover .pmq__card-img {
	transform: scale(var(--pmq-card-zoom, 1));
}
.pmq__card-body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: var(--pmq-card-gap);
	box-shadow: var(--pmq-card-body-shadow, none);
	transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.pmq__item--card:hover .pmq__card-body {
	box-shadow: var(--pmq-card-body-shadow-h, var(--pmq-card-body-shadow, none));
}
.pmq__card-title {
	font-size: 1.05rem;
	font-weight: 600;
	line-height: 1.3;
	transition: color 0.3s ease;
}
.pmq__card-sub {
	font-size: 0.82rem;
	line-height: 1.4;
	opacity: 0.7;
}
.pmq__sep {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	color: #c2410c;
	font-size: 1.4rem;
	line-height: 1;
}
.pmq__sep svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}
.pmq__sep-in {
	display: inline-flex;
}
.pmq--spin .pmq__sep-in {
	animation: pmq-spin var(--pmq-spin, 6s) linear infinite;
}

@keyframes pmq-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.pmq--spin .pmq__sep-in {
		animation: none;
	}
	.pmq__row {
		overflow-x: auto;
	}
}
