/* =====================================================================
   Toscano Widgets · Estilo para el widget "Formulario" de Elementor Pro
   Uso: selecciona el widget Formulario → Avanzado → Clases CSS → tw-form
   El formulario sigue funcionando igual (envíos, acciones, correos);
   solo cambia su aspecto.
   ===================================================================== */

.tw-form {
	--accent: #009a9d;
	--field-bg: #f6f8f8;
	--line: rgba(0, 0, 0, .14);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 24px;
	padding: clamp(24px, 3vw, 40px);
	box-shadow: 0 40px 80px -50px rgba(0, 0, 0, .4);
	font-family: "Roboto", system-ui, sans-serif;
}

.tw-form .elementor-form .elementor-field-group { margin-bottom: 12px; }

.tw-form .elementor-form .elementor-field-group .elementor-field,
.tw-form .elementor-form .elementor-field-group .elementor-field-textual,
.tw-form .elementor-form .elementor-field-group select {
	min-height: 56px !important;
	background: var(--field-bg) !important;
	border: 1px solid var(--line) !important;
	border-radius: 12px !important;
	color: #000 !important;
	font-family: inherit !important;
	font-size: 15px !important;
	padding: 14px 16px !important;
	box-shadow: none !important;
	transition: border-color .2s, box-shadow .2s, background .2s;
}
.tw-form .elementor-form .elementor-field-group .elementor-field:focus,
.tw-form .elementor-form .elementor-field-group select:focus {
	background: #fff !important;
	border-color: var(--accent) !important;
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent) !important;
	outline: none;
}
.tw-form .elementor-form .elementor-field::placeholder { color: rgba(0, 0, 0, .5); }

.tw-form .elementor-form .elementor-select-wrapper::before { color: #000; right: 16px; }

.tw-form .elementor-form .elementor-field-type-acceptance label,
.tw-form .elementor-form .elementor-field-subgroup label { font-size: 13px; color: rgba(0, 0, 0, .68); }
.tw-form .elementor-form .elementor-field-type-acceptance a { color: var(--accent); border-bottom: 1px solid currentColor; }
.tw-form .elementor-form input[type="checkbox"] { accent-color: var(--accent); width: 18px; height: 18px; }

.tw-form .elementor-form .elementor-button {
	width: 100%;
	min-height: 56px;
	background: var(--accent) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 12px !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	letter-spacing: .04em;
	box-shadow: 0 10px 30px -12px color-mix(in srgb, var(--accent) 60%, transparent);
	transition: transform .2s ease, background .2s ease;
}
.tw-form .elementor-form .elementor-button:hover { background: #000 !important; transform: translateY(-2px); }

.tw-form .elementor-message { font-size: 14px; margin-top: 12px; }
.tw-form .elementor-message.elementor-message-success { color: var(--accent); }