function MainComponent() { const bannerImage = "An evocative scene that captures the dark and mysterious essence of the Dark Fantasy genre, featuring the four siblings against a Victorian backdrop."; return /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 4, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[url('/path/to/banner-image.jpg')] bg-cover bg-center h-[500px] flex items-center justify-center", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-6xl font-bold text-white mb-4 font-crimson-text", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, "Quatro Irmãos: Sofia Salvatoris"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl text-white italic font-crimson-text", __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }, '"Lineage and blood: the eternal dance of fate"'))), /*#__PURE__*/ React.createElement("nav", { className: "flex justify-center space-x-4 bg-white bg-opacity-60 text-[#121212] p-3 font-roboto", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#about", className: "hover:underline", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, "About the Book"), /*#__PURE__*/ React.createElement("a", { href: "#characters", className: "hover:underline", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, "Characters"), /*#__PURE__*/ React.createElement("a", { href: "#author", className: "hover:underline", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Author"), /*#__PURE__*/ React.createElement("a", { href: "#reviews", className: "hover:underline", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, "Reviews"), /*#__PURE__*/ React.createElement("a", { href: "#contact", className: "hover:underline", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, "Contact")), /*#__PURE__*/ React.createElement("div", { id: "about", className: "p-4", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-bold text-[#121212] mb-3 font-crimson-text", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "About the Book"), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-[#555] mb-6 font-roboto", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, "An air of mystery lingers in Arthur's remote home...")), /*#__PURE__*/ React.createElement("div", { id: "characters", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-bold text-[#121212] mb-3 font-crimson-text", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, "Characters"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }, ` body { background: url('/path/to/victorian-pattern.png'); } `)); }