Match Home, top nav, hero, and logo wall to the current marketing frames.

Puts Workshops in the header, pairs the hero with a static rule card and breakpoint CTAs, and shows the three pilot marks with no wall label.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/components/sections/LogoWall/LogoWall.container.tsx

@@ -1,9 +1,8 @@
 "use client";
 
 /**
- * Figma: "Section / Logo Wall" (18847:22366)
- * Index frames: 320–429 2×3 grid, 430–639 3×2 grid, 640+ space-between row.
- * Logo heights from those instances (1× / 1.25 at lg / 1.5625 at xl).
+ * Figma: "Section / Logo Wall" (18483:18425)
+ * Home uses the three pilot marks (street medics, Food Not Bombs, Mutual Aid Colorado).
  */
 
 import { memo, useMemo } from "react";
@@ -17,41 +16,20 @@ const LogoWallContainer = memo<LogoWallProps>(({ logos, className = "" }) => {
 
   const defaultLogos = useMemo(
     () => [
+      {
+        src: getAssetPath(partnerLogoPath("boulder-street-medics")),
+        alt: t("partners.boulderStreetMedics"),
+        size: "h-[48px] lg:h-[60px] xl:h-[74.6px]",
+      },
       {
         src: getAssetPath(partnerLogoPath("food-not-bombs")),
         alt: t("partners.foodNotBombs"),
         size: "h-[48px] lg:h-[60px] xl:h-[74.6px]",
-        order: "sm:order-4 md:order-4",
-      },
-      {
-        src: getAssetPath(partnerLogoPath("start-coop")),
-        alt: t("partners.startCoop"),
-        size: "h-[51.4px] lg:h-[64.2px] xl:h-[80.3px]",
-        order: "sm:order-1 md:order-3",
-      },
-      {
-        src: getAssetPath(partnerLogoPath("metagov")),
-        alt: t("partners.metagov"),
-        size: "h-[26.2px] lg:h-[33px] xl:h-[41px]",
-        order: "sm:order-6 md:order-1",
-      },
-      {
-        src: getAssetPath(partnerLogoPath("open-civics")),
-        alt: t("partners.openCivics"),
-        size: "h-[50.1px] lg:h-[61.1px] xl:h-[72px]",
-        order: "sm:order-5 md:order-2",
       },
       {
         src: getAssetPath(partnerLogoPath("mutual-aid-co")),
         alt: t("partners.mutualAidCo"),
         size: "h-[51.1px] lg:h-[63.6px] xl:h-[79.5px]",
-        order: "sm:order-2 md:order-5",
-      },
-      {
-        src: getAssetPath(partnerLogoPath("cu-boulder")),
-        alt: t("partners.cuBoulder"),
-        size: "h-[44.6px] lg:h-[55.8px] xl:h-[69.7px]",
-        order: "sm:order-3 md:order-6",
       },
     ],
     [t],
@@ -63,11 +41,7 @@ const LogoWallContainer = memo<LogoWallProps>(({ logos, className = "" }) => {
   );
 
   return (
-    <LogoWallView
-      heading={t("heading")}
-      displayLogos={displayLogos}
-      className={className}
-    />
+    <LogoWallView displayLogos={displayLogos} className={className} />
   );
 });
 

app/components/sections/LogoWall/LogoWall.types.ts

@@ -5,20 +5,17 @@ export interface LogoWallProps {
     width?: number;
     height?: number;
     size?: string;
-    order?: string;
   }>;
   className?: string;
 }
 
 export interface LogoWallViewProps {
-  heading: string;
   displayLogos: Array<{
     src: string;
     alt: string;
     width?: number;
     height?: number;
     size?: string;
-    order?: string;
   }>;
   className: string;
 }

app/components/sections/LogoWall/LogoWall.view.tsx

@@ -4,41 +4,31 @@ import { memo } from "react";
 import Image from "next/image";
 import type { LogoWallViewProps } from "./LogoWall.types";
 
-function LogoWallView({
-  heading,
-  displayLogos,
-  className,
-}: LogoWallViewProps) {
+function LogoWallView({ displayLogos, className }: LogoWallViewProps) {
   return (
     <section
       className={`bg-[var(--color-surface-default-primary)] p-[var(--space-800)] md:px-[var(--space-600)] md:py-[var(--space-800)] lg:px-[var(--space-1800)] lg:py-[var(--space-1200)] xl:px-[160px] xl:py-[var(--space-1800)] ${className}`}
+      data-figma-node="18483-18425"
     >
-      <div className="flex flex-col items-center gap-[var(--space-800)] md:gap-[var(--space-600)] xl:gap-[var(--space-800)]">
-        <p className="font-inter text-center text-[10px] font-medium uppercase leading-[12px] text-[var(--color-content-default-primary)] xl:text-[14px] xl:leading-[12px]">
-          {heading}
-        </p>
-        <div className="w-full opacity-60">
-          <div className="grid grid-cols-2 grid-rows-3 sm:grid-cols-3 sm:grid-rows-2 md:flex md:w-full md:flex-nowrap md:items-center md:justify-between gap-[38.4px] lg:gap-[var(--space-1200)]">
-            {displayLogos.map((logo, index) => (
-              <div
-                key={index}
-                className={`flex items-center justify-center md:shrink-0 ${
-                  logo.order || ""
-                }`}
-              >
-                <Image
-                  src={logo.src}
-                  alt={logo.alt}
-                  className={`${logo.size || "h-8"} w-auto object-contain`}
-                  priority={index < 2} // Prioritize first 2 logos for above-the-fold loading
-                  unoptimized // Skip optimization for local images
-                  width={0}
-                  height={0}
-                  sizes="100vw"
-                />
-              </div>
-            ))}
-          </div>
+      <div className="w-full opacity-60">
+        <div className="flex w-full flex-col items-center gap-[38.4px] sm:flex-row sm:flex-wrap sm:justify-around md:flex-nowrap md:justify-between lg:gap-[var(--space-1200)]">
+          {displayLogos.map((logo, index) => (
+            <div
+              key={logo.alt || index}
+              className="flex items-center justify-center md:shrink-0"
+            >
+              <Image
+                src={logo.src}
+                alt={logo.alt}
+                className={`${logo.size || "h-8"} w-auto object-contain`}
+                priority={index < 2}
+                unoptimized
+                width={0}
+                height={0}
+                sizes="100vw"
+              />
+            </div>
+          ))}
         </div>
       </div>
     </section>