diff --git a/client/src/pages/recipes.tsx b/client/src/pages/recipes.tsx
index dd8f479..341f344 100644
--- a/client/src/pages/recipes.tsx
+++ b/client/src/pages/recipes.tsx
@@ -261,13 +261,11 @@ function RecipeModal({ recipe, onClose }: { recipe: Recipe; onClose: () => void
           <button onClick={onClose} className="absolute top-3 right-3 bg-black/60 rounded-full p-1.5 text-white hover:bg-black/80" data-testid="button-recipe-modal-close">
             <X className="w-4 h-4" />
           </button>
-          <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-4">
-            <span className="text-[10px] font-medium text-primary bg-primary/20 px-2 py-0.5 rounded">{recipe.category}</span>
-          </div>
         </div>
         <div className="p-5">
           <h2 className="text-xl font-bold text-foreground mb-1">{recipe.title}</h2>
-          <p className="text-sm text-muted-foreground mb-3">{recipe.description}</p>
+          <span className="text-[11px] font-medium text-primary">{recipe.category}</span>
+          <p className="text-sm text-muted-foreground mb-3 mt-1">{recipe.description}</p>
           <div className="flex items-center gap-4 text-sm text-muted-foreground mb-5">
             <span className="flex items-center gap-1"><Clock className="w-4 h-4" />{recipe.time}</span>
             <span className="flex items-center gap-1"><Users className="w-4 h-4" />{recipe.servings}</span>
@@ -336,13 +334,10 @@ export default function RecipesPage() {
                 >
                   <div className="relative overflow-hidden">
                     <img src={recipe.image} alt={recipe.title} className="w-full aspect-video object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" />
-                    <div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent" />
-                    <div className="absolute bottom-2 left-2">
-                      <span className="text-[10px] font-medium text-primary bg-primary/20 px-2 py-0.5 rounded">{recipe.category}</span>
-                    </div>
                   </div>
                   <div className="p-4">
                     <h3 className="font-bold text-card-foreground text-base group-hover:text-primary transition-colors">{recipe.title}</h3>
+                    <span className="text-[10px] font-medium text-primary">{recipe.category}</span>
                     <p className="text-xs text-muted-foreground mt-1 line-clamp-2">{recipe.description}</p>
                     <div className="flex items-center gap-3 mt-3 text-xs text-muted-foreground">
                       <span className="flex items-center gap-1"><Clock className="w-3 h-3" />{recipe.time}</span>