/* Desktop vs Figma fixes: Subscribe (page 4143). The page has a pink hero
   — same as Bubbly — so the site-wide cream nav is invisible over it.
   custom.css handles pages 35, 36 and single-post; this file extends those
   same rules to 4143. Also sets the desktop footer geometry (the mobile
   rules live in mobile-pages/legal-and-tools.css).
   min-width 768px except where noted. */

/* ── Nav: dark ink over the pink hero ───────────────────────────────────
   Page 35 and 36 already get this treatment in custom.css (the cream
   cream logo and text colour are unreadable on light backgrounds). */
body.page-id-4143 .sh-nav-links .e-paragraph-base,
body.page-id-4143 .sh-nav-toggle {
	color: #462222 !important;
}
body.page-id-4143 .sh-nav > .e-flexbox-base img {
	content: url('../../img/socialhart-nav-logo-dark.svg');
	filter: none !important;
}
@media (min-width: 768px) {
	body.page-id-4143 .sh-nav > .e-flexbox-base:not(.sh-nav-links):not(.sh-mobile-menu) img {
		content: url('../../img/socialhart-nav-logo-bar-dark.svg');
		filter: none !important;
	}
	/* The nav bar is its own row above the hero, not over it, so it showed
	   the white page background. Same pink as the hero, as the phone rule in
	   mobile-pages/legal-and-tools.css already does. */
	body.page-id-4143 .elementor-element-2ef291b {
		background-color: #EAC8C6 !important;
	}
}

/* ── Footer (desktop) ────────────────────────────────────────────────────
   Same Figma footer geometry as Resources/Contact: NAVIGATION at x=1143,
   CONNECT at x=1358, wordmark 1414x186 at x=50 490px below footer top,
   legal bar 89px tall. */
@media (min-width: 768px) {
	body.page-id-4143 .elementor-element-4e51e69 {
		padding-right: 65px !important;
		padding-left: 46px !important;
	}
	body.page-id-4143 .elementor-element-ee0c51b {
		flex: 0 0 322px !important;
		width: 322px !important;
		gap: 0 !important;
	}
	body.page-id-4143 .elementor-element-5175777 {
		flex: 0 0 215px !important;
		width: 215px !important;
	}
	body.page-id-4143 .elementor-element-5175777 > p:not(:first-child) {
		padding-left: 4px !important;
	}
	body.page-id-4143 .elementor-element-c0ee2c5 {
		flex: 0 0 107px !important;
		width: 107px !important;
	}
	body.page-id-4143 .elementor-element-05fbd82 {
		padding: 256px 48px 25px 50px !important;
	}
	/* (.elementor-element-36c9de2 never matched: atomic images carry
	   e-36c9de2-… only, so the wordmark stayed 1322px wide at x=96.) */
	body.page-id-4143 .elementor-element-05fbd82 > img {
		width: 1414px !important;
		max-width: 100% !important;
		height: 186px !important;
		margin: 0 !important;
		object-fit: fill !important;
	}
	body.page-id-4143 .elementor-element-c009c13 {
		height: 89px !important;
		align-items: flex-start !important;
		padding: 18px 51px 53px 46px !important;
		box-sizing: border-box !important;
	}
	body.page-id-4143 .elementor-element-969b9c7 {
		gap: 12px !important;
	}
}

/* Tablet (laid out at 1024): the wordmark box is capped to the footer width,
   so the height must follow it instead of staying 186px (stretched). */
@media (min-width: 768px) and (max-width: 1024px) {
	body.page-id-4143 .elementor-element-05fbd82 > img {
		height: auto !important;
		object-fit: contain !important;
	}
}