From dbe3bd422ed3a0b6bdb8a457cad32d8f990249e5 Mon Sep 17 00:00:00 2001
From: akash <akash@metatroncube.com>
Date: Thu, 22 Jan 2026 19:33:08 +0530
Subject: [PATCH] Google Review Branding updated

---
 pages/about.js                            |  2 +
 src/components/GoogleReviewsBranding.js   | 56 +++++++++++++++++++++++
 src/components/Home/TestimonialSection.js |  4 +-
 3 files changed, 61 insertions(+), 1 deletion(-)
 create mode 100644 src/components/GoogleReviewsBranding.js

diff --git a/pages/about.js b/pages/about.js
index c1be0f6..c6f54e6 100644
--- a/pages/about.js
+++ b/pages/about.js
@@ -11,6 +11,7 @@ import { useEffect, useState } from "react";
 import { brandListProps2 } from "@/src/sliderProps";
 import SubCard from "@/src/components/AboveFooter";
 import ConsenHead from "@/src/ConsenHead";
+import GoogleReviewsBranding from "@/src/components/GoogleReviewsBranding";
 
 const About = () => {
     const [reviews, setReviews] = useState([]);
@@ -407,6 +408,7 @@ const About = () => {
                                     <h5 className="text-primary">Our Testimonials</h5>
                                     <h2>What Our Customers are  </h2>
                                     <h2>Talking<span> About us.</span> </h2>
+                                    <GoogleReviewsBranding centered={true} />
                                 </div>
                             </div>
                         </div>
diff --git a/src/components/GoogleReviewsBranding.js b/src/components/GoogleReviewsBranding.js
new file mode 100644
index 0000000..81b49d6
--- /dev/null
+++ b/src/components/GoogleReviewsBranding.js
@@ -0,0 +1,56 @@
+import React from 'react';
+
+const GoogleReviewsBranding = ({ centered = false }) => {
+    return (
+        <div className="google-reviews-branding" style={{
+            marginTop: '15px',
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: centered ? 'center' : 'flex-start',
+            gap: '0px'
+        }}>
+            <div style={{
+                fontSize: '28px',
+                fontWeight: '700',
+                lineHeight: '1.2',
+                letterSpacing: '3px',
+                fontFamily: '"Product Sans", "Google Sans", Roboto, Arial, sans-serif',
+                display: 'flex',
+                alignItems: 'center'
+            }}>
+                <span style={{ color: '#4285F4' }}>G</span>
+                <span style={{ color: '#EA4335' }}>o</span>
+                <span style={{ color: '#FBBC04' }}>o</span>
+                <span style={{ color: '#4285F4' }}>g</span>
+                <span style={{ color: '#34A853' }}>l</span>
+                <span style={{ color: '#EA4335' }}>e</span>
+            </div>
+            <div style={{
+                fontSize: '13px',
+                fontWeight: '700',
+                lineHeight: '1.2',
+                fontFamily: '"Product Sans", "Google Sans", Roboto, Arial, sans-serif',
+                display: 'flex',
+                alignItems: 'center',
+                gap: '5px',
+                marginTop: '-2px'
+            }}>
+                <span style={{ color: '#5F6368' }}>Reviews</span>
+                <div style={{
+                    display: 'flex',
+                    gap: '1px',
+                    fontSize: '13px',
+                    lineHeight: '1'
+                }}>
+                    <span style={{ color: '#FBBC04' }}>★</span>
+                    <span style={{ color: '#FBBC04' }}>★</span>
+                    <span style={{ color: '#FBBC04' }}>★</span>
+                    <span style={{ color: '#FBBC04' }}>★</span>
+                    <span style={{ color: '#FBBC04' }}>★</span>
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default GoogleReviewsBranding;
diff --git a/src/components/Home/TestimonialSection.js b/src/components/Home/TestimonialSection.js
index eb2e525..e398616 100644
--- a/src/components/Home/TestimonialSection.js
+++ b/src/components/Home/TestimonialSection.js
@@ -4,6 +4,7 @@ import { Swiper, SwiperSlide } from "swiper/react";
 import Link from "next/link";
 import { useEffect, useState } from "react";
 import "swiper/css";
+import GoogleReviewsBranding from "../GoogleReviewsBranding";
 
 const testimonial_list_slider = {
   spaceBetween: 30,
@@ -152,6 +153,7 @@ const TestimonialSection = () => {
                 {" "}
                 Talking <span>About us.</span>
               </h2>
+              <GoogleReviewsBranding />
             </div>
             <div className="row">
               <div className="col-lg-12">
@@ -241,7 +243,7 @@ const TestimonialSection = () => {
                   </Swiper>
                 )}
 
-                <div className="new-button d-flex justify-content-center pt-30">
+                <div className="new-button d-flex justify-content-center pt-30 pb-30">
                   <Link
                     legacyBehavior
                     href="https://www.google.com/maps/place/Metatron+Cube+Software+Solutions/@34.0518468,-56.3267266,3z/data=!4m8!3m7!1s0x89d4d4dc0e01490b:0xf0ca6a97298a109c!8m2!3d34.0518468!4d-56.3267266!9m1!1b1!16s%2Fg%2F11k197xnvf?entry=ttu&g_ep=EgoyMDI1MTAxMy4wIKXMDSoASAFQAw%3D%3D"