docs: add openjs foundation blurb on homepage

fixes lit/lit#5143

Author: e111077

packages/lit-dev-content/site/css/home.css

@@ -5,6 +5,7 @@
 @import url('./home/5-who-is-using.css');
 @import url('./home/6-explore.css');
 @import url('./home/7-connect.css');
+@import url('./home/8-open-governance.css');
 
 html {
   --home-side-margin: 2rem;

packages/lit-dev-content/site/css/home/8-open-governance.css

@@ -0,0 +1,86 @@
+#open-governance {
+  padding: 4em var(--home-side-margin) 5em var(--home-side-margin);
+  background-color: black;
+  color: white;
+}
+
+#open-governance > h1 {
+  margin-bottom: 1em;
+  max-width: var(--content-max-width);
+  margin: auto;
+}
+
+#openGovernanceContent {
+  max-width: var(--content-max-width);
+  margin: auto;
+  margin-top: 2.5em;
+  display: flex;
+  align-items: center;
+  gap: 80px;
+}
+
+#openGovernanceLogo {
+  flex: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+#openGovernanceLogo lazy-svg {
+  width: 100%;
+  max-width: 320px;
+}
+
+#openGovernanceText {
+  flex: 1;
+}
+
+#openGovernanceText h2 {
+  font-size: 24px;
+  margin-top: 0;
+}
+
+#openGovernanceText a {
+  color: white;
+  text-decoration: underline;
+}
+
+#openGovernanceText a:hover,
+#openGovernanceText a:focus {
+  background-color: var(--sys-color-primary-container);
+  color: var(--sys-color-on-primary-container);
+}
+
+#open-governance .openGovernanceLink {
+  background-color: var(--sys-color-primary);
+  color: var(--sys-color-on-primary);
+  font-size: 14px;
+  font-weight: 700;
+  padding: 8px 16px;
+  text-align: center;
+  text-decoration: none;
+  display: inline-block;
+  margin-top: 25px;
+}
+
+#open-governance .openGovernanceLink:hover,
+#open-governance .openGovernanceLink:focus {
+  background-color: var(--sys-color-primary-container);
+  color: var(--sys-color-on-primary-container);
+}
+
+@media (max-width: 860px) {
+  #openGovernanceContent {
+    flex-direction: column;
+    gap: 40px;
+    text-align: center;
+  }
+
+  #openGovernanceLogo {
+    order: -1;
+  }
+
+  #openGovernanceLogo lazy-svg {
+    max-width: 280px;
+  }
+}

packages/lit-dev-content/site/home/8-open-governance.html

@@ -0,0 +1,21 @@
+<section id="open-governance">
+  <h1 class="homeSectionHeading">Built to Last</h1>
+  <div id="openGovernanceContent">
+    <div id="openGovernanceLogo">
+      <lazy-svg href="{{ site.baseurl }}/images/logos/openjs-foundation-horizontal.svg#logo" label="Open JS Foundation" loading="visible"></lazy-svg>
+    </div>
+    <div id="openGovernanceText">
+      <h2>
+        Lit is an <a href="https://openjsf.org/" target="_blank" rel="noopener">OpenJS Foundation</a>
+        Impact Project.
+      </h2>
+      <p>
+        Lit joins Node.js, Electron, and webpack as an Impact Project. Its Technical
+        Steering Committee includes representatives from companies like Google,
+        Adobe, Reddit, as well as independent maintainers - Lit's future is
+        shaped by its community, not any single company's roadmap.
+      </p>
+      <a class="openGovernanceLink" href="{{site.baseurl}}/blog/2025-10-14-openjs/">Read the announcement</a>
+    </div>
+  </div>
+</section>

packages/lit-dev-content/site/images/logos/openjs-foundation-horizontal.svg

@@ -23,5 +23,6 @@
 {% include "./home/5-who-is-using.html" %}
 {% include "./home/6-explore.html" %}
 {% include "./home/7-connect.html" %}
+{% include "./home/8-open-governance.html" %}
 
 {% endblock %}