/* About us — Beliefs (node 2646:4984). The fourth insertion of the reusable
 * alternating rows (patterns/solutions-direct-to-patient.php); the shared
 * file owns the alternation, the header measure, the row rhythm, the type
 * and the photo radius. This file holds only what the About comp changes,
 * every rule scoped under the page hook so the six other consumers of the
 * pattern (Pharma, Product Studio, Clinical Evidence, AI Agents, Lens,
 * Platform) are untouched.
 *
 * Compound selectors (.infinitus-section--about-beliefs together with
 * .infinitus-section--solutions-direct-to-patient) on purpose: this file is
 * enqueued BEFORE the shared one by the alphabetical glob, so a rule of equal
 * specificity here loses on order. Same note as about-problem.css. */

.infinitus-section--about-beliefs.infinitus-section--solutions-direct-to-patient {
	/* The row's split, node 2646:4990: a 605 copy column and a 499 photograph
	   in a 1240 content box, 136 between. Percentages of the box rather than
	   the pixels, the same call platform-how-it-works.css records: pinning the
	   photograph at 499 leaves the copy 334px at 1025 (865 - 499 - 32), a
	   ribbon against the comp's 605 measure, while the ratio holds the comp's
	   proportions at every width in the 1025–1439 band and lands on exactly
	   605 / 499 / 136 at 1440. The two measures cap the columns so a wider
	   screen never grows them past the node. */
	--about-beliefs-copy-basis: 48.79%;
	--about-beliefs-copy-measure: 605px;
	--about-beliefs-photo-basis: 40.24%;
	--about-beliefs-photo-measure: 499px;
}

/* Desktop only. The shared rule leaves core's `flex-grow: 1` on every column,
 * which hands the leftover to both boxes and re-wraps the copy wider than the
 * comp, so grow is zeroed here. !important because the columns carry
 * `style="flex-basis:605px"` / `499px` inline. Bounded to >=1025: below it
 * the shared stacked band's `flex-basis: 100% !important` and `width: 100%`
 * have to win, which they do by being the only rule in play. */
@media (min-width: 1025px) {
	.infinitus-section--about-beliefs.infinitus-section--solutions-direct-to-patient
		.solutions-direct-to-patient__copy {
		flex-basis: var(--about-beliefs-copy-basis) !important;
		flex-grow: 0;
		flex-shrink: 1;
		max-width: var(--about-beliefs-copy-measure);
	}

	.infinitus-section--about-beliefs.infinitus-section--solutions-direct-to-patient
		.solutions-direct-to-patient__aside {
		flex-basis: var(--about-beliefs-photo-basis) !important;
		flex-grow: 0;
		flex-shrink: 1;
		max-width: var(--about-beliefs-photo-measure);
	}
}

/* Tablet and phone: photograph above the copy on every row (handoff §4
 * "All rows stack — image above copy"). The shared stack keeps DOM order,
 * which is copy-first on every row, so the photo column is pulled ahead
 * with `order` — the markup stays the pattern's and the desktop alternation
 * above 1024 keeps working. Same band as the shared stack (<=1024.98,
 * BugHerd #64). */
@media (max-width: 1024.98px) {
	.infinitus-section--about-beliefs.infinitus-section--solutions-direct-to-patient
		.solutions-direct-to-patient__aside {
		order: -1;
	}
}
