function MainComponent() { const headerText = "Explore the Future"; const buttonText = "Join Us"; const descriptionText = "Immerse yourself in innovation with cutting-edge technology and groundbreaking ideas."; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen", __source: { fileName: "", lineNumber: 6, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "bg-[#FFFFFF] p-4 shadow-md", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto flex justify-between items-center", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-2xl font-bold text-[#007BFF]", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, "TechSphere"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "mx-2 px-4 py-2 font-roboto text-sm bg-[#007BFF] text-white rounded", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("button", { className: "mx-2 px-4 py-2 font-roboto text-sm bg-transparent text-[#007BFF] border border-[#007BFF] rounded hover:bg-[#007BFF] hover:text-white transition duration-300", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("button", { className: "mx-2 px-4 py-2 font-roboto text-sm bg-transparent text-[#007BFF] border border-[#007BFF] rounded hover:bg-[#007BFF] hover:text-white transition duration-300", __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, "Products"), /*#__PURE__*/ React.createElement("button", { className: "mx-2 px-4 py-2 font-roboto text-sm bg-transparent text-[#007BFF] border border-[#007BFF] rounded hover:bg-[#007BFF] hover:text-white transition duration-300", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "Contact")))), /*#__PURE__*/ React.createElement("header", { className: "flex-grow flex items-center justify-center bg-cover bg-[url('/images/tech-background.jpg')]", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 font-crimson-text text-5xl text-white", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, headerText), /*#__PURE__*/ React.createElement("p", { className: "mb-6 font-roboto text-lg text-[#d1d1d1]", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, descriptionText), /*#__PURE__*/ React.createElement("button", { className: "px-8 py-3 font-roboto text-lg bg-[#007BFF] text-white rounded shadow-lg", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, buttonText))), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#F8F9FA] p-4", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto text-center", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-sm text-[#6c757d]", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, "© 2023 TechSphere. All rights reserved."))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } body { font-family: 'Roboto', sans-serif; animation: fadeIn 1s ease-in-out; } `)); }