From 8a341c436135ebc936d78bb54567cb9be41eb8c1 Mon Sep 17 00:00:00 2001
From: Aditya Singh <148507838+singh-odyssey@users.noreply.github.com>
Date: Tue, 26 Aug 2025 07:18:55 +0000
Subject: [PATCH] Fix sibling expansion in FAQ

---
 src/components/faqs/faqs.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/faqs/faqs.tsx b/src/components/faqs/faqs.tsx
index 735cbcfb..2942c6ff 100644
--- a/src/components/faqs/faqs.tsx
+++ b/src/components/faqs/faqs.tsx
@@ -79,12 +79,12 @@ const FAQs: React.FC = () => {
               </p>
             </div>
 
-            {/* Accordion Grid */}
-            <div className="grid grid-cols-1 md:grid-cols-2 gap-4 auto-rows-auto">
+    {/* Accordion Masonry Columns to prevent sibling expansion */}
+    <div className="columns-1 md:columns-2 md:gap-x-6">
               {faqData.map((faq, index) => (
                 <motion.div
                   key={index}
-                  className="accordion h-fit border-gray-200 dark:border-gray-700 pb-4"
+      className="accordion h-fit border-gray-200 dark:border-gray-700 pb-4 mb-4 break-inside-avoid"
                   initial={{ opacity: 0, y: 10 }}
                   animate={{ opacity: 1, y: 0 }}
                   transition={{ duration: 0.3 }}