/* Watterson industries marquee (Elementor widget): rows of industry chips scrolling sideways, alternate rows the
   other way. Text uses the site's own font. Colours: .is-dark (light chips for a dark section background, the
   Watterson look) or .is-light (white chips for a light background); the widget's Style tab can override them. */

.wts-mq {
	--mq-gap: 12px; --mq-dur: 48s;
	--mq-text: #fff; --mq-bg: rgba(255, 255, 255, .07); --mq-border: rgba(255, 255, 255, .16); --mq-dot: #14BFDC;
	display: block; width: 100%; overflow: hidden; font-family: inherit; line-height: 1.2;
}
.wts-mq.is-light { --mq-text: #15173A; --mq-bg: #fff; --mq-border: #BCC5DE; --mq-dot: #5661E6; }
.wts-mq *, .wts-mq *::before, .wts-mq *::after { box-sizing: border-box; font-family: inherit; }

.wts-mq .wts-mq__row { overflow: hidden; padding: 2px 0; }
.wts-mq .wts-mq__row + .wts-mq__row { margin-top: var(--mq-gap); }
.wts-mq.is-fade .wts-mq__row {
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

/* The track holds the list twice; moving it by exactly one copy (-50%) loops without a jump. Each copy ends with
   one gap of padding so both halves are the same width. */
.wts-mq .wts-mq__track { display: flex; width: max-content; animation: wts-mq-march var(--mq-dur) linear infinite; will-change: transform; }
.wts-mq .wts-mq__row.is-rev .wts-mq__track { animation-direction: reverse; }
.wts-mq.is-pause:hover .wts-mq__track { animation-play-state: paused; }
.wts-mq .wts-mq__set { display: flex; flex: none; gap: var(--mq-gap); margin: 0; padding: 0 var(--mq-gap) 0 0; list-style: none; }

.wts-mq .wts-mq__chip {
	display: inline-flex; align-items: center; flex: none; margin: 0; padding: 11px 20px;
	white-space: nowrap; font-size: 14.5px; font-weight: 500; letter-spacing: normal; text-transform: none;
	color: var(--mq-text); background: var(--mq-bg); border: 1px solid var(--mq-border); border-radius: 999px;
}
.wts-mq .wts-mq__chip::before, .wts-mq .wts-mq__chip::after { content: none !important; display: none !important; }
.wts-mq .wts-mq__chip i { display: inline-block; flex: none; width: 6px; height: 6px; margin: 0 9px 0 0; border-radius: 50%; background: var(--mq-dot); font-style: normal; }

@keyframes wts-mq-march { to { transform: translateX(-50%); } }

/* Visitors who turn off animations: one still copy, wrapped and centred. */
@media (prefers-reduced-motion: reduce) {
	.wts-mq .wts-mq__track { animation: none; width: auto; justify-content: center; }
	.wts-mq .wts-mq__set { flex-wrap: wrap; justify-content: center; padding: 0; }
	.wts-mq .wts-mq__set[aria-hidden="true"] { display: none; }
	.wts-mq.is-fade .wts-mq__row { -webkit-mask-image: none; mask-image: none; }
}

@media (max-width: 640px) {
	.wts-mq { --mq-gap: 10px; }
	.wts-mq .wts-mq__chip { padding: 9px 16px; font-size: 13.5px; }
}
