function MainComponent() { const floatingAnimation = { animation: 'float 3s ease-in-out infinite' }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f7f7f8] flex flex-col items-center justify-center p-4", __source: { fileName: "", lineNumber: 4, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full py-5 flex justify-center items-center bg-[#ffffff] shadow-md", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl text-[#202020] font-bold font-roboto", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "CaptionThat")), /*#__PURE__*/ React.createElement("main", { className: "flex-1 flex flex-col items-center justify-center text-center", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[300px] sm:w-[450px] lg:w-[600px] xl:w-[750px]", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/images/captionthat-logo.png", alt: "CaptionThat app logo", className: "mx-auto", style: floatingAnimation, width: "100%", height: "auto", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-3xl text-[#202020] my-5", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "📷 Snap It. 📝 Caption It. 🚀 Share It."), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-xl text-[#555555] mb-6", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, "Join the community and start creating amazing captions for your photos!"), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-xs", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Enter your email", className: "w-full px-4 py-2 border-2 border-[#dddddd] rounded-lg text-lg text-[#666666] mb-4", required: true, __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-3 bg-[#008cff] text-white text-lg rounded-lg font-roboto transition duration-300 ease-in-out hover:bg-[#0072e5]", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, "Join Now"))), /*#__PURE__*/ React.createElement("footer", { className: "w-full py-4 bg-[#ffffff] shadow-inner", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-sm text-[#888888]", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "© 2023 CaptionThat. All rights reserved."))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, ` @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } } `)); }