/* Hand-written styles.
 *
 * Everything under assets/css/ is Divi output extracted from the original
 * WordPress export and named by content hash - those files are generated and
 * should not be edited. This file is the opposite: maintained by hand, plain
 * name, safe to change.
 *
 * It deliberately lives at assets/site.css rather than assets/css/site.css.
 * staticwebapp.config.json serves /assets/css/* with
 * "Cache-Control: max-age=31536000, immutable", which is correct for
 * content-hashed files and wrong for one whose name never changes - an edit
 * would not reach anyone holding a cached copy for up to a year.
 */

/* --- Homepage hero ------------------------------------------------------ */

/* The hero's top spacing used to come from the row holding the partner badge.
 * That row moved out to its own section, so the spacing is restored here to
 * match the pre-migration site: measured on the live original, the headline
 * sits 247px into the section at 1280px wide and 104px at 375px. clamp()
 * tracks between those points instead of jumping at a breakpoint.
 *
 * Both values carry +20px over the measured targets because the headline row
 * has margin-top:-20px, which the removed row used to absorb.
 *
 * The doubled class matches the specificity of Divi's own
 * ".et_pb_section_0.et_pb_section { padding-top: 0vw }" in
 * et-critical.deaa7bc7.css. A single .et_pb_section_0 loses to it on
 * specificity no matter how late this file loads.
 */
.et_pb_section_0.et_pb_section {
	padding-top: clamp(124px, 20.9vw, 267px);
}

/* --- Section headings --------------------------------------------------- */

/* The partnerships and technology sections. Divi's theme sets h2 to 26px
 * through a bare "h2" selector, so a single class is enough to override it -
 * no !important, and no dependence on this file's load order.
 */
.section-heading h2 {
	font-size: 32px;
}

/* --- Technology cards --------------------------------------------------- */

/* The theme sets ".flex-row-wrapper { display: flex }" with no flex-wrap, so
 * it defaults to nowrap. That was invisible while the row held exactly four
 * cards; with eight, the columns compressed onto a single line at ~104px each
 * instead of wrapping, and the text towered to 2500px tall.
 *
 * The row-gap replaces the spacing the columns would otherwise get from being
 * the only row.
 */
.flex-row-wrapper {
	flex-wrap: wrap;
	row-gap: 30px;
}

/* Card logos are sized by their own intrinsic dimensions, capped by the
 * theme's "img { max-width: 100% }" - the PNGs are all 400px square. The
 * Azure DevOps SVG shipped declaring width="18", which rendered it at 12px
 * beside 98px neighbours; it carries a viewBox, so its declared size was
 * changed to 400 in the file itself rather than corrected here. Keep any
 * further logos at a comparable intrinsic size and no CSS is needed.
 */

/* --- Partner badges ----------------------------------------------------- */

/* #efefef is not a new colour: the contact section already uses it, so the
 * page keeps alternating between the same white and grey.
 */
.partner-badges-section {
	background-color: #efefef;
}

/* A flex row rather than Divi columns: the badges are a single group that
 * should stay centred and wrap as a unit, and adding a fifth badge then costs
 * one <span> instead of restructuring the column maths.
 *
 * width:100% overrides a Divi rule that sizes image modules to 12% of their
 * row, which otherwise shrinks the wrapper while the images overflow it.
 */
.partner-badges {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	gap: 24px;
}

.partner-badges .et_pb_image_wrap {
	max-width: 250px;
}

/* 250px is the target, not a floor. Four badges at 250px plus three 24px gaps
 * need 1072px, but the row is 1012px at a 1280px viewport, so a hard 250
 * stranded the fourth badge on a line of its own. Flex items wrap rather than
 * shrink once flex-wrap is on, so the cap is expressed as a quarter of the
 * row instead: four always share one line, at the full 250px once the row is
 * wide enough (about a 1360px viewport and up).
 *
 * Desktop only - below Divi's 981px breakpoint a quarter of the row would be
 * a ~57px badge, so there they keep the flat 250px cap and wrap normally.
 */
@media (min-width: 981px) {
	.partner-badges .et_pb_image_wrap {
		max-width: min(250px, calc((100% - 72px) / 4));
	}
}

/* All four badges are RGBA PNGs. Keep it that way if more are added: these
 * badges have rounded corners, and the JPEG versions Microsoft also supplies
 * bake opaque white into the area outside that radius, which shows as four
 * light notches against the grey background.
 */
