/* ============================================================
   Jersey Jump — Trust Bar
   Full-width gradient strip, horizontal centered list of trust
   points with a white star per item. Sits below the homepage hero
   slideshow and below the Page Banner on every inner page.
   When the list doesn't fit the viewport width it becomes a
   horizontally scrollable track with arrow controls (assets/js/trust-bar.js
   toggles the arrows on/off based on overflow).
   ============================================================ */
.trust-bar {
	background: linear-gradient(271deg, var(--color-blue-700) 0%, var(--color-blue-400) 18%, var(--color-sky-500) 39%, var(--color-sky-400) 69%, var(--color-blue-400) 100%);
	min-height: 75px;
	padding-block: 0;
	display: flex;
	align-items: center;
}

.trust-bar-row {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
}

/* Scroll area — flex:1 + min-width:0 so it can shrink and actually
   scroll instead of forcing the row wider than the viewport. */
.trust-bar-viewport {
	flex: 1;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.trust-bar-viewport::-webkit-scrollbar {
	display: none;
}

.trust-bar-track {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	width: max-content;
	min-width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.trust-bar-item {
	display: flex;
	align-items: center;
	gap: 10px;
	white-space: nowrap;
	color: var(--color-white);
	font-family: var(--font-body);
	font-weight: 500;
	font-size: clamp(13px, 1.4vw, 15px);
}

.trust-bar-star {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}

/* Arrows — hidden by default; JS unhides them only when the track
   actually overflows the viewport. */
.trust-bar-arrow {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: var(--color-white-a55);
	color: var(--color-white);
	cursor: pointer;
}

.trust-bar-arrow svg {
	width: 18px;
	height: 18px;
}

.trust-bar-arrow:disabled {
	opacity: 0.4;
	cursor: default;
}

.trust-bar-arrow[hidden] {
	display: none;
}