/*
 * Layout for the Contacts page (templates/page-contacts.html) — the page's own editable
 * content (wp:post-content, filled in from the Page editor, same as any regular Page)
 * is expected to hold the enacoding-functions/contact-info and enacoding-functions/contact-form
 * blocks; this arranges them into a two-column row instead of the default stacked flow,
 * matching the layout shown to the user. The shared .enacoding-page body (see
 * assets/page-head.css) handles the breadcrumb/title band and page-level spacing,
 * untouched here.
 */

.enacoding-page__body .wp-block-post-content {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	align-items: start;
}

/* Beats the global :where(.is-layout-flow) > * { margin-block-start: 1.2rem; } rule
   (specificity 0, so any normal selector wins) — that rule only zeroes out the FIRST
   child's top margin, so the second column (the form) sat lower than the first. Grid
   columns should start flush with each other instead. */
.enacoding-page__body .wp-block-post-content > * {
	margin-block-start: 0;
}

@media ( min-width: 900px ) {
	.enacoding-page__body .wp-block-post-content {
		grid-template-columns: 5fr 7fr;
		gap: 3rem;
	}
}