.ww-contact-form {
	color: var(--ww-color-ink, #2a2320);
}

.ww-contact-form__form {
	display: grid;
	gap: var(--ww-space-6, 1.5rem);
}

.ww-contact-form__field {
	display: grid;
	gap: var(--ww-space-2, 0.5rem);
}

.ww-contact-form__field label {
	font-size: 0.94rem;
	font-weight: 800;
	line-height: 1.2;
}

.ww-contact-form__field input,
.ww-contact-form__field textarea {
	width: 100%;
	min-height: 3.3rem;
	padding: 0.8rem 0.9rem;
	border: 1px solid rgb(143 46 31 / 0.3);
	border-radius: var(--ww-radius-sm, 0.5rem);
	background: var(--ww-color-white, #fff);
	box-shadow: none;
	color: var(--ww-color-ink, #2a2320);
	font: inherit;
	line-height: 1.45;
	transition: border-color 160ms ease, box-shadow 160ms ease;
}

.ww-contact-form__field textarea {
	min-height: 10.5rem;
	resize: vertical;
}

.ww-contact-form__field input:focus,
.ww-contact-form__field textarea:focus {
	border-color: var(--ww-color-teal-dark, #0f6e56);
	outline: 3px solid rgb(15 110 86 / 0.24);
	outline-offset: 2px;
}

.ww-contact-form__field input[aria-invalid="true"],
.ww-contact-form__field textarea[aria-invalid="true"] {
	border-color: var(--ww-color-coral-deep, #8f2e1f);
}

.ww-contact-form__field-error {
	margin: 0;
	color: var(--ww-color-coral-deep, #8f2e1f);
	font-size: 0.88rem;
	font-weight: 700;
}

.ww-contact-form__honeypot {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.ww-contact-form__form .ww-button {
	justify-self: start;
	cursor: pointer;
}

.ww-contact-form__form .ww-button:disabled {
	cursor: wait;
	opacity: 0.7;
	transform: none;
}

.ww-contact-form__status {
	min-height: 0;
}

.ww-contact-form__status:not(:empty) {
	padding: var(--ww-space-2, 0.5rem) 0 var(--ww-space-2, 0.5rem) var(--ww-space-4, 1rem);
	border-left: 3px solid var(--ww-color-coral-dark, #c0432f);
}

.ww-contact-form__status--success {
	border-left-color: var(--ww-color-teal-dark, #0f6e56) !important;
}

.ww-contact-form__status p {
	margin: 0;
	font-weight: 800;
}

.ww-contact-form__status .ww-contact-form__notice {
	margin-top: var(--ww-space-2, 0.5rem);
	color: var(--ww-color-ink-soft, #5a4f49);
	font-size: 0.9rem;
	font-weight: 400;
}

@media (max-width: 30rem) {
	.ww-contact-form__form .ww-button {
		width: 100%;
	}
}