// pages-partners.jsx

function PartnersPage({ go }) {
  return (
    <main className="page shell" data-screen-label="05 Partners">
      <div className="about-hero">
        <h1>The <em>collaborators.</em></h1>
      </div>

      <section>
        <div className="sect-head">
          <h2>Production &amp; <em>finance.</em></h2>
        </div>
        <div className="partners-grid">
          {window.PARTNERS.map((p, i) => (
            <article key={p.name} className="partner-cell">
              <div className="logo-slot">{p.name}</div>
              <p className="desc">{p.desc}</p>
              <div className="tag eg-label">{p.tag}</div>
            </article>
          ))}
        </div>
      </section>

      <section className="partners-membership-section">
        <div className="about-statement about-statement--flush">
          <div className="label-col">
            <div className="eg-label">Membership</div>
          </div>
          <div className="body">
            <p>Laura is a proud member of <em>BAFTA</em>, the <em>Producers Guild of America</em>, <em>Producers United</em>, the <em>Television Academy</em>, <em>Film Independent</em>, and <em>Women in Film</em>.</p>
            <p className="partners-membership-note">
              We participate in industry programming across producers labs, fellowships, festival juries, and emerging-media initiatives. If you're a guild or academy interested in collaborating, reach out.
            </p>
          </div>
        </div>
      </section>
    </main>
  );
}

Object.assign(window, { PartnersPage });