/* ==========================================================================
   .leqa-features — feature grid (T-C)
   Composes with primitives from main.css (.leqa-container, .leqa-section,
   .leqa-card, .leqa-eyebrow). Uses only tokens from tokens.css.
   ========================================================================== */

.leqa-features__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--leqa-space-4);
	max-width: 48rem;
	margin-inline: auto;
	margin-bottom: var(--leqa-space-8);
	text-align: center;
}

.leqa-features__title {
	font-size: var(--leqa-fs-h2);
}

.leqa-features__title-accent {
	font-style: italic;
	color: var(--leqa-accent);
	font-variation-settings: "opsz" 120;
}

.leqa-features__lead {
	font-size: var(--leqa-fs-lead);
	line-height: 1.5;
	max-width: 40rem;
}

.leqa-features__grid {
	display: grid;
	gap: var(--leqa-space-5);
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
}

.leqa-features__item {
	gap: var(--leqa-space-4);
}

.leqa-features__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 44px;
	block-size: 44px;
	border-radius: var(--leqa-radius);
	background: var(--leqa-accent-soft);
	color: var(--leqa-accent);
	border: var(--leqa-border-width) solid transparent;
}

.leqa-features__item-title {
	font-size: var(--leqa-fs-h5);
	font-variation-settings: "opsz" 28;
}

.leqa-features__item-copy {
	color: var(--leqa-text-muted);
	font-size: var(--leqa-fs-small);
	line-height: var(--leqa-lh-body);
}

/* Subtle staggered reveal per card (main.js sets .is-revealed). */
.leqa-js .leqa-features__item[data-reveal] {
	transition-delay: calc(var(--leqa-stagger) * var(--leqa-reveal-i, 0));
}

@media (max-width: 560px) {
	.leqa-features__grid {
		grid-template-columns: 1fr;
	}
}