/* About Us (page 134) -- hero visual.
 *
 * Loaded from the page body, after every layout stylesheet, so these rules win
 * against page-blocks.css at equal specificity. Selectors mirror Elementor's
 * own 0,3,0 shape (.elementor-134 .elementor-element.elementor-element-<id>)
 * rather than escalating, so the cascade stays predictable.
 *
 * The hero (00a0f4d) is flex-direction:row with align-items:stretch. The empty
 * right-hand side came from --padding-right:64% on the text child (0e3c4f3):
 * a reserved gap with nothing in it. That padding is dropped and a real image
 * child (ychero01) takes the space, so flex does the layout.
 *
 * Page content and existing widgets are untouched.
 */

/* Text column: release the reserved 64% and share the row with the image. */
.elementor-134 .elementor-element.elementor-element-0e3c4f3 {
	--padding-right: 0%;
	flex: 1 1 54%;
	min-width: 0;
	justify-content: center;
}

/* The heading was set to 105.898% wide, overflowing its own container. */
.elementor-134 .elementor-element.elementor-element-ef463dc {
	width: 100%;
	max-width: 100%;
	--container-widget-width: 100%;
}

/* Image column.
 *
 * The hero sets --align-items:stretch, which made this column fill the full
 * hero height and forced the image to ~550px tall. align-self:center opts out
 * of that stretch so the image is sized by its own rules below, not by the
 * section height.
 */
.elementor-134 .elementor-element.elementor-element-ychero01 {
	flex: 0 1 46%;
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	align-self: center;
}

.elementor-134 .elementor-element.elementor-element-ychero02 {
	width: 100%;
}

/* The source is 2560x1696 (landscape, 0.66) -- a full-contrast photograph of
 * the lab's scanning room, not a faded wash, so it stays legible at this size.
 * Height is capped and object-fit crops rather than letting a 1696px-tall
 * image set the section height. object-position favours the centre, where the
 * equipment sits, over the floor at the bottom of the frame.
 */
.elementor-134 .elementor-element.elementor-element-ychero02 img {
	display: block;
	width: 100%;
	max-width: 480px;
	height: clamp(240px, 27vw, 320px);
	object-fit: cover;
	object-position: center 45%;
	margin-inline-start: auto;
	border-radius: 14px;
	box-shadow: 0 18px 40px -24px rgba(16, 24, 40, 0.45);
}

/* ---- Tablet ---------------------------------------------------------- */
@media (max-width: 1024px) {
	.elementor-134 .elementor-element.elementor-element-ychero02 img {
		max-width: 380px;
		height: clamp(210px, 30vw, 270px);
	}
}

/* ---- Mobile ----------------------------------------------------------
 * The hero already wraps (--flex-wrap-mobile:wrap). Rather than squeezing the
 * image into a narrow column, it becomes a short full-width band under the
 * text, which keeps the section balanced at phone widths.
 */
@media (max-width: 767px) {
	.elementor-134 .elementor-element.elementor-element-0e3c4f3 {
		flex: 1 1 100%;
	}

	.elementor-134 .elementor-element.elementor-element-ychero01 {
		flex: 1 1 100%;
		justify-content: center;
		margin-block-start: 28px;
	}

	.elementor-134 .elementor-element.elementor-element-ychero02 img {
		max-width: 100%;
		height: 180px;
		margin-inline: auto;
	}
}
