Enhance responsive layout for homepage sections

- Updated `DemoSection`, `PhilosophySection`, `FeatureCard`, and `TechStackSection` to ensure proper alignment and height consistency.
- Added `h-full` and `flex` utility classes for better flexbox behavior and layout responsiveness.
- Improved text and description alignment within cards by introducing `flex-1`.

frontend/src/components/home/DemoSection.tsx

@@ -62,7 +62,7 @@ export function DemoSection() {
         {demos.map((demo, index) => (
           <motion.div
             key={demo.title}
-            className="rounded-lg border bg-card p-6 hover:shadow-lg transition-shadow"
+            className="h-full flex flex-col rounded-lg border bg-card p-6 hover:shadow-lg transition-shadow"
             initial={{ opacity: 0, y: 20 }}
             whileInView={{ opacity: 1, y: 0 }}
             viewport={{ once: true, margin: '-100px' }}
@@ -75,7 +75,7 @@ export function DemoSection() {
             </div>
 
             <h3 className="text-xl font-semibold mb-2">{demo.title}</h3>
-            <p className="text-muted-foreground mb-4 leading-relaxed">
+            <p className="text-muted-foreground mb-4 leading-relaxed flex-1">
               {demo.description}
             </p>
 

frontend/src/components/home/FeatureCard.tsx

@@ -28,7 +28,7 @@ export function FeatureCard({
 }: FeatureCardProps) {
   return (
     <motion.div
-      className="group relative rounded-lg border bg-card p-6 hover:shadow-lg transition-all"
+      className="group relative h-full flex flex-col rounded-lg border bg-card p-6 hover:shadow-lg transition-all"
       whileHover={{ y: -4 }}
       transition={{ duration: 0.2 }}
     >
@@ -48,7 +48,7 @@ export function FeatureCard({
       </div>
 
       {/* Description */}
-      <p className="text-muted-foreground mb-4 leading-relaxed">{description}</p>
+      <p className="text-muted-foreground mb-4 leading-relaxed flex-1">{description}</p>
 
       {/* CTA Link */}
       <Link

frontend/src/components/home/PhilosophySection.tsx

@@ -55,7 +55,7 @@ export function PhilosophySection() {
         <div className="grid md:grid-cols-2 gap-8 mt-12">
           {/* What You Won't Find */}
           <motion.div
-            className="rounded-lg border bg-card p-6"
+            className="h-full rounded-lg border bg-card p-6"
             initial={{ opacity: 0, x: -20 }}
             whileInView={{ opacity: 1, x: 0 }}
             viewport={{ once: true, margin: '-100px' }}
@@ -77,7 +77,7 @@ export function PhilosophySection() {
 
           {/* What You Will Find */}
           <motion.div
-            className="rounded-lg border bg-card p-6"
+            className="h-full rounded-lg border bg-card p-6"
             initial={{ opacity: 0, x: 20 }}
             whileInView={{ opacity: 1, x: 0 }}
             viewport={{ once: true, margin: '-100px' }}

frontend/src/components/home/TechStackSection.tsx

@@ -78,14 +78,14 @@ export function TechStackSection() {
         {technologies.map((tech, index) => (
           <motion.div
             key={tech.name}
-            className="group relative"
+            className="group relative h-full"
             initial={{ opacity: 0, y: 20 }}
             whileInView={{ opacity: 1, y: 0 }}
             viewport={{ once: true, margin: '-100px' }}
             transition={{ duration: 0.4, delay: index * 0.05 }}
             whileHover={{ scale: 1.05 }}
           >
-            <div className="rounded-lg border bg-card p-6 text-center hover:shadow-lg transition-all">
+            <div className="h-full flex flex-col items-center justify-center rounded-lg border bg-card p-6 text-center hover:shadow-lg transition-all">
               {/* Tech Badge */}
               <div className={`inline-block rounded-full bg-gradient-to-r ${tech.color} px-4 py-2 text-white font-semibold text-sm mb-2`}>
                 {tech.name}