/* Contact form. Two columns on anything wider than a phone, one below. */
.sv-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 8px;
}

@media (max-width: 600px) {
	.sv-form {
		grid-template-columns: 1fr;
	}
}

.sv-form__row {
	grid-column: 1 / -1;
	margin: 0;
}

.sv-form__row--half {
	grid-column: auto;
}

.sv-form label {
	display: block;
	margin-bottom: 6px;
	font-size: .86rem;
	font-weight: 600;
	color: var(--sv-heading, #16181d);
}

.sv-form input,
.sv-form textarea {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--sv-border-strong, #cfd3da);
	border-radius: var(--sv-radius-sm, 7px);
	background: var(--sv-body-bg, #fff);
	color: inherit;
	font: inherit;
}

.sv-form input:focus,
.sv-form textarea:focus {
	border-color: var(--sv-primary, #0e7791);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--sv-primary, #0e7791) 18%, transparent);
	outline: 0;
}

.sv-form__actions {
	grid-column: 1 / -1;
	margin: 4px 0 0;
}

/* Off-screen rather than display:none - a bot that skips hidden inputs would
   sail past a honeypot it cannot see at all. */
.sv-form__pot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.sv-form__ok,
.sv-form__bad {
	margin: 0 0 18px;
	padding: 13px 16px;
	border-inline-start: 3px solid var(--sv-primary, #0e7791);
	border-radius: var(--sv-radius-sm, 7px);
	background: var(--sv-surface, #f4f5f7);
	font-size: .93rem;
}

.sv-form__bad {
	border-inline-start-color: var(--sv-accent, #c0392b);
}

/* Map embed, used on the contact page next to the form. */
.sv-map {
	overflow: hidden;
	border: 1px solid var(--sv-border, #e4e6ea);
	border-radius: var(--sv-radius, 10px);
	line-height: 0;
}

.sv-map iframe {
	display: block;
	width: 100%;
	height: 340px;
	border: 0;
}
