// ============================================================ // Qestylo — final CTA + contact + footer + App // ============================================================ const { useState, useEffect, useRef, useCallback } = React; // ---------------- 9 · CONTACTO + CTA FINAL ---------------- function Contacto({ prefillMessage }) { const [form, setForm] = useState({ nombre: '', telefono: '', mensaje: '' }); const [touched, setTouched] = useState(false); const [sent, setSent] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false); useEffect(() => { if (prefillMessage) { setForm((f) => ({ ...f, mensaje: prefillMessage })); } }, [prefillMessage]); const errors = { nombre: form.nombre.trim().length < 2, telefono: !/^[0-9+\s]{6,}$/.test(form.telefono.trim()), }; const valid = !errors.nombre && !errors.telefono; const set = (k) => (e) => setForm((f) => ({ ...f, [k]: e.target.value })); const submit = async () => { setTouched(true); if (!valid) return; setIsSubmitting(true); try { await fetch('https://formsubmit.co/ajax/qestylo@qestylo.com', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' }, body: JSON.stringify({ _subject: `Nuevo Presupuesto Web — ${form.nombre}`, _template: 'box', Nombre: form.nombre, Teléfono: form.telefono, Detalles: form.mensaje || 'No especificado' }) }); } catch (error) { console.error('Error enviando formulario:', error); } finally { setIsSubmitting(false); setSent(true); } }; const field = (label, key, props = {}) => (
setTouched(true)} className={`focus-ring w-full rounded-lg bg-ink/60 border px-4 py-3.5 text-[15px] text-cream placeholder:text-muted/60 transition-colors ${touched && errors[key] ? 'border-amber/70' : 'border-white/10' }`} {...props} /> {touched && errors[key] && (

{key === 'nombre' ? 'Dinos tu nombre.' : 'Necesitamos un teléfono válido.'}

)}
); return (
{/* left — pitch */} Tu presupuesto

Tu presupuesto, gratis y a tu medida

Cuéntanos qué quieres cambiar y te respondemos sin compromiso. ¿Prefieres ver toda nuestra obra primero? Te llevamos a{' '} qestylo.com.

{/* Contact info grid */}

Teléfono

983 266 408

Email / Gmail

qestylo@qestylo.com

Dirección

C/ Puente Colgante 16, 47007 Valladolid
{/* Social networks section */}

Síguenos en nuestras Redes Sociales

{/* Instagram */} {/* Facebook */} {/* TikTok */}

Presupuesto sin compromiso · Respuesta en menos de 24 h · Instalación con la cobertura de la Red Oficial Kömmerling (CAES).

{/* right — contact (no
tag, onClick only) */}
{!sent ? (
{field('Nombre', 'nombre', { placeholder: 'Tu nombre', type: 'text' })} {field('Teléfono', 'telefono', { placeholder: '983 000 000', type: 'tel' })}
{ e.preventDefault(); submit(); }} className={`w-full ${isSubmitting ? 'opacity-75 pointer-events-none' : ''}`}> {isSubmitting ? 'Enviando...' : 'Pide presupuesto'} {!isSubmitting && }

Al enviar aceptas que te contactemos sobre tu solicitud.

) : (

¡Gracias, {form.nombre.split(' ')[0]}!

Hemos abierto tu solicitud. Si lo prefieres, llámanos al 983 266 408 y lo cerramos por teléfono.

)}
); } // ---------------- FOOTER ---------------- function Footer({ onOpenLegal }) { const links = [ ['Ventanas', '#solucion'], ['Puertas', '#puertas'], ['Persianas', '#persianas'], ['Cómo funciona', '#como'], ['qestylo.com', 'https://www.qestylo.com/'], ['Aviso legal', 'legal'], ['Privacidad', 'privacidad'], ['Política de Cookies', 'cookies'], ]; return ( ); } // ---------------- APP ---------------- function App() { const [prefillMsg, setPrefillMsg] = useState(''); const [activeLegalTab, setActiveLegalTab] = useState(null); useEffect(() => { window.onLegalTabChange = (tab) => { setActiveLegalTab(tab); }; return () => { window.onLegalTabChange = null; }; }, []); return (
{ setPrefillMsg(`Hola, me interesa recibir presupuesto sin compromiso e información para el sistema de ventanas Kömmerling ${sysName}.`); }} /> { setPrefillMsg(`Hola, me interesa recibir presupuesto sin compromiso e información para el sistema de puertas Kömmerling ${sysName}.`); }} /> { setPrefillMsg(`Hola, me interesa recibir presupuesto sin compromiso e información para el sistema de persianas/contraventanas Kömmerling ${sysName}.`); }} />