ok

src/components/UseCases.tsx

@@ -15,6 +15,7 @@ import {
 } from '@heroicons/react/24/solid'
 
 import { Container } from '@/components/Container'
+import { H2, P } from '@/components/Texts'
 
 interface Review {
   title: string
@@ -175,7 +176,7 @@ function ReviewGrid() {
   return (
     <div
       ref={containerRef}
-      className="relative -mx-4 mt-16 grid h-196 max-h-[150vh] grid-cols-1 items-start gap-8 overflow-hidden px-4 sm:mt-20 md:grid-cols-2 lg:grid-cols-3"
+      className="relative -mx-4 mt-0 grid h-196 max-h-[150vh] grid-cols-1 items-start gap-8 overflow-hidden px-4 sm:mt-20 md:grid-cols-2 lg:grid-cols-3"
     >
       {isInView && (
         <>
@@ -220,15 +221,15 @@ export function UseCases() {
     >
       <Container className=''>
         <div className="mx-auto max-w-2xl  lg:max-w-5xl">
-          <h2
-            id="usecases-title"
-            className="text-3xl font-medium tracking-tight text-gray-900 sm:text-center"
+          <H2
+            id="usecases-title" 
+            color="custom"
           >
             Coming Soon: The Future of Mycelium
-          </h2>
-          <p className="mt-6 text-lg text-gray-600 sm:text-center">
+          </H2>
+          <P className="mt-6 text-center" color="custom">
           Mycelium Cloud is evolving to bring even more powerful decentralized features, designed to enhance your experience and expand possibilities. Be the first to explore what's coming next by staying connected with our latest updates.
-          </p>
+          </P>
         </div>
         <ReviewGrid />
       </Container>