/* Press & media page — press.html */

function PressPage() {
  React.useEffect(() => {
    document.title = "Press & media — Innoveev";
    let m = document.head.querySelector('meta[name="description"]');
    if (!m) { m = document.createElement("meta"); m.setAttribute("name", "description"); document.head.appendChild(m); }
    m.setAttribute("content", "Press resources and media enquiries for Innoveev — logos, founder bios, product assets and interview requests.");
  }, []);

  const FACTS = [
    ["Studio", "Product design & engineering"],
    ["Founded", "2018"],
    ["Headquarters", "Dubai, UAE"],
    ["Offices", "Dubai · Damascus · Istanbul · Tallinn"],
    ["Founder & CEO", "Eng. Hasan Kassas"],
    ["Products shipped", "40+"],
  ];

  const ASSETS = [
    { t: "Logo pack", d: "Primary mark, wordmark and monochrome variants — SVG and PNG." },
    { t: "Founder bios & headshots", d: "Short and long bios for Eng. Hasan Kassas and the leadership team." },
    { t: "Product screenshots", d: "High-resolution shots and device mockups of shipped work." },
    { t: "Fact sheet", d: "One-pager: who we are, where we work, what we've built." },
  ];

  return (
    <>
      <Nav />

      <header className="sub-hero">
        <div className="mesh" aria-hidden="true">
          <span className="mesh__blob mesh__blob--1"></span>
          <span className="mesh__blob mesh__blob--2"></span>
          <span className="mesh__blob mesh__blob--3"></span>
        </div>
        <div className="container">
          <div className="sub-hero__head">
            <span className="eyebrow">Press &amp; media · Replies within one business day</span>
            <h1 className="sub-hero__title">Press &amp; <em>media.</em></h1>
            <p className="sub-hero__lede">
              Writing about Innoveev, the studio, or the markets we build in — Syria's tech
              reopening included? Request assets, a founder interview, or background below.
              The form goes straight to our press desk.
            </p>
          </div>
        </div>
      </header>

      <section className="section section--tight">
        <div className="container">
          <div className="contact-grid">
            <aside className="contact-aside">
              <div className="contact-channel">
                <div className="contact-channel__label">PRESS DESK</div>
                <a href="mailto:press@innoveev.com" className="contact-channel__val" data-cursor="Email">press@innoveev.com</a>
                <div className="contact-channel__sub">Logos, founder bios and screenshots on request.</div>
              </div>

              <div className="contact-offices">
                <div className="contact-channel__label" style={{ marginBottom: 12 }}>QUICK FACTS</div>
                <ul>
                  {FACTS.map(([k, v]) => (
                    <li key={k}><span>{k}</span><span className="mono-meta" style={{ textAlign: "right" }}>{v}</span></li>
                  ))}
                </ul>
              </div>
            </aside>

            <div className="contact-form-wrap">
              <h2 className="h3" style={{ marginBottom: 6 }}>Request press materials or an interview</h2>
              <p className="body" style={{ color: "var(--ink-soft)", marginBottom: 24 }}>
                Tell us what you're working on and your deadline — we'll get back fast.
              </p>
              <RequestForm
                to="press@innoveev.com"
                subjectPrefix="Press request"
                orgLabel="Publication / outlet"
                orgPlaceholder="e.g. Wamda, TechCrunch, freelance"
                typeLabel="What do you need?"
                typeOptions={["Interview with the founder", "Logos & brand assets", "Founder bio & headshot", "Product screenshots", "Background / fact sheet", "Something else"]}
                messageLabel="Details & deadline"
                messagePlaceholder="I'm writing a piece on Syria's tech reopening for … and would love a 20-min interview before Friday."
                submitLabel="Send to the press desk"
                note="We respond within one business day. Assets are sent over email once we confirm the outlet."
              />
            </div>
          </div>

          <div className="section-head" style={{ marginTop: 96 }}>
            <div>
              <span className="eyebrow">Media kit</span>
              <h2 className="h2 section-head__title">What we can send.</h2>
            </div>
            <p className="lede section-head__lede">
              Request any of these in the form above and we'll email them across — usually the same day.
            </p>
          </div>
          <div className="app-features">
            {ASSETS.map((a) => (
              <div key={a.t} className="app-feature">
                <div className="app-feature__title">{a.t}</div>
                <p className="app-feature__desc">{a.d}</p>
              </div>
            ))}
          </div>
        </div>
      </section>

      <Footer />
      <TweaksUI />
      <StickyCTA />
      <CookieBanner />
      <CustomCursor enabled={window.useTweaksDefaults.cursor} />
      <BuildMode />
      <KeyboardEggs />
    </>
  );
}

window.PressPage = PressPage;