/*!
 * Macaneta Group — subpages stylesheet
 * Loads on every non-front page. Pairs with vanilla Gutenberg block markup in Services / About / etc.
 * Reuses the --mg-* palette declared in homepage.css; redeclares as a safety net for pages where homepage.css isn't enqueued.
 */

:root {
	--mg-navy: #0d2453;
	--mg-navy-deep: #061229;
	--mg-blue: #2871d8;
	--mg-blue-light: #7cb5e8;
	--mg-slate: #9ba8c2;
	--mg-bg: #ffffff;
	--mg-bg-alt: #f5f7fb;
	--mg-ink: #1a202c;
	--mg-ink-mute: #525d72;
	--mg-line: #e4e9f2;
	--mg-radius: 14px;
	--mg-shadow: 0 8px 30px rgba(13, 36, 83, 0.08);
}

/* ---------- Page wrapper ---------- */
body.mg-subpage .site-main {
	background: var(--mg-bg);
}

body.mg-subpage .entry-content {
	max-width: 820px;
	margin: 0 auto;
	padding: 96px 24px 120px;
	color: var(--mg-ink);
	font-size: 17px;
	line-height: 1.7;
	font-feature-settings: "ss01", "ss02";
}

@media (max-width: 720px) {
	body.mg-subpage .entry-content {
		padding: 56px 20px 80px;
		font-size: 16px;
	}
}

/* ---------- Headings ---------- */
body.mg-subpage .entry-content h1.wp-block-heading {
	font-size: clamp(2.4rem, 5vw, 3.4rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--mg-navy);
	margin: 0 0 0.4em;
	font-weight: 700;
}

body.mg-subpage .entry-content h1.wp-block-heading + p {
	font-size: 1.18rem;
	color: var(--mg-ink-mute);
	margin: 0 0 1.6em;
	max-width: 65ch;
}

body.mg-subpage .entry-content h1.wp-block-heading + p strong {
	color: var(--mg-navy);
	font-weight: 600;
}

body.mg-subpage .entry-content h2.wp-block-heading {
	font-size: clamp(1.55rem, 3vw, 1.9rem);
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--mg-navy);
	margin: 2.4em 0 0.7em;
	font-weight: 700;
	position: relative;
	padding-top: 0.3em;
}

body.mg-subpage .entry-content h2.wp-block-heading::before {
	content: "";
	display: block;
	width: 44px;
	height: 3px;
	background: var(--mg-blue);
	border-radius: 2px;
	margin-bottom: 0.7em;
}

body.mg-subpage .entry-content h3.wp-block-heading {
	font-size: 1.2rem;
	color: var(--mg-navy);
	margin: 1.8em 0 0.5em;
	font-weight: 600;
}

/* ---------- Paragraphs & body text ---------- */
body.mg-subpage .entry-content p {
	margin: 0 0 1.1em;
	color: var(--mg-ink);
}

body.mg-subpage .entry-content p strong {
	color: var(--mg-navy);
	font-weight: 600;
}

body.mg-subpage .entry-content em {
	color: var(--mg-navy);
	font-style: italic;
}

/* ---------- Lists ---------- */
body.mg-subpage .entry-content ul {
	list-style: none;
	padding: 0;
	margin: 0 0 1.4em;
}

body.mg-subpage .entry-content ul li {
	position: relative;
	padding: 0 0 0 28px;
	margin: 0 0 0.7em;
	color: var(--mg-ink);
}

body.mg-subpage .entry-content ul li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 0.7em;
	width: 8px;
	height: 8px;
	background: var(--mg-blue);
	border-radius: 50%;
	transform: translateY(-50%);
}

body.mg-subpage .entry-content ul li strong {
	color: var(--mg-navy);
	font-weight: 600;
}

/* ---------- Separator ---------- */
body.mg-subpage .entry-content hr.wp-block-separator {
	border: 0;
	height: 1px;
	background: var(--mg-line);
	margin: 2.4em 0;
	max-width: none;
}

/* ---------- Links ---------- */
body.mg-subpage .entry-content a {
	color: var(--mg-blue);
	text-decoration: none;
	border-bottom: 1px solid rgba(40, 113, 216, 0.35);
	transition: color 0.15s ease, border-color 0.15s ease;
}

body.mg-subpage .entry-content a:hover {
	color: var(--mg-navy);
	border-bottom-color: var(--mg-navy);
}

/* Mailto link at end of page styled like a soft CTA button */
body.mg-subpage .entry-content h3.wp-block-heading + p a[href^="mailto:"] {
	display: inline-block;
	padding: 0.55em 1.1em;
	background: var(--mg-navy);
	color: #fff !important;
	border-radius: 999px;
	border: 0;
	font-weight: 600;
	margin-top: 0.4em;
	box-shadow: var(--mg-shadow);
	transition: transform 0.15s ease, background 0.15s ease;
}

body.mg-subpage .entry-content h3.wp-block-heading + p a[href^="mailto:"]:hover {
	background: var(--mg-blue);
	transform: translateY(-1px);
	color: #fff;
}

/* ---------- Soft hero band behind the H1 ---------- */
body.mg-subpage .entry-content::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 380px;
	background: linear-gradient(180deg, var(--mg-bg-alt) 0%, transparent 100%);
	z-index: -1;
	pointer-events: none;
}

body.mg-subpage .entry-content {
	position: relative;
}

body.mg-subpage .site-main {
	position: relative;
	overflow: hidden;
}