/**
 * Styles for the native Contacts page (template-contacts.php).
 * Enqueued conditionally from inc/contacts-page.php for pages 713 / 7183.
 *
 * All rules scoped under .pi-contacts so they can't leak into other pages.
 */

.pi-contacts {
	display: block;
}

/* Larger gap between page-head (breadcrumbs + H1) and the full-bleed map
   so the heading has room to breathe. */
.pi-contacts .pi-page-head {
	padding-bottom: 64px;
}
@media (max-width: 760px) {
	.pi-contacts .pi-page-head {
		padding-bottom: 32px;
	}
}

/* ─────────────── Map (full-bleed) ─────────────── */

.pi-contacts-map {
	width: 100%;
	line-height: 0;
	background: #eef0f3;
}

.pi-contacts-map iframe {
	display: block;
	width: 100%;
	height: 590px;
	border: 0;
}

/* ─────────────── Body band ─────────────── */

.pi-contacts-body {
	padding: 50px 0;
}

.pi-contacts-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	gap: 60px;
	align-items: start;
}

/* ─────────────── Left column (info) ─────────────── */

.pi-contacts-info {
	font-style: normal; /* override <address> default italic */
}

.pi-contacts-info__heading {
	margin: 0 0 28px;
	font-size: 24px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--pi-color-text, #181D4E);
	letter-spacing: .02em;
}

.pi-contacts-info__list {
	margin: 0 0 32px;
}

/* .pi-cinfo-list / .pi-cinfo__icon / .pi-cinfo__link are in main.css —
   reusing them so contact rows match what the footer / other components
   already render. No need to redeclare here. */

.pi-contacts-socials {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 10px;
}

.pi-contacts-socials a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: transparent;
	border: 1px solid #d6d8e0;
	color: var(--pi-color-text, #181D4E);
	transition: background .15s, color .15s, border-color .15s;
}

.pi-contacts-socials a:hover {
	background: var(--pi-color-brand, #DB2B0E);
	border-color: var(--pi-color-brand, #DB2B0E);
	color: #fff;
}

/* ─────────────── Right column (form) ─────────────── */

.pi-contacts-form {
	min-width: 0;
}

/* CF7 form styling is global in main.css; the column just hosts the form. */

/* ─────────────── Optional extra content (the_content) ─────────────── */

.pi-contacts-extra {
	padding: 24px 0 60px;
}

.pi-contacts-extra__inner {
	max-width: 1040px;
}

.pi-contacts-extra p {
	margin: 0 0 16px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--pi-color-text, #181D4E);
}

/* ─────────────── Responsive ─────────────── */

@media (max-width: 980px) {
	.pi-contacts-grid {
		gap: 40px;
	}
	.pi-contacts-map iframe { height: 460px; }
}

@media (max-width: 760px) {
	.pi-contacts-body { padding: 32px 0; }
	.pi-contacts-grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.pi-contacts-info__heading { font-size: 20px; margin-bottom: 20px; }
	.pi-contacts-info__list { margin-bottom: 24px; }
	.pi-contacts-map iframe { height: 320px; }
}