/* Styling for the Benefits widget. Depends on dpi-global (tokens). */

/* Column widths come from the shared .dpi-grid layout (dpi-global.css); rows chunked in PHP via dpi_grid_rows(). */

/* Card colour comes from the positional .dpi-card--* utilities (dpi-global.css), assigned in PHP – same 70/30 rotation logic as Facts. */

.dpi-profile-benefits__card {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 310px;
	padding: 20px;
}

/* Beat Elementor kit heading colours (.elementor-kit-* h3, h4) inside coloured cards. */
.dpi-profile-benefits__card.dpi-card--orange,
.dpi-profile-benefits__card.dpi-card--orange .dpi-profile-benefits__card-title,
.dpi-profile-benefits__card.dpi-card--orange p {
	color: var(--dpi-orange-fg);
}

.dpi-profile-benefits__card.dpi-card--blue,
.dpi-profile-benefits__card.dpi-card--blue .dpi-profile-benefits__card-title,
.dpi-profile-benefits__card.dpi-card--blue p {
	color: var(--dpi-blue-fg);
}

.dpi-profile-benefits__card.dpi-card--lime,
.dpi-profile-benefits__card.dpi-card--lime .dpi-profile-benefits__card-title,
.dpi-profile-benefits__card.dpi-card--lime p {
	color: var(--dpi-lime-fg);
}

/* Base font (size/weight) comes from the shared .dpi-fact-label / .dpi-fact-value utilities (dpi-global.css). */

.dpi-profile-benefits__card-title {
	margin: 0 0 10px;
	text-decoration: underline;
}

.dpi-profile-benefits__card-desc {
	margin: 0;
}

@media (min-width: 640px) {
	.dpi-grid__row--70-30 > .dpi-profile-benefits__card:first-child .dpi-profile-benefits__card-desc,
	.dpi-grid__row--30-70 > .dpi-profile-benefits__card:nth-child(2) .dpi-profile-benefits__card-desc {
		max-width: 80%;
	}

	.dpi-grid__row--70-30 > .dpi-profile-benefits__card:nth-child(2) .dpi-profile-benefits__card-desc,
	.dpi-grid__row--30-70 > .dpi-profile-benefits__card:first-child .dpi-profile-benefits__card-desc {
		max-width: 80%;
	}
}