/* Mobile fixes: Contact (page 210). There is no mobile Figma frame for this
   page, so it is brought onto the system verified on the homepage (Figma
   109:3): 28px column insets, the homepage footer geometry, and full-height
   section backdrops. Mobile-only; desktop is untouched. */

@media (max-width: 767px) {

	/* Hero backdrops: the texture and grain overlays collapsed to 459px and
	   293px inside the 876px hero (the generic height:auto mobile image rule),
	   leaving a hard edge half way down the olive band. */
	body.page-id-210 .e-924fbba-f17ec1.e-924fbba-f17ec1,
	body.page-id-210 .e-b88b719-7f2a92.e-b88b719-7f2a92 {
		height: 100% !important;
	}

	/* Headlines: every Figma mobile frame sets Cepelin headlines at 45/38.
	   "Get in touch." and "Frequently asked questions" ran the desktop 70px
	   (the word FREQUENTLY alone is 363px, wider than a 390px phone's column)
	   and the founder headline 50px. */
	body.page-id-210 .e-ef6a11e-48d218,
	body.page-id-210 .e-9b1b0b2-a2daa0,
	body.page-id-210 .e-66562b3-c51171 {
		font-size: 45px !important;
		line-height: 38px !important;
	}

	/* Sections ran 60px side insets (a 320px column); the system column is
	   384px at x=28. The services list ran 24px. */
	body.page-id-210 .elementor-element-3e417d7,
	body.page-id-210 .elementor-element-6ec7aa8,
	body.page-id-210 .elementor-element-22bbb0d,
	body.page-id-210 .elementor-element-f4137a7 {
		padding-left: 28px !important;
		padding-right: 28px !important;
	}
	body.page-id-210 .elementor-element-12c50e3 {
		padding-left: 28px !important;
		padding-right: 28px !important;
	}

	/* Footer: same geometry as the homepage footer. No blurb; NAVIGATION at
	   x=60 and CONNECT at x=275, 70px under the section above; 20px links on
	   a 28px pitch (above the 24px WCAG 2.5.8 AA target); the stacked dark
	   wordmark 376x173 91px under the links; one 89px legal row. */
	body.page-id-210 .elementor-element-c39cd8b {
		padding: 70px 28px 0 !important;
	}
	body.page-id-210 .elementor-element-7d97472 {
		display: none !important;
	}
	body.page-id-210 .elementor-element-9ced73d {
		margin-left: 32px !important;
		gap: 0 !important;
		flex-wrap: nowrap !important;
	}
	body.page-id-210 .elementor-element-e19be5c {
		flex: 0 0 215px !important;
		width: 215px !important;
	}
	body.page-id-210 .elementor-element-9ced73d p:not(:first-child),
	body.page-id-210 .elementor-element-9ced73d .e-paragraph-link-base {
		font-size: 20px !important;
		letter-spacing: -0.6px !important;
	}
	body.page-id-210 .elementor-element-9ced73d .e-paragraph-link-base {
		min-height: 28px !important;
		line-height: 28px !important;
	}
	body.page-id-210 .elementor-element-e19be5c > p:not(:first-child) {
		padding-left: 4px !important;
	}
	body.page-id-210 .elementor-element-dc858c7 {
		padding: 91px 28px 27px !important;
	}
	body.page-id-210 .elementor-element-dc858c7 > img {
		content: url('../../img/socialhart-wordmark-2line-dark.png');
		width: 376px !important;
		max-width: 100% !important;
		height: 173px !important;
		object-fit: contain !important;
		margin: 0 !important;
	}
	body.page-id-210 .elementor-element-1fdb30d {
		padding: 23px 26px 22px !important;
		flex-wrap: nowrap !important;
		justify-content: flex-start !important;
		column-gap: 12px !important;
	}
	body.page-id-210 .elementor-element-977094e {
		flex: 0 0 auto !important;
		width: auto !important;
		flex-wrap: nowrap !important;
		column-gap: 12px !important;
	}
	body.page-id-210 .elementor-element-d5e257d {
		flex: 0 0 auto !important;
		width: auto !important;
		min-width: 0 !important;
		justify-content: flex-start !important;
	}
}
@media (max-width: 439px) {
	body.page-id-210 .elementor-element-1fdb30d,
	body.page-id-210 .elementor-element-977094e {
		flex-wrap: wrap !important;
	}
}

/* ── Partnerships module on Contact (client QA #39) ───────────────────────
   The module was copied over from About, which carries a full mobile
   treatment for it. Without the same rules here the 45px heading sat in a
   351px column and "PARTNERSHIPS" broke mid-word on every phone. Same
   declarations, scoped to Contact. */
@media (max-width: 767px) {
	body.page-id-210 .elementor-element-57c2e2c {
			min-height: 0 !important;
			height: auto !important;
		}
		body.page-id-210 .elementor-element-7e66e0c {
			padding: 0 !important;
		}
		body.page-id-210 .sh-collab-frame {
			display: block !important;
			position: relative !important;
			flex: 0 0 100% !important;
			width: 100% !important;
			height: 852px !important;
			padding: 457px 0 0 !important;
			box-sizing: border-box !important;
			overflow: hidden !important;
			border-radius: 0 !important;
		}
		body.page-id-210 .sh-collab-photo {
			position: absolute !important;
			top: 0 !important;
			left: calc(50% - 776.5px) !important;
			width: 1548px !important;
			max-width: none !important;
			height: 852px !important;
			object-fit: fill !important;
			border-radius: 0 !important;
			z-index: 0;
		}
		/* The exported band is uniformly ~0.69x the photo's luminance (sampled
		   every 60px down y=8720-9380), i.e. a ~30% black scrim over the image. */
		body.page-id-210 .sh-collab-frame::after {
			content: "";
			position: absolute;
			inset: 0;
			background: rgba(0, 0, 0, 0.3);
			z-index: 0;
			pointer-events: none;
		}
		body.page-id-210 .sh-collab-heading {
			position: relative !important;
			inset: auto !important;
			z-index: 1;
			width: 100% !important;
			padding: 0 39px 0 28px !important;
			margin: 0 0 22px !important;
			box-sizing: border-box !important;
			color: #EAE4D8 !important;
		}
		body.page-id-210 .sh-collab-text {
			position: relative !important;
			inset: auto !important;
			z-index: 1;
			width: 100% !important;
			padding: 0 47px 0 28px !important;
			box-sizing: border-box !important;
			row-gap: 0 !important;
		}
}
