From 1fb08e83f2f6eb884e6eb2632ba3384dce7f98c2 Mon Sep 17 00:00:00 2001
From: sasha-astiadi <sasha@incubaid.com>
Date: Mon, 17 Nov 2025 15:51:37 +0100
Subject: [PATCH] refactor: add centered intro sections and update typography
 imports in CloudPros and NetworkPros

- Added Eyebrow, H3, and P imports to CloudPros and NetworkPros
- Replaced raw h3 and p tags with typography components in CloudPros
- Added centered "Why It's Revolutionary" intro section to NetworkPros with eyebrow, heading, and description
- Updated NetworkPros grid with top margin (mt-8) for spacing
- Changed Homepod eyebrow text from "MYCELIUM PODS" to "Mycelium Pods - Coming Soon"
---
 src/pages/cloud/CloudPros.tsx     | 10 +++++-----
 src/pages/network/NetworkPros.tsx | 18 ++++++++++++++++--
 src/pages/pods/Homepod.tsx        |  2 +-
 3 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/src/pages/cloud/CloudPros.tsx b/src/pages/cloud/CloudPros.tsx
index 5b1e40f..9079f2d 100644
--- a/src/pages/cloud/CloudPros.tsx
+++ b/src/pages/cloud/CloudPros.tsx
@@ -1,4 +1,4 @@
-import { Small } from "@/components/Texts";
+import { Eyebrow, H3, P, Small } from "@/components/Texts";
 
 const highlights = [
   {
@@ -41,16 +41,16 @@ export function CloudPros() {
             Agent Advantage
           </Small>
 
-          <h3 className="mt-4 text-2xl lg:text-3xl font-semibold text-black">
+          <H3 className="mt-4  text-black">
             Why It’s Different
-          </h3>
+          </H3>
 
-          <p className="mt-4 text-gray-700 text-base leading-relaxed">
+          <P className="mt-4 text-gray-700  leading-relaxed">
             Most AI systems run on centralized clouds, where the models, data, and
             logic operate behind third-party APIs. Mycelium Agents flip that
             architecture—running entirely inside your environment so control,
             privacy, and autonomy stay with you.
-          </p>
+          </P>
         </div>
 
         {/* Grid */}
diff --git a/src/pages/network/NetworkPros.tsx b/src/pages/network/NetworkPros.tsx
index e20cb9e..f055851 100644
--- a/src/pages/network/NetworkPros.tsx
+++ b/src/pages/network/NetworkPros.tsx
@@ -1,4 +1,4 @@
-import { Small } from '@/components/Texts'
+import { Eyebrow, H3, P, Small } from '@/components/Texts'
 
 const highlights = [
   {
@@ -36,7 +36,21 @@ export function NetworkPros() {
 
       {/* Main framed content */}
       <div className="bg-[#121212] w-full max-w-7xl mx-auto border border-t-0 border-b-0 border-gray-800">
-        <div className="grid lg:grid-cols-4">
+        {/* Centered intro */}
+        <div className="px-6 pt-12 pb-4 text-center max-w-4xl mx-auto ">
+          <Eyebrow className="uppercase tracking-[0.16em] text-cyan-600">
+            WHY
+          </Eyebrow>
+
+          <H3 className="mt-4 text-white">
+            Why It’s Revolutionary
+          </H3>
+
+          <P className="mt-4 text-gray-300 text-base leading-relaxed">
+            Mycelium redefines how digital systems connect, scale, and stay secure in a world moving beyond the limits of traditional cloud
+          </P>
+        </div>
+        <div className="grid lg:grid-cols-4 mt-8">
           {highlights.map((item) => (
             <div
               key={item.title}
diff --git a/src/pages/pods/Homepod.tsx b/src/pages/pods/Homepod.tsx
index d3b0b94..507cbd6 100644
--- a/src/pages/pods/Homepod.tsx
+++ b/src/pages/pods/Homepod.tsx
@@ -16,7 +16,7 @@ export default function Homepod() {
         <div className="px-6 py-16 lg:py-24">
           <div className="max-w-2xl lg:pl-6">
             <Eyebrow>
-              MYCELIUM PODS
+              Mycelium Pods - Coming Soon
             </Eyebrow>
             <H3 className="mt-4">
               Your Private Space in the New Internet