/* Shared layout helper for legal / boilerplate pages
   (privacy, terms, accessibility, service pages).

   Renders Nav + a constrained article shell + Footer + cursor +
   AI assistant + keyboard eggs + cookie banner. Pass `title`,
   `eyebrow`, `lede`, and the article body as children.
*/

function SimplePage({ eyebrow, title, lede, lastUpdated, children }) {
  React.useEffect(() => {
    document.title = `${title} — 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", lede || `${title} for Innoveev.`);
  }, [title, lede]);

  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>
          <span className="mesh__fade-bottom"></span>
        </div>
        <div className="container">
          <div className="sub-hero__head">
            {eyebrow ? <span className="eyebrow">{eyebrow}</span> : null}
            <h1 className="sub-hero__title">{title}</h1>
            {lede ? <p className="sub-hero__lede">{lede}</p> : null}
            {lastUpdated ? (
              <div className="mono-meta" style={{ marginTop: 18 }}>
                Last updated · {lastUpdated}
              </div>
            ) : null}
          </div>
        </div>
      </header>

      <section className="section section--tight">
        <div className="container">
          <article className="legal-prose">{children}</article>
        </div>
      </section>

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

window.SimplePage = SimplePage;