feat: add consistent border styling and improve layout spacing

- Applied border-gray-200 borders to main sections for visual consistency
- Restructured HomeTab component with full-width card grid layout
- Refined spacing and padding across hero, benefits, and hosting sections

src/pages/home/HomeHosting.tsx

@@ -1,7 +1,9 @@
+"use client";
+
 import { Container } from '../../components/Container'
 import { Eyebrow, H3, P } from '../../components/Texts'
 
-/* ✅ Custom Icons */
+/* ✅ Custom Icons (unchanged) */
 
 function KubernetesIcon(props: React.ComponentPropsWithoutRef<'svg'>) {
   return (
@@ -106,11 +108,7 @@ const features = [
 
 export function HomeHosting() {
   return (
-    <section
-      id="comingsoon"
-      aria-label="Features"
-      className="py-20 sm:py-32"
-    >
+    <section className="mx-4 py-12 border-t-0 lg:mx-auto max-w-7xl border border-gray-200 lg:py-24">
       <Container>
         <div className="mx-auto max-w-4xl sm:text-center">
           <Eyebrow className="text-cyan-500">IN ACTIVE EVOLUTION</Eyebrow>
@@ -126,18 +124,18 @@ export function HomeHosting() {
 
         <ul
           role="list"
-          className="mx-auto mt-16 grid max-w-2xl grid-cols-1 gap-6 text-sm 
-                     sm:mt-20 sm:grid-cols-2 md:gap-y-10 lg:max-w-none lg:grid-cols-4"
+          className="mx-auto grid max-w-2xl grid-cols-1 gap-6 text-sm 
+                     lg:mt-12 sm:grid-cols-2 md:gap-y-10 lg:max-w-none lg:grid-cols-4"
         >
           {features.map((feature) => (
             <li
               key={feature.name}
-              className="rounded-2xl border border-gray-200 p-8 transition-all duration-300 ease-in-out
+              className="rounded-md border border-gray-200 p-6 transition-all duration-300 ease-in-out
                          hover:scale-105 hover:border-cyan-500 hover:shadow-lg hover:shadow-cyan-500/20 bg-white"
             >
               <feature.icon className="h-14 w-14" />
-              <h3 className="mt-6 font-semibold text-gray-900">{feature.name}</h3>
-              <p className="mt-2 text-gray-700">{feature.description}</p>
+              <h3 className="mt-4 font-semibold text-gray-900">{feature.name}</h3>
+              <p className="mt-2 text-gray-700 leading-snug">{feature.description}</p>
             </li>
           ))}
         </ul>