From b98fb1183347c61cea0c99b2b548f1433208e274 Mon Sep 17 00:00:00 2001
From: adilallo <39313955+adilallo@users.noreply.github.com>
Date: Thu, 21 Aug 2025 08:32:34 -0600
Subject: [PATCH] Logo Wall xl breakpoint

---
 app/components/LogoWall.js | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/app/components/LogoWall.js b/app/components/LogoWall.js
index 635686a..8836fc7 100644
--- a/app/components/LogoWall.js
+++ b/app/components/LogoWall.js
@@ -6,37 +6,37 @@ const LogoWall = ({ logos = [] }) => {
     {
       src: "assets/Section/Logo_FoodNotBombs.png",
       alt: "Food Not Bombs",
-      size: "h-11 lg:h-14",
+      size: "h-11 lg:h-14 xl:h-[70px]",
       order: "order-1 sm:order-4", // Mobile: row 1 col 1, SM: row 2 col 1 (bottom left)
     },
     {
       src: "assets/Section/Logo_StartCOOP.png",
       alt: "Start COOP",
-      size: "h-[42px] lg:h-[53px]",
+      size: "h-[42px] lg:h-[53px] xl:h-[66px]",
       order: "order-2 sm:order-2", // Mobile: row 1 col 2, SM: row 1 col 2 (top middle)
     },
     {
       src: "assets/Section/Logo_Metagov.png",
       alt: "Metagov",
-      size: "h-6 lg:h-8",
+      size: "h-6 lg:h-8 xl:h-[41px]",
       order: "order-3 sm:order-1", // Mobile: row 2 col 1, SM: row 1 col 1 (top left)
     },
     {
       src: "assets/Section/Logo_OpenCivics.png",
       alt: "Open Civics",
-      size: "h-8 lg:h-10",
+      size: "h-8 lg:h-10 xl:h-[50px]",
       order: "order-4 sm:order-5 md:order-6", // Mobile: row 2 col 2, SM: row 2 col 2, MD: swapped with Mutual Aid CO
     },
     {
       src: "assets/Section/Logo_MutualAidCO.png",
       alt: "Mutual Aid CO",
-      size: "h-11 lg:h-14",
+      size: "h-11 lg:h-14 xl:h-[70px]",
       order: "order-5 sm:order-6 md:order-5", // Mobile: row 3 col 1, SM: row 2 col 3, MD: swapped with OpenCivics
     },
     {
       src: "assets/Section/Logo_CUBoulder.png",
       alt: "CU Boulder",
-      size: "h-10 lg:h-12",
+      size: "h-10 lg:h-12 xl:h-[60px]",
       order: "order-6 sm:order-3", // Mobile: row 3 col 2, SM: row 1 col 3 (top right)
     },
   ];
@@ -44,10 +44,10 @@ const LogoWall = ({ logos = [] }) => {
   const displayLogos = logos.length > 0 ? logos : defaultLogos;
 
   return (
-    <section className="p-[var(--spacing-scale-032)] md:px-[var(--spacing-scale-024)] md:py-[var(--spacing-scale-032)] lg:px-[var(--spacing-scale-064)] lg:py-[var(--spacing-scale-048)]">
-      <div className="flex flex-col gap-[var(--spacing-scale-032)] md:gap-[var(--spacing-scale-024)]">
+    <section className="p-[var(--spacing-scale-032)] md:px-[var(--spacing-scale-024)] md:py-[var(--spacing-scale-032)] lg:px-[var(--spacing-scale-064)] lg:py-[var(--spacing-scale-048)] xl:px-[160px] xl:py-[var(--spacing-scale-064)]">
+      <div className="flex flex-col gap-[var(--spacing-scale-032)] md:gap-[var(--spacing-scale-024)] xlg:gap-[var(--spacing-scale-032)]">
         {/* Label */}
-        <p className="font-inter font-medium text-[10px] leading-[12px] uppercase text-[var(--color-content-default-secondary)] text-center">
+        <p className="font-inter font-medium text-[10px] leading-[12px] xl:text-[14px] xl:leading-[12px] uppercase text-[var(--color-content-default-secondary)] text-center">
           Trusted by leading cooperators
         </p>