/* Contact overlay: desktop 2016:24; mobile 12:893. */
html.es-contact-open { overflow: hidden; }
.es-contact {
	position: fixed;
	inset: 0;
	/* Only matters outside the top layer; showModal() places it above everything. */
	z-index: var(--es-z-contact);
	width: 100%;
	max-width: none;
	height: 100%;
	height: 100dvh;
	max-height: none;
	margin: 0;
	padding: 3.5rem 2.5rem 3.5rem 1.8125rem;
	border: 0;
	overflow: auto;
	background: radial-gradient(ellipse at center, rgba(246,195,213,.2), rgba(132,126,166,.2)), var(--wp--preset--color--base, #f0eeed);
	color: var(--wp--preset--color--contrast, #3d251d);
	font-family: var(--wp--preset--font-family--display, "formiga", serif);
	font-size: 2rem;
	line-height: 1.2;
	letter-spacing: -.015625rem;
}
.es-contact[open] { display: flex; flex-direction: column; }
.es-contact [hidden] { display: none !important; }
.es-contact > .wpcf7 { flex: 1; display: flex; margin: 0; }
.es-contact .es-contact__form { flex: 1; display: flex; flex-direction: column; gap: 2rem; min-width: 0; margin: 0; }
.es-contact__top { width: min(60%, 47.25rem); display: grid; gap: 2rem; }
.es-contact__field { min-width: 0; }
.es-contact .wpcf7-form-control-wrap { display: block; }
.es-contact .es-contact__form p { margin: 0; }
.es-contact .es-contact__form br { display: none; }
.es-contact input:not([type=hidden]), .es-contact textarea {
	display: block; width: 100%; min-width: 0; padding: .35rem 0; margin: 0;
	border: 0; border-radius: 0; background: transparent; color: inherit;
	font: inherit; line-height: 1.25; box-shadow: none; caret-color: currentColor;
}
.es-contact textarea { min-height: 5rem; resize: vertical; }
.es-contact input::placeholder, .es-contact textarea::placeholder { color: inherit; opacity: .5; }
/* Clip the browser autofill highlight so the overlay gradient stays visible. */
.es-contact input:is(:autofill, :-webkit-autofill) {
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: var(--wp--preset--color--contrast, #3d251d);
	caret-color: var(--wp--preset--color--contrast, #3d251d);
}
.es-contact input:focus-visible, .es-contact textarea:focus-visible { outline: none; box-shadow: 0 1px currentColor; }
.es-contact__bottom { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 2rem; margin-top: auto; }
.es-contact__send, .es-contact__close {
	min-width: 2.75rem; min-height: 2.75rem; padding: .35rem 0; border: 0;
	border-radius: 0; box-shadow: none; background: transparent; color: inherit;
	font: inherit; cursor: pointer;
}
.es-contact .es-contact__send { color: var(--wp--preset--color--contrast-alt, #703319); }
.es-contact__send:disabled { opacity: .5; cursor: wait; }
.es-contact__close { position: absolute; top: 3.5rem; right: 2.5rem; }
.es-contact__send:hover, .es-contact__close:hover { text-decoration: underline; }
.es-contact__brand { display: none; }
.es-contact__success { max-width: 70%; margin: 0; }
.es-contact__sent-email { margin: auto 0 0; overflow-wrap: anywhere; }
.es-contact.is-sent > .wpcf7 { display: none; }
.es-contact__feedback { margin-top: 1.5rem; font: 1rem/1.4 var(--wp--preset--font-family--body, sans-serif); }
.es-contact__status { margin: 0; }
.es-contact__fallback { color: inherit; overflow-wrap: anywhere; }
.es-contact .wpcf7-not-valid-tip { margin-top: .5rem; color: var(--wp--preset--color--contrast-alt, #703319); font: .875rem/1.4 var(--wp--preset--font-family--body, sans-serif); }
.es-contact .wpcf7-response-output, .es-contact .wpcf7-spinner { display: none; }
.es-contact .screen-reader-response { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.es-contact__challenge { order: 1; align-self: center; max-width: 100%; }
.es-contact__challenge:empty { display: none; }
@media (prefers-reduced-motion: no-preference) {
	.es-contact { opacity: 0; transition: opacity .4s ease, display .4s allow-discrete, overlay .4s allow-discrete; }
	.es-contact[open] { opacity: 1; }
	@starting-style { .es-contact[open] { opacity: 0; } }
}
@media (width < 768px) {
	.es-contact { padding: 7rem 1.125rem max(1.125rem, env(safe-area-inset-bottom)); font-size: 1.375rem; }
	.es-contact__brand { display: block; position: absolute; top: 1.5rem; left: 1.125rem; width: min(55vw, 13.875rem); height: 1.5rem; }
	.es-contact__brand svg { display: block; width: 100%; height: 100%; }
	.es-contact__close { top: .75rem; right: 1.125rem; font-size: 1.0625rem; }
	.es-contact__top { width: 100%; gap: 1.5rem; }
	.es-contact__bottom { gap: 1rem; }
	.es-contact__send { font-size: 1.0625rem; }
	.es-contact__success { max-width: 100%; }
}
@media (max-height: 480px) { .es-contact { padding-top: 5rem; } }
