/* global React, ReactDOM, AnnouncementBar, Nav, Newsletter, Footer, RUTHLESS, STANDALONES */
/* TORI STONE — Media Kit page app */

function MediaKitSection() {
  return (
    <section id="mediakit" className="section">
      <div className="frame">
        <div className="section__head">
          <div className="section__eyebrow">Press · Media · Trade</div>
          <h2 className="section__title">Media <span className="ital">Kit</span></h2>
          <p className="section__sub">Everything you need to feature, review, interview, or place Tori Stone. For deeper materials, get in touch.</p>
        </div>

        <div className="mk-grid">

          <div className="mk-block mk-block--bios">
            <h3 className="mk-block__h">Bio</h3>
            <p className="mk-bio__body">Tori Stone writes dark contemporary romance, including mafia, bratva, forbidden, and the kind of slow-burn tension that makes readers lose sleep.</p>
            <p className="mk-bio__body">Her flagship five-book Ruthless Series follows the Santoros, a New Orleans mafia family navigating power, vows, and the women who refuse to be ruined. Beyond New Orleans, her standalones move through Chicago and Las Vegas with arranged marriages, enemies-to-lovers, and bratva forbidden love.</p>
            <p className="mk-bio__body">Her books are unhinged on purpose. When she's not writing, she's reading something she shouldn't be, lighting candles that smell like a confessional, and ignoring her TBR pile.</p>
            <p className="mk-bio__body">Available for interviews, podcast guesting, panels, and signed-book trade events.</p>
          </div>

          <div className="mk-block mk-block--photo">
            <h3 className="mk-block__h">Author Image</h3>
            <div className="mk-author-image">
              <img src="assets/tori-stone-rose.jpg" alt="Tori Stone" />
              <span className="mk-author-image__name">Tori Stone</span>
            </div>
          </div>

          <div className="mk-block mk-block--facts">
            <h3 className="mk-block__h">Quick Facts</h3>
            <dl className="mk-facts">
              <div><dt>Genre</dt><dd>Dark Contemporary Romance · Mafia · Bratva</dd></div>
              <div><dt>Series</dt><dd>The Ruthless Series (5 books, New Orleans)</dd></div>
              <div><dt>Standalones</dt><dd>Chicago · Las Vegas settings</dd></div>
              <div><dt>Heat level</dt><dd>Explicit, on-page</dd></div>
              <div><dt>Tropes</dt><dd>Arranged marriage · Forbidden · Enemies to lovers · Morally gray MMC</dd></div>
              <div><dt>Pen name</dt><dd>Tori Stone</dd></div>
            </dl>
          </div>

          <div className="mk-block mk-block--contact">
            <h3 className="mk-block__h">Press Contact</h3>
            <p className="mk-block__body">For interview requests, advance review copies (ARCs), book club appearances, podcast guesting, panel invitations, and trade event coordination.</p>
            <a href="Contact.html" className="btn">Contact Tori <span className="arrow"></span></a>
            <p className="mk-block__sub">Direct: <a href="mailto:tori@toristonebooks.com" className="mk-link">tori@toristonebooks.com</a></p>
          </div>

        </div>
      </div>
    </section>
  );
}

function MediaKitApp() {
  React.useEffect(() => {
    document.documentElement.setAttribute("data-variation", "luxe");
    document.documentElement.setAttribute("data-density", "regular");
    document.body.setAttribute("data-atmosphere", "on");
  }, []);

  return (
    <>
      <AnnouncementBar />
      <Nav />
      <MediaKitSection />
      <Footer />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(<MediaKitApp />);