refactor: standardize background color to #121212

- Replaced inconsistent gray-900 and #171717 background colors with unified #121212 across all pages
- Removed unused imports from multiple component files
- Cleaned up trailing spaces in className attributes

src/pages/network/About.tsx

@@ -6,7 +6,7 @@ export function About() {
   return (
     <section
       id="about"
-      className="relative overflow-hidden bg-gray-900 py-20 lg:py-32 lg:top-0 top-0"
+      className="relative overflow-hidden bg-[#121212]  py-20 lg:py-32 lg:top-0 top-0"
     >
       <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
         <CircleBackground color="#06b6d4" className="animate-spin-slower" />

src/pages/network/Features.tsx

@@ -3,7 +3,7 @@ import MessageBus from './animations/MessageBus'
 import ProxyDetection from './animations/ProxyDetection'
 import ProxyForwarding from './animations/ProxyForwarding'
 import ContentDistribution from './animations/ContentDistribution'
-import { H2, P, H3, CT, CP, Eyebrow } from '@/components/Texts'
+import { P, H3, Eyebrow } from '@/components/Texts'
 
 export function Features() {
   return (

src/pages/network/Hero.tsx

@@ -2,7 +2,7 @@ import { useId } from 'react'
 import { Container } from '@/components/Container'
 import { Button } from '@/components/Button'
 import phoneFrame from '../../images/phoneframe.png'
-import { H3, Eyebrow, P, CT, CP } from "@/components/Texts";
+import { H3, P, CT } from "@/components/Texts";
 
 function BackgroundIllustration(props: React.ComponentPropsWithoutRef<'div'>) {
   let id = useId()

src/pages/network/NetworkUsecases.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useRef } from "react";
-import { Eyebrow, SectionHeader, P, CT, CP } from "@/components/Texts";
+import { Eyebrow, SectionHeader, P } from "@/components/Texts";
 import { IoArrowBackOutline, IoArrowForwardOutline } from "react-icons/io5";
 import {
   LockClosedIcon,
@@ -100,20 +100,22 @@ export function NetworkUsecases() {
               ) : (
                 <>
                   {/* ✅ Icon above title */}
-                  <div className="h-10 w-10 flex items-center justify-center rounded-xl bg-gray-100 mb-4">
-                    <item.icon className="h-6 w-6 text-cyan-600" />
-                  </div>
+                                    {item.icon && (
+                    <div className="h-10 w-10 flex items-center justify-center rounded-xl bg-gray-100 mb-4">
+                      <item.icon className="h-6 w-6 text-cyan-600" />
+                    </div>
+                  )}
 
-                  <CT className="text-lg font-semibold text-gray-900">
+                                    <p className="text-lg font-semibold text-gray-900">
                     {item.title}
-                  </CT>
+                  </p>
 
-                  <CP className="mt-2 text-gray-600 leading-snug">
+                                    <p className="mt-2 text-gray-600 leading-snug">
                     {item.description}
-                  </CP>
-                  <CP className="mt-3 text-xs font-medium text-cyan-700">
+                  </p>
+                                    <p className="mt-3 text-xs font-medium text-cyan-700">
                     {item.ideal}
-                  </CP>
+                  </p>
                 </>
               )}
             </li>