/* =========================================================================
   StarFroid — trust strip (brief §5: 4 cyan Lucide icons)
   Paiement à la livraison · Livraison 58 wilayas · Produits garantis · Support
   ========================================================================= */

.sf-trust {
	background: var(--c-bg-alt);
	border-block: 1px solid var(--c-border);
}
.sf-trust__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-4);
	padding-block: var(--space-5);
}
.sf-trust__item {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	text-align: start;
}
.sf-trust__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	flex: none;
	border-radius: var(--radius-pill);
	background: var(--c-fresh-soft);
	color: var(--c-fresh);
}
.sf-trust__label {
	font-weight: 600;
	font-size: var(--fs-100);
	color: var(--c-primary);
	line-height: 1.3;
	margin: 0;
}

@media (min-width: 768px) {
	.sf-trust__grid { grid-template-columns: repeat(4, 1fr); }
	.sf-trust__label { font-size: var(--fs-200); }
}

/* Full-bleed strip: spread the 4 items across the full width with dividers
   between them (design mockup). The section background already goes edge-to-edge
   via base.css; here we widen the content and separate the cells. */
.sf-trust > .sf-container { max-width: none; }
@media (min-width: 768px) {
	.sf-trust__grid { gap: 0; }
	/* Center each item in its cell so the short last label ("Support client")
	   isn't left-aligned with a lopsided empty space on the right. */
	.sf-trust__item { padding-inline: var(--space-5); justify-content: center; }
	.sf-trust__item + .sf-trust__item { border-inline-start: 1px solid var(--c-border); }
}