ok

src/components/UseCases.tsx

@@ -15,7 +15,7 @@ import {
 } from '@heroicons/react/24/solid'
 
 import { Container } from '@/components/Container'
-import { H2, P } from '@/components/Texts'
+import { H2, P, CT, CP } from '@/components/Texts'
 
 interface Review {
   title: string
@@ -93,11 +93,11 @@ function Review({
       {...props}
     >
       <blockquote className="text-gray-900">
-        {React.createElement(getReviewIcon(title), { className: "h-6 w-6 text-gray-700 mb-2" })}
-        <p className="mt-4 text-lg/6 font-semibold">
+        {React.createElement(getReviewIcon(title), { className: "h-6 w-6 text-[#2F3178] mb-2" })}
+        <CT as="h3" color="primary" className="mt-4 text-lg/6 font-semibold">
           {title}
-        </p>
-        <p className="mt-3 text-sm text-gray-600">{body}</p>
+        </CT>
+        <CP color="custom" className="mt-3 text-sm">{body}</CP>
       </blockquote>
 
     </figure>
@@ -217,13 +217,14 @@ export function UseCases() {
     <section
       id="usecases"
       aria-labelledby="usecases-title"
-      className="pt-20 pb-16 sm:pt-32 sm:pb-24"
+      className="py-12"
     >
       <Container className=''>
         <div className="mx-auto max-w-2xl  lg:max-w-5xl">
           <H2
             id="usecases-title" 
-            color="custom"
+            color="primary"
+            className="text-center"
           >
             Coming Soon: The Future of Mycelium
           </H2>