/**
 * Front-end styles. Deliberately tiny — the builder's job is to produce plain
 * Elementor output, so anything here has to earn its place.
 *
 * Card rows: a legacy .elementor-container is display:flex and, above 1024px,
 * does NOT wrap — Elementor only sets flex-wrap:wrap in its tablet media query.
 * So a block of nine cards at 25% each squashed into one row of slivers instead
 * of breaking after the fourth. Wrapping is what makes the 4-per-row cap real,
 * and centring is what stops a short final row (or a two-card block) from
 * hugging the left edge. (Boss, 2026-08-01)
 */
.elementor-section.ppb-card-row > .elementor-container,
.ppb-card-row > .elementor-container {
	flex-wrap: wrap;
	justify-content: center;
}

/**
 * Long headlines. Deliberately NOT a font-size rule: Elementor writes
 * per-widget typography as `.elementor-element-<id> .elementor-heading-title`,
 * which outranks anything we could put here — a size default would either be
 * silently ignored or start a specificity fight with the designer.
 *
 * These two properties Elementor does not set, so they apply cleanly and a
 * designer can still override either one per widget in the editor.
 *   text-wrap: balance   — spreads a long headline evenly instead of leaving
 *                          one orphan word on the last line
 *   overflow-wrap        — a long unbroken token (a URL, a domain) wraps
 *                          instead of overflowing its column
 * (Boss, 2026-08-01)
 */
[class*="pb-"] .elementor-heading-title {
	text-wrap: balance;
	overflow-wrap: break-word;
}