// ── Manifesto, CTA, Footer, Nav ───────────────────────────────────
function Manifesto() {
  return (
    <section className="manifesto">
      <div className="wrap">
        <span className="eyebrow">WHY TOKI EXISTS</span>
        <blockquote>
          Your AI bill, <em>watched.</em> By a cyan blob who remembers every prompt you have ever sent.
        </blockquote>
        <div className="manifesto-sig">— TOKI MFG. CO. · est. 2026</div>
      </div>
    </section>
  );
}

function CTA() {
  return (
    <section className="cta" id="install">
      <div className="wrap">
        <span className="eyebrow">NOW HE IS YOURS</span>
        <h2 className="h-display cta-title" style={{marginTop:'24px'}}>
          Install <em>Toki</em>.
        </h2>
        <p className="lede" style={{margin:'0 auto 40px'}}>
          He starts counting the moment you send a prompt. Free Chrome extension, zero setup, no signup.
        </p>
        <div className="cta-row">
          <a className="btn btn-primary" href="https://chromewebstore.google.com/detail/tokeneyez/ipoipckcejdkkfallnjibocejkbifjbg" target="_blank" rel="noopener">
            Install me — free
            <span className="btn-arrow">↗</span>
          </a>
          <a className="btn btn-ghost" href="https://tokeneyez.tre-lab.com/dashboard">Open the dashboard</a>
        </div>
        <div className="cta-meta">CHROME · 4.8 ★ · 12,400 USERS · LAST UPDATE 06.04.2026</div>
      </div>
    </section>
  );
}

function Nav() {
  return (
    <nav className="nav">
      <a href="#top" className="nav-brand">
        <span className="nav-dot"></span>
        TOKI / TokenEyez
      </a>
      <div className="nav-links">
        <a href="#evolution">Evolution</a>
        <a href="#features">What it does</a>
        <a href="#trim">Trim demo</a>
        <a href="#spend">Dashboard</a>
      </div>
      <a className="nav-cta" href="#install">Install free →</a>
    </nav>
  );
}

function FooterEl() {
  return (
    <footer>
      <div>TOKENEYEZ © 2026 — TOKI IS A CHARACTER</div>
      <div className="footer-links">
        <a href="#">Privacy</a>
        <a href="#">Terms</a>
        <a href="https://tokeneyez.tre-lab.com/">tre-lab.com ↗</a>
      </div>
    </footer>
  );
}

window.Manifesto = Manifesto;
window.CTA = CTA;
window.Nav = Nav;
window.FooterEl = FooterEl;