/* Estética Leads — formulario. Hereda la marca mediante variables CSS. */
.el-form { --el-accent: #2A2420; --el-accent-hover: #7A5C38; --el-border: #E6DACA; --el-bg: #fff; --el-radius: 12px; --el-error: #9B2C1F; --el-ok: #4F5D49; --el-muted: #5A514A;
	display: grid; gap: 1rem; font-size: 1rem; position: relative; }
.el-form__title { font-weight: 600; margin: 0; }
.el-grid { display: grid; grid-template-columns: 1fr; gap: .9rem 1rem; }
@media (min-width: 640px) { .el-grid { grid-template-columns: 1fr 1fr; } .el-field--full { grid-column: 1 / -1; } }
.el-field { display: grid; gap: .35rem; margin: 0; }
.el-field label { font-size: .88rem; font-weight: 600; color: var(--el-accent); }
.el-optional { font-weight: 400; color: var(--el-muted); }
.el-field input[type=text], .el-field input[type=email], .el-field select, .el-field textarea {
	width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem; color: var(--el-accent);
	background: var(--el-bg); border: 1px solid var(--el-border); border-radius: var(--el-radius);
	padding: .85rem .95rem; min-height: 48px; transition: border-color .2s, box-shadow .2s; appearance: none; -webkit-appearance: none;
}
.el-field select { background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 20px) 55%, calc(100% - 15px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 2.5rem; }
.el-field textarea { min-height: 112px; resize: vertical; }
.el-field input:focus, .el-field select:focus, .el-field textarea:focus { outline: none; border-color: var(--el-accent-hover); box-shadow: 0 0 0 3px color-mix(in srgb, var(--el-accent-hover) 20%, transparent); }
.el-form .el-field [aria-invalid="true"] { border-color: var(--el-error); box-shadow: 0 0 0 1px var(--el-error); }
.el-help { margin: 0; font-size: .8rem; color: var(--el-muted); }
.el-error { margin: 0; font-size: .82rem; color: var(--el-error); font-weight: 500; }
.el-check { grid-template-columns: auto 1fr; align-items: start; gap: .65rem; }
.el-check input { width: 20px; height: 20px; margin: .15rem 0 0; accent-color: var(--el-accent); }
.el-check label { font-weight: 400; font-size: .9rem; color: var(--el-muted); }
.el-check label a { color: var(--el-accent); }
.el-check .el-error { grid-column: 2; }
.el-layer { font-size: .8rem; color: var(--el-muted); }
.el-layer summary { cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.el-layer p { margin: .5rem 0 0; }
.el-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.el-submit { font: inherit; font-weight: 600; font-size: .95rem; letter-spacing: .02em; cursor: pointer; border: 0; border-radius: 999px;
	background: var(--el-accent); color: #F7F3EC; padding: .95rem 1.7rem; min-height: 48px; display: inline-flex; align-items: center; gap: .6rem;
	transition: background-color .3s, transform .3s; }
.el-submit:hover { background: var(--el-accent-hover); transform: translateY(-1px); }
.el-submit:focus-visible { outline: 2px solid var(--el-accent-hover); outline-offset: 3px; }
.el-submit[disabled] { opacity: .7; cursor: progress; transform: none; }
.el-spinner { width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(247,243,236,.35); border-top-color: #F7F3EC; display: none; animation: elspin .8s linear infinite; }
.el-form.is-sending .el-spinner { display: inline-block; }
@keyframes elspin { to { transform: rotate(360deg); } }
.el-disclaimer { margin: 0; font-size: .8rem; color: var(--el-muted); flex: 1 1 220px; }
.el-note { margin: 0; font-size: .8rem; color: var(--el-muted); background: #F7F3EC; border-radius: 10px; padding: .6rem .8rem; }
.el-status:focus { outline: none; }
.el-status__ok { margin: 0; padding: 1.1rem 1.2rem; border-radius: var(--el-radius); background: color-mix(in srgb, var(--el-ok) 10%, #fff); border: 1px solid color-mix(in srgb, var(--el-ok) 35%, #fff); color: var(--el-ok); font-weight: 500; }
.el-status__error { margin: 0; padding: .9rem 1rem; border-radius: var(--el-radius); background: #FBEFEC; color: var(--el-error); }
.el-form.is-done .el-grid, .el-form.is-done .el-check, .el-form.is-done .el-layer, .el-form.is-done .el-actions, .el-form.is-done .el-note { display: none; }
.el-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .el-submit, .el-spinner { transition: none; animation: none; } }