diff --git a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts
index 9ac46497..a11b2c5b 100644
--- a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts
+++ b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.theme.ts
@@ -47,6 +47,7 @@ export const projectCardTheme = tv({
       'items-center',
       'gap-2',
     ],
+    wavyBorder: ['bg-surface-card', 'group-hover:bg-surface-card-hovered'],
   },
   variants: {
     status: {
diff --git a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx
index 5acbf2bc..64d716d5 100644
--- a/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx
+++ b/packages/frontend/src/components/projects/ProjectCard/ProjectCard.tsx
@@ -100,10 +100,7 @@ export const ProjectCard = ({
         </div>
       </div>
       {/* Wave */}
-      <WavyBorder
-        variant="stroke-and-fill"
-        className="bg-surface-card group-hover:bg-surface-card-hovered"
-      />
+      <WavyBorder variant="stroke-and-fill" className={theme.wavyBorder()} />
       {/* Lower content */}
       <div className={theme.lowerContent()}>
         {/* Latest deployment */}