function MainComponent() { const [taglineIndex, setTaglineIndex] = useState(0); const [contactMethod, setContactMethod] = useState("email"); const [email, setEmail] = useState(""); const [phone, setPhone] = useState(""); const [status, setStatus] = useState({ type: "", message: "" }); const [isSubmitting, setIsSubmitting] = useState(false); const taglines = [ "creating conscious connections", "get high, without getting high high", "here, high on life", "Where the vibe is high, but no one's flying", "Get lifted—no smoke required", "Elevate your mind, not your bloodstream", "Feel the buzz, without the buzz buzz", "Mojo the mood", "Get lit, without being lit lit", "High energy, low risk", "Be a cloudy cloud" ]; useEffect(()=>{ const interval = setInterval(()=>{ setTaglineIndex((current)=>(current + 1) % taglines.length); }, 1000); return ()=>clearInterval(interval); }, []); const handleSubmit = async (e)=>{ e.preventDefault(); setIsSubmitting(true); setStatus({ type: "", message: "" }); try { const response = await fetch("/api/waitlist-signup", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ email: contactMethod === "email" ? email : null, phone: contactMethod === "phone" ? phone : null }) }); const data = await response.json(); if (data.error) { setStatus({ type: "error", message: data.error }); } else { setStatus({ type: "success", message: "Successfully joined the waitlist! 🎉" }); setEmail(""); setPhone(""); } } catch (error) { setStatus({ type: "error", message: "Something went wrong. Please try again." }); } finally{ setIsSubmitting(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-purple-900 via-purple-800 to-indigo-900 text-white relative overflow-hidden", __source: { fileName: "", lineNumber: 70, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 pointer-events-none overflow-hidden", __source: { fileName: "", lineNumber: 72, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-[-10%] left-[-5%] w-[300px] md:w-[500px] h-[300px] md:h-[500px] rounded-full bg-purple-600/20 blur-[80px] md:blur-[100px] animate-float", __source: { fileName: "", lineNumber: 73, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-[30%] right-[-5%] w-[250px] md:w-[400px] h-[250px] md:h-[400px] rounded-full bg-indigo-600/20 blur-[80px] md:blur-[100px] animate-float-delayed", __source: { fileName: "", lineNumber: 74, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-[-5%] left-[10%] w-[350px] md:w-[600px] h-[350px] md:h-[600px] rounded-full bg-violet-600/20 blur-[80px] md:blur-[100px] animate-float", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "fixed top-4 md:top-8 left-4 md:left-8 z-50", __source: { fileName: "", lineNumber: 79, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl md:text-6xl font-bold animate-bounce-slow", __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "bg-gradient-to-r from-pink-300 via-purple-300 to-indigo-300 bg-clip-text text-transparent hover:from-pink-200 hover:via-purple-200 hover:to-indigo-200 transition-all duration-300 cursor-default select-none", __source: { fileName: "", lineNumber: 81, columnNumber: 11 }, __self: this }, "ZZA"))), /*#__PURE__*/ React.createElement("main", { className: "relative min-h-screen flex items-center justify-center px-4 py-16 md:py-0", __source: { fileName: "", lineNumber: 91, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl mx-auto", __source: { fileName: "", lineNumber: 92, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "flex items-center justify-center text-center", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full", __source: { fileName: "", lineNumber: 94, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl md:text-3xl lg:text-4xl font-bold mb-4 md:mb-6 leading-tight", __source: { fileName: "", lineNumber: 95, columnNumber: 15 }, __self: this }, "Experience Natural", /*#__PURE__*/ React.createElement("span", { className: "block bg-gradient-to-r from-purple-200 via-indigo-200 to-purple-200 bg-clip-text text-transparent", __source: { fileName: "", lineNumber: 97, columnNumber: 17 }, __self: this }, "Elevation")), /*#__PURE__*/ React.createElement("div", { className: "h-14 md:h-16 mb-6", __source: { fileName: "", lineNumber: 102, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-base md:text-xl transition-all duration-300 animate-neon px-2", __source: { fileName: "", lineNumber: 103, columnNumber: 17 }, __self: this }, taglines[taglineIndex])), /*#__PURE__*/ React.createElement("div", { className: "max-w-xs mx-auto mb-8 backdrop-blur-lg bg-white/5 p-3 md:p-4 rounded-xl border border-white/10", __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-2 md:space-y-3", __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center gap-2", __source: { fileName: "", lineNumber: 114, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setContactMethod("email"), className: `px-3 py-1.5 rounded-full text-sm transition-all ${contactMethod === "email" ? "bg-purple-500/30 text-white" : "bg-white/5 text-purple-200 hover:bg-white/10"}`, __source: { fileName: "", lineNumber: 115, columnNumber: 21 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setContactMethod("phone"), className: `px-3 py-1.5 rounded-full text-sm transition-all ${contactMethod === "phone" ? "bg-purple-500/30 text-white" : "bg-white/5 text-purple-200 hover:bg-white/10"}`, __source: { fileName: "", lineNumber: 126, columnNumber: 21 }, __self: this }, "Phone")), contactMethod === "email" ? /*#__PURE__*/ React.createElement("input", { type: "email", value: email, onChange: (e)=>setEmail(e.target.value), placeholder: "Enter your email", className: "w-full px-3 py-2 rounded-full bg-white/5 border border-white/10 text-white placeholder-purple-200/70 focus:outline-none focus:border-purple-400 transition-all text-sm", required: true, __source: { fileName: "", lineNumber: 140, columnNumber: 21 }, __self: this }) : /*#__PURE__*/ React.createElement("input", { type: "tel", value: phone, onChange: (e)=>setPhone(e.target.value), placeholder: "Enter your phone number", className: "w-full px-3 py-2 rounded-full bg-white/5 border border-white/10 text-white placeholder-purple-200/70 focus:outline-none focus:border-purple-400 transition-all text-sm", required: true, __source: { fileName: "", lineNumber: 150, columnNumber: 21 }, __self: this }), status.message && /*#__PURE__*/ React.createElement("div", { className: `text-xs ${status.type === "error" ? "text-red-400" : "text-green-400"}`, __source: { fileName: "", lineNumber: 162, columnNumber: 21 }, __self: this }, status.message), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting, className: "w-full px-4 py-2 bg-gradient-to-r from-purple-500/80 to-indigo-500/80 rounded-full font-medium text-sm hover:from-purple-500/90 hover:to-indigo-500/90 transition-all duration-300 disabled:opacity-50", __source: { fileName: "", lineNumber: 169, columnNumber: 19 }, __self: this }, isSubmitting ? "Joining..." : "Join Waitlist"))), /*#__PURE__*/ React.createElement("div", { className: "mt-6 text-xs text-white/50", __source: { fileName: "", lineNumber: 180, columnNumber: 15 }, __self: this }, "queries read at dreamy@zza.bar")))))); } { /* Add animations */ }{ /* Update animations with purple neon */ }/*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 197, columnNumber: 1 }, __self: this }, ` @keyframes purple-neon-pulse { 0%, 100% { text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #a855f7, 0 0 82px #a855f7, 0 0 92px #a855f7, 0 0 102px #a855f7, 0 0 151px #a855f7; } 50% { text-shadow: 0 0 4px #fff, 0 0 7px #fff, 0 0 18px #fff, 0 0 38px #a855f7, 0 0 73px #a855f7, 0 0 80px #a855f7, 0 0 94px #a855f7, 0 0 140px #a855f7; } } @keyframes float { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-20px) rotate(5deg); } } @keyframes float-delayed { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-15px) rotate(-5deg); } } @keyframes bounce-slow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .animate-float { animation: float 20s ease-in-out infinite; } .animate-float-delayed { animation: float-delayed 25s ease-in-out infinite; } .animate-purple-neon { animation: purple-neon-pulse 1.5s ease-in-out infinite; color: #f3e8ff; } .animate-bounce-slow { animation: bounce-slow 3s ease-in-out infinite; } `);

ZZA

Experience NaturalElevation