six bug

blocks/feature39.tsx

@@ -33,21 +33,30 @@ interface Feature39Props {
 
 const Feature39 = ({ className }: Feature39Props) => {
   return (
-    <section dir="rtl" lang="fa" className={cn("py-32", className)}>
-      <div className="container">
-        <h2 className="mb-9 text-3xl font-semibold lg:mb-14 lg:text-xl">
+    <section
+      dir="rtl"
+      lang="fa"
+      className={cn(
+        "relative w-full max-w-full overflow-hidden py-32",
+        className,
+      )}
+    >
+      <div className="container min-w-0 max-w-full">
+        <h2 className="mb-9 max-w-full text-3xl font-semibold text-balance break-words lg:mb-14 lg:text-xl">
           کمپین‌هایی بسازید که واقعاً تبدیل می‌شوند
         </h2>
-        <div className="grid gap-10 md:grid-cols-2 lg:grid-cols-3 lg:gap-6">
+        <div className="grid min-w-0 gap-10 md:grid-cols-2 lg:grid-cols-3 lg:gap-6">
           {features.map((feature) => (
-            <div key={feature.title}>
+            <div key={feature.title} className="min-w-0 max-w-full">
               <img
                 src={feature.image}
                 alt={feature.imageAlt}
-                className="aspect-video max-h-96 w-full rounded-lg object-cover"
+                className="aspect-video max-h-96 w-full max-w-full rounded-lg object-cover"
               />
-              <p className="mt-8 mb-2 text-lg font-semibold">{feature.title}</p>
-              <p className="mb-4 text-muted-foreground">
+              <p className="mt-8 mb-2 text-lg font-semibold break-words">
+                {feature.title}
+              </p>
+              <p className="mb-4 text-pretty break-words text-muted-foreground">
                 {feature.description}
               </p>
               <a href={feature.href} className="font-medium underline">