function MainComponent({ imageUrl, title, integrations, guildInfo, gameImage }) { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center bg-[#e0e0e0] h-full sm:h-screen", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-cover bg-center", style: { backgroundImage: `url(${imageUrl})` }, __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-[#ffffff80] backdrop-filter backdrop-blur-lg", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "z-10 flex flex-col items-center justify-center space-y-4 p-4 w-full max-w-lg mx-auto", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: gameImage, alt: "RPG Adventure Game", className: "w-full h-auto rounded-md shadow-lg mb-8", __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "text-2xl sm:text-4xl text-[#333333] font-fantasy", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "text-lg sm:text-xl text-[#333333] font-roboto", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, guildInfo), /*#__PURE__*/ React.createElement("ul", { className: "list-none space-y-2", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, integrations.map((integration, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-[#333333] bg-[#f9f9f9] hover:bg-[#ececec] relative overflow-hidden font-roboto py-2 px-4 rounded-md transition duration-300", onMouseEnter: (e)=>{ e.currentTarget.style.transform = "translateX(10px)"; e.currentTarget.style.transition = "transform 300ms ease-in-out"; }, onMouseLeave: (e)=>{ e.currentTarget.style.transform = "translateX(0)"; }, __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, integration))))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { imageUrl: "/images/gaming-guild-bg.jpg", gameImage: "/images/rpg-adventure-game.jpg", title: "🎮 Join our Gaming Guild 🛡️", integrations: [ 'Exclusive Tournaments', 'Member Rankings', 'Guild Quests', 'Loot Distribution' ], guildInfo: "Strategize, compete, and earn rewards on the Avalanche network.", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this })); }