/**
 * Value Props style: Card Grid
 *
 * A centered statement over three rows of three white panels, each with its icon overhanging
 * the panel's top-left corner. Shared rules — the panel, the icon circle and its overhang,
 * the intro's flex column — are in value-props.css.
 */

.module.value-props.style-grid .intro {
	gap: var(--text-spacing-small);
	text-align: center;
}

.module.value-props.style-grid .eyebrow {
	justify-content: center;
}

.module.value-props.style-grid .props {
	column-gap: var(--text-spacing-small);
	grid-template-columns: repeat(3, 1fr);
	margin-top: var(--text-spacing-medium);
	row-gap: var(--text-spacing-xsmall);
}

.module.value-props.style-grid .panel p {
	margin-block: 0;
}

/***************************************************************************************************************************************************************************************/
/* MQ MAX-WIDTH 950 - Tablet Sizes */
/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(950rem/16)) {

	.module.value-props.style-grid .props {
		grid-template-columns: minmax(0, 1fr);
	}

}