/* ── IES Icon Callout ─────────────────────────────────────────────────── */
/* Compact icon + text row (ratings / trust under forms). Figma 1957-673. */

.ies-icon-callout {
	width: 100%;
}

.ies-icon-callout__list {
	--ies-icon-callout-gap: 16px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: var(--ies-icon-callout-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ies-icon-callout__item {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	color: inherit;
}

a.ies-icon-callout__item:hover .ies-icon-callout__text {
	color: var(--ies-primary, #5d43de);
}

.ies-icon-callout__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	min-width: 20px;
	flex-shrink: 0;
	line-height: 0;
}

.ies-icon-callout__icon img {
	display: block;
	width: 20px;
	height: 20px;
	object-fit: contain;
}

.ies-icon-callout__text {
	font-family: var(--ies-font-body, Onest, sans-serif);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--ies-navy-text, #11294b);
	white-space: nowrap;
}

/* Dividers — vertical rule centered in the gap before each item after the first.
   overflow:hidden clips the leftover rule when an item wraps to a new row. */
.ies-icon-callout__list--dividers {
	overflow: hidden;
}

.ies-icon-callout__list--dividers .ies-icon-callout__item:not(:first-child)::before {
	content: '';
	position: absolute;
	left: calc(var(--ies-icon-callout-gap) / -2);
	top: 50%;
	transform: translate(-50%, -50%);
	width: 1px;
	height: 16px;
	background-color: var(--ies-neutral-gray, #d8d8e0);
	pointer-events: none;
}

/* Nested in Custom Hero — sit under the CTA / form */
.image-content-wrapper .ies-icon-callout {
	margin-top: 20px;
}

.image-content-wrapper .ies-icon-callout__icon img,
.cm_hero_banner .ies-icon-callout__icon img {
	width: 100%;
	height: 100%;
	max-width: 100%;
}

/* First item on a wrapped row — no leftover vertical rule */
.ies-icon-callout__list--dividers .ies-icon-callout__item--new-row::before {
	content: none;
	display: none;
}

@media (max-width: 767px) {
	/* Hero: center callouts under the (full-width) email field */
	.image-content-wrapper .ies-icon-callout__list,
	.cm_hero_banner .ies-icon-callout__list {
		justify-content: center !important;
	}
}

@media (max-width: 480px) {
	.ies-icon-callout__text {
		white-space: normal;
	}
}
