/*
 * Contact page. Its own file so it loads only where it is used, and so the
 * single-listing redesign moving through main.css never collides with it.
 */

.own-contact__inner {
	max-width: 720px;
	margin: 0 auto;
	padding-block: var(--own-space-8);
	padding-left: var(--own-gutter);
	padding-right: var(--own-gutter);
}

.own-contact__title {
	margin: 0 0 var(--own-space-4);
	font-size: 2rem;
	font-weight: var(--own-weight-heading);
	color: var(--own-color-primary);
}

.own-contact__intro {
	margin: 0 0 var(--own-space-7);
	color: var(--own-color-text-2);
}

.own-contact__form {
	padding: var(--own-space-6);
	background: var(--own-color-surface-panel);
	border: 1px solid var(--own-color-border);
	border-radius: var(--own-radius-lg);
}

.own-contact__notice {
	margin: var(--own-space-5) 0 0;
	padding: var(--own-space-3) var(--own-space-4);
	font-size: 0.875rem;
	color: var(--own-color-text);
	background: var(--own-color-cream);
	border-radius: var(--own-radius-md);
}

.own-contact__fallback {
	margin: 0;
	color: var(--own-color-text-2);
}

@media (max-width: 640px) {
	.own-contact__form {
		padding: var(--own-space-4);
	}
}