/**
 * Variant CSS: trust--guarantee-strip-band
 *
 * Slim DARK reassurance band — a single row of 4 short promises (inline SVG icon
 * + one label), e.g. satisfaction guarantee, 14-day returns, secure payment, free
 * delivery. Different from the seal grid: a compact "trust strip" that sits under
 * the hero or above the footer and kills purchase objections in one glance.
 * Dark surface, so text is var(--text-on-dark) and the icon uses an accent lift
 * over dark (KI-020 — never --bg-main as foreground). Part of the `trust` role.
 */

body.aibt-universal .universal-trust--guarantee-strip-band {
	padding-block: calc(clamp(1.4rem, 3vw, 2.2rem) * var(--density, 1));
	background: var(--background-dark, #141414);
}

/* The strip: one row, space-between, wraps on small screens. */
body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__strip {
	gap: clamp(1rem, 2.5vw, 2rem) !important;
	align-items: center;
}

/* Each guarantee = icon + label, with a vertical divider before all but first. */
body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee {
	position: relative;
	flex: 1 1 auto;
	justify-content: center;
	gap: 0.65rem !important;
	align-items: center;
	padding-inline: clamp(0.6rem, 1.8vw, 1.4rem) !important;
}

body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee + .universal-trust__guarantee::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 1.7em;
	background: color-mix(in srgb, var(--text-on-dark, #fff) 22%, transparent);
}

/* Inline icon — accent lifted over the dark band so it stays visible. */
body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee-icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	line-height: 0;
	color: color-mix(in srgb, var(--accent) 60%, var(--on-dark, #fff));
}

body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee-icon svg {
	width: 22px;
	height: 22px;
	display: block;
}

/* Label on dark. */
body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee-label {
	font-family: var(--font-body) !important;
	font-size: var(--text-sm) !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	color: var(--text-on-dark, #fff) !important;
	margin: 0 !important;
}

/* Tablet: allow 2x2 wrap. */
@media (max-width: 781px) {
	body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee {
		flex: 1 1 40%;
	}
	/* Reset the inherited "divider before each" — only divide the 2nd in a row. */
	body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee:nth-child(odd)::before {
		display: none;
	}
}

/* Mobile: single column, no dividers, comfortable stack within 375px. */
@media (max-width: 480px) {
	body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__strip {
		gap: 0.9rem !important;
	}
	body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee {
		flex: 1 1 100%;
		justify-content: flex-start;
		padding-inline: 0 !important;
	}
	body.aibt-universal .universal-trust--guarantee-strip-band .universal-trust__guarantee::before {
		display: none !important;
	}
}
