/**
 * Card surface styles for marketing and content sections.
 */

.pp-card {
	padding: var(--wp--preset--spacing--lg);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--lg);
	background-color: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--contrast);
}

.pp-card > :first-child {
	margin-top: 0;
}

.pp-card > :last-child {
	margin-bottom: 0;
}

.pp-card__title {
	margin: 0 0 var(--wp--preset--spacing--sm);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.pp-card__body {
	margin: 0;
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--md);
}

.pp-card__meta {
	margin-top: var(--wp--preset--spacing--sm);
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--sm);
}

.pp-card--flush {
	padding: 0;
	overflow: hidden;
}

.pp-pattern-how-it-works .pp-card {
	height: 100%;
}