From 9df702eaaf005334af477b272eab28d3b7baddf2 Mon Sep 17 00:00:00 2001
From: Joyce <26967919+Joyce-O@users.noreply.github.com>
Date: Fri, 10 Apr 2026 10:40:59 -0400
Subject: [PATCH] import brand images

---
 components/design-system/component-matrix.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/components/design-system/component-matrix.tsx b/components/design-system/component-matrix.tsx
index b6cc41d..629233d 100644
--- a/components/design-system/component-matrix.tsx
+++ b/components/design-system/component-matrix.tsx
@@ -108,18 +108,18 @@ export function ComponentMatrix() {
           </h4>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
             {/* Modular Geometry Showcase */}
-            <div className="border-institutional border-border rounded-sm p-8 bg-card institutional-accent overflow-hidden relative min-h-[300px] flex flex-col justify-end">
-              <div className="absolute top-0 right-0 w-1/2 h-full opacity-40">
+            <div className="border-institutional border-border rounded-sm p-10 bg-[#F9F9F7] institutional-accent overflow-hidden relative min-h-[350px] flex flex-col justify-end">
+              <div className="absolute top-4 right-4 bottom-4 w-1/2 opacity-80">
                 <img 
                   src="/brand/modular-geometry.png" 
                   alt="Modular Geometry" 
                   className="object-contain object-right h-full w-full"
                 />
               </div>
-              <div className="relative z-10 space-y-2">
-                <Badge className="bg-brand-orange text-white border-0">Modular System</Badge>
-                <h3 className="text-display text-4xl leading-none">Modular<br />Core</h3>
-                <p className="text-sm text-muted-foreground max-w-[200px]">
+              <div className="relative z-10 space-y-4">
+                <Badge className="bg-brand-orange text-white border-0 rounded-none text-[10px] uppercase tracking-widest px-2 py-0.5">Structural</Badge>
+                <h3 className="text-display text-5xl leading-[0.9] text-brand-offblack">Modular<br />Core</h3>
+                <p className="text-sm text-brand-grey7 max-w-[220px] font-sans">
                   Leveraging architectural logic through 3D modular geometry.
                 </p>
               </div>