.vo-form-wrap {
	max-width: 900px;
}

.vo-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	padding: clamp(24px, 4vw, 46px);
	border: 1px solid var(--vo-line);
	border-radius: var(--vo-radius);
	background: var(--vo-white);
	box-shadow: 0 16px 54px rgba(17, 17, 17, 0.06);
}

.vo-form label {
	display: grid;
	gap: 8px;
	color: var(--vo-ink);
	font-weight: 700;
}

.vo-form label:has(textarea),
.vo-form button {
	grid-column: 1 / -1;
}

.vo-form input,
.vo-form textarea,
.vo-form select {
	width: 100%;
	border: 1px solid var(--vo-line);
	border-radius: var(--vo-radius);
	background: var(--vo-white);
	color: var(--vo-ink);
	padding: 0.92rem 1rem;
	font-weight: 400;
}

.vo-form textarea {
	resize: vertical;
}

.vo-form input:focus,
.vo-form textarea:focus,
.vo-form select:focus {
	outline: 2px solid var(--vo-vanilla);
	outline-offset: 2px;
}

.vo-form .vo-button {
	justify-self: start;
	cursor: pointer;
}

.vo-form-notice {
	margin-bottom: 18px;
	padding: 1rem 1.2rem;
	border-radius: var(--vo-radius);
	background: var(--vo-vanilla-light);
	color: var(--vo-ink);
	font-weight: 700;
}

.vo-form-notice--error {
	background: #f5e4df;
}

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