import Abou from "@/src/components/services-details-banner/abou.js";
import Counter from "@/src/components/Counter";
import Faqs from "@/src/components/Faqs";
import LogoSlider from "@/src/components/LogoSlider";
import Layout from "@/src/layout/Layout";
import { testimonial_list_slider } from "@/src/sliderProps";
import Link from "next/link";
import { Nav, Tab } from "react-bootstrap";
import { Swiper, SwiperSlide } from "swiper/react";
import { brandListProps2 } from "@/src/sliderProps";
import SubCard from "@/src/components/AboveFooter";
import ConsenHead from "@/src/ConsenHead";

const About = () => {
    return (
        <>
            <ConsenHead title="About MetatronCube - Web, App & Digital Marketing Experts" description="Discover MetatronCube India - a leading company in web development, mobile apps, SEO, digital marketing, UI/UX, and graphic design." />
            <Layout  header={3} footer={3}>
                <Abou pageName={"ABOUT US"} />
                {/* ========================================================= */}
                {/* Start abouts area  */}
                {/* ========================================================= */}
                <div className="about-area new-style bg-white">
                    <div className="container">
                        <div className="row align-items-center">

                            <div className="col-lg-6 mb-4 mb-lg-0">
                                <div className="about-thumb">
                                    <img src="/assets/images/about/aboutpage.webp" alt="Our story" className="img-fluid" />
                                </div>
                            </div>

                            <div className="col-lg-6">
                                <div className="consen-section-title mb-4">
                                    <div className="consen-section-title">
                                        <h5>About Us</h5>
                                        <h2>Our<span> Story</span></h2>
                                    </div>
                                    <p className="about-text2 pt-3">
                                        Metatron Cube India was founded with a clear mission - to transform ideas into impactful digital solutions. With a passion for technology and innovation, we have been helping businesses achieve growth through <b>website development, mobile app development, SEO, digital marketing, UI/UX, and graphic design services</b>. Over the years, we’ve built a reputation for delivering scalable, creative, and results-driven digital experiences.
                                    </p>
                                </div>

                                <div className="row g-3">
                                    <div className="col-12">
                                        <div className="d-flex align-items-start mb-3">
                                            <img src="/assets/images/about/innovative.webp " alt="icon" className="me-3 pr-3" />
                                            <div>
                                                <h5>Next-Gen Solutions</h5>
                                                <p>We design cutting-edge websites, apps, and digital strategies that not only meet industry standards but also set new benchmarks for quality and performance.</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div className="col-12">
                                        <div className="d-flex align-items-start mb-3">
                                            <img src="/assets/images/about/teamwork.webp" alt="icon" className="me-3 pr-3" />
                                            <div>
                                                <h5>Team-Driven Success</h5>
                                                <p>Our skilled developers, designers, and strategists work as one - combining creativity with technical expertise to deliver projects that exceed expectations.</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div className="col-12">
                                        <div className="d-flex align-items-start mb-3">
                                            <img src="/assets/images/about/future.webp " alt="icon" className="me-3 pr-3" />
                                            <div>
                                                <h5>Future-Focused Vision</h5>
                                                <p>By anticipating market trends and adopting the latest technologies, we ensure your business is always one step ahead in the fast-evolving digital landscape.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>


                            </div>
                        </div>
                    </div>
                </div>

                {/*==================================================*/}
                {/* End abouts Area */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start Brand Area */}
                {/*==================================================*/}
                <div className="about brand-section new-style">
                    <div className="container">
                        <div className="row">
                            <Swiper {...brandListProps2} className="brand-list2 owl-carousel">
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-1.webp" alt="BigCommerce Partner logo, symbolizing a strong e-commerce alliance." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-2.webp" alt="Shopify logo with a green shopping bag icon." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-3.webp" alt="Constant Contact logo with a stylized '@' symbol." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-4.webp" alt="HIKE SEO logo depicting a rising graph within the letter 'K'." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-1.webp" alt="BigCommerce Partner logo, symbolizing a strong e-commerce alliance." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-2.webp" alt="Shopify logo with a green shopping bag icon." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-3.webp" alt="Constant Contact logo with a stylized '@' symbol." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                                <SwiperSlide>
                                    <div className="brand-single-box">
                                        <div className="brand-thumb">
                                            <img src="/assets/images/add/icon-4.webp" alt="HIKE SEO logo depicting a rising graph within the letter 'K'." />
                                        </div>
                                    </div>
                                </SwiperSlide>
                            </Swiper>
                        </div>
                    </div>
                </div>

                {/*==================================================*/}
                {/* End brand Area */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start consen Skill Area Css */}
                {/*==================================================*/}
                <div className="skill-area style-two">
                    <div className="container">
                        <div className="row align-items-center">
                            <div className="col-md-6">
                                <div className="extra-animation-div">
                                    <div className="consen-section-title">
                                        <h5>Discover Our Approach</h5>
                                        <h2>An Agency That</h2>
                                        <h2><span>Turning Your Vision </span>Into Reality</h2>
                                    </div>
                                    <div className="dreamit-smart-title pt-2">
                                        <p className="slill-text-dark">
                                            Every project we take on goes beyond execution - it’s a true collaboration. We’re motivated by your goals, your drive, and your journey, and our role is to strengthen and accelerate it.
                                        </p>
                                        <p>
                                            Whether you’re launching a new idea, expanding an established brand, or reinventing your digital identity, we bring passion, deep expertise, and innovative thinking to every stage. At <b>MetatronCube India</b>, we don’t just deliver solutions - we build lasting partnerships, standing by you as committed allies focused on long-term success.
                                        </p>
                                    </div>
                                </div>
                                <div className="dreamit-icon-box">
                                    <div className="dreamit-icon-list">
                                        <ul>
                                            <li>
                                                <i className="bi bi-arrow-right-circle" />
                                                <span> <b>Rapid development delivery</b> - Agile, dependable, and scalable web & app solutions.</span>
                                            </li>
                                            <li>
                                                <i className="bi bi-arrow-right-circle" />
                                                <span>  <b>High-quality services at fair value</b> - Excellence without unnecessary costs.
</span>
                                            </li>
                                            <li>
                                                <i className="bi bi-arrow-right-circle" />
                                                <span> <b>Proven and reliable team </b>- Experienced professionals dedicated to your growth.
</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>

                            <div className="col-md-6">
                                <div className="slill-single-thumb mt-4 mt-lg-0 pl-50 ml-1">
                                    <img src="/assets/images/about/watch-us-live-section.webp" alt="Agency that gets excited about" />
                                    <div className="skill-thumb-content">
                                        <div className="skill-title">
                                            <h3 className="counter"><Counter end={10} /></h3>
                                            <span>+</span>
                                            <h5>YEARS EXPERIENCE</h5>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {/* <div className="process-shape">
                            <div className="process-shape-thumb bounce-animate2">
                                <img src="assets/images/about/3.webp" alt="" />
                            </div>
                        </div> */}
                        </div>

                    </div>
                </div>

                {/*==================================================*/}
                {/* End consen Skill Area Css */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start consen case study Area */}
                {/*==================================================*/}
                <div className="why-choose-us">
                    <div className="container">
                        <div className="row align-items-center">
                            <div className="col-lg-6">
                                <div className="consen-section-title">
                                    <h5>Partner With Us</h5>
                                    <h2>We Deliver More Than  <span>Just Platforms.</span> </h2>
                                  
                                    <p className="choose-text1">
                                        Appropriately enhance principle-centered innovation rather
                                        than high standards in platforms. Credibly orchestrate functional.
                                    </p>
                                </div>
                            </div>
                            <div className="col-lg-6 col-md-12">
                                <div className="row">
                                    <div className="col-12 pl-10 pr-10 mb-4">
                                        <div className="process-single-box text-white">
                                            <div className="process-title">
                                                <h3>
                                                    Our <span> Mission </span>
                                                </h3>
                                                <p>
                                                    Our mission is to empower businesses with cutting-edge digital solutions that enhance growth, efficiency, and connectivity. By combining creativity with advanced technology, we aim to deliver web and mobile applications that surpass expectations and keep brands future-ready.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div className="col-12 pl-10 pr-10">
                                        <div className="process-single-box upper">
                                            <div className="process-title text-white">
                                                <h3>
                                                    Our <span> Values </span>
                                                </h3>
                                                <p>
                                                    We are driven by trust, innovation, and excellence. Collaboration and teamwork lie at the heart of everything we do. Adaptability, continuous learning, and a customer-first mindset shape our approach, while sustainability and responsibility guide how we create solutions that make a lasting impact.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                {/*==================================================*/}
                {/* End consen case study Area */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start process Area */}
                {/*==================================================*/}
                <div className="process-area two">
                    <div className="container">
                        <div className="row justify-content-center text-center">
                            <div className="col-md-3 col-6 d-flex flex-column align-items-center justify-content-center">
                                <div className="counter-single-box">
                                    <div className="counter-title">
                                        <h4 className="text-dark"><Counter end={100} /></h4>
                                        <span>+</span>
                                        <p className="text-dark">Completed Projects</p>
                                    </div>
                                </div>
                            </div>

                            <div className="col-md-3 col-6 d-flex flex-column align-items-center justify-content-center">
                                <div className="counter-single-box">
                                    <div className="counter-title">
                                        <h4 className="text-dark"><Counter end={50} /></h4>
                                        <span>+</span>
                                        <p className="text-dark">Ongoing Clients</p>
                                    </div>
                                </div>
                            </div>

                            <div className="col-md-3 col-6 d-flex flex-column align-items-center justify-content-center">
                                <div className="counter-single-box">
                                    <div className="counter-title">
                                        <h4 className="text-dark"><Counter end={20} /></h4>
                                        <span>+</span>
                                        <p className="text-dark">Skilled Experts</p>
                                    </div>
                                </div>
                            </div>

                            <div className="col-md-3 col-6 d-flex flex-column align-items-center justify-content-center">
                                <div className="counter-single-box">
                                    <div className="counter-title">
                                        <h4 className="text-dark"><Counter end={50} /></h4>
                                        <span>+</span>
                                        <p className="text-dark">Satisfied Clients</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div className="process-shape">
                            <div className="service-shape">
                                <img src="/assets/images/elements/right-top-element .webp" alt="" />
                            </div>
                        </div>
                    </div>
                </div>

                {/*=================================================*/}
                {/* End Process Area */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start consen Testimonial Area */}
                {/*==================================================*/}
                <div className="testimonial-area new-style">
                    <div className="container">
                        <div className="row justify-content-center text-center">
                            <div className="col-lg-8">
                                <div className="consen-section-title">
                                    <h5 className="text-primary">Our Testimonials</h5>
                                    <h2> Hear From Our <span>Happy Customers</span> </h2>
                                    
                                </div>
                            </div>
                        </div>

                        <Swiper {...testimonial_list_slider} className="testimonial_list owl-carousel mt-4">

                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">Arjun Mehta</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p>
                                               Working with Metatron Cube India was an incredible experience. Their team built a custom mobile app for my startup that exceeded all expectations - it was sleek, fast, and user-friendly. They guided me through every step, explained technical aspects clearly, and ensured the project stayed within budget. Their dedication to quality and customer support was outstanding. I’ve already recommended them to several colleagues, and I will definitely return for future projects
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">BrightMart Retail</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p className="pb-4">
                                                Partnering with Metatron Cube India for our eCommerce website and SEO services completely transformed our business. The website design was professional and intuitive, while their SEO strategies boosted our online visibility within weeks. Our sales have increased, and customer engagement is stronger than ever. The team is responsive, knowledgeable, and always ready to support us with creative solutions. They truly feel like long-term partners, not just a service provider.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">
                                                    Niharika Designs</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p>
                                                 Metatron Cube India helped us revamp our brand identity with exceptional graphic design and UI/UX services. From logo design to website redesign, their creativity and technical expertise stood out. They listened carefully to our ideas, gave thoughtful suggestions, and delivered a final product that perfectly reflects our brand. The new design has received fantastic feedback from our clients and improved our overall user experience. Highly recommended for anyone wanting design excellence!
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">Dine360 Ads</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p>
                                                I had an amazing experience working with Metatrion Cube Solutions! They built a stunning website for my business that not only looks professional but is also fast, responsive, and easy to navigate. The team truly listened to my needs, offered great design ideas, and delivered everything on time. I’ve already received compliments from clients about how sleek and user-friendly the site is. Highly recommend them if you're looking for top-notch web development!
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">Chansa</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p className="pb-4">
                                                Working with Metatron Cube Software Solutions is always a wonderful experience. I say always because I am a repeat client, and would encourage anybody to hire them for your project.
                                                I can’t praise their team enough, they are able to make the daunting process of creating digital solutions easy to understand, and always within budget.
                                                They have made me a very happy, and loyal client.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">
                                                    RentSouth Beach Miami</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p>
                                                Partnering with Metatroncube Software Solutions was a game-changer for our Rent South Beach Miami website. Their expertise in digital marketing, especially SEO and social media, significantly increased our online visibility and customer engagement. As a leading digital marketing agency in Canada, they delivered results beyond our expectations. Highly recommend them for anyone looking to boost their online presence!
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">Dine360 Ads</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p>
                                                I had an amazing experience working with Metatrion Cube Solutions! They built a stunning website for my business that not only looks professional but is also fast, responsive, and easy to navigate. The team truly listened to my needs, offered great design ideas, and delivered everything on time. I’ve already received compliments from clients about how sleek and user-friendly the site is. Highly recommend them if you're looking for top-notch web development!
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">Chansa</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p className="pb-4">
                                                Working with Metatron Cube Software Solutions is always a wonderful experience. I say always because I am a repeat client, and would encourage anybody to hire them for your project.
                                                I can’t praise their team enough, they are able to make the daunting process of creating digital solutions easy to understand, and always within budget.
                                                They have made me a very happy, and loyal client.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                            <SwiperSlide className="pr-1">
                                <div className="testimonial-single-box">
                                    <div className="testimonial-content1">
                                        <div className="single-quote-icon">
                                            {/* <div className="quote-thumb">
                                            <img src="assets/images/about/testimonial/testimonial-2.webp" alt="Smiling men's avatar representing a satisfied client." />
                                        </div> */}
                                            <div className="quote-title">
                                                <h4 className="testimonial-text">
                                                    RentSouth Beach Miami</h4>
                                                <p>Happy Customer</p>
                                            </div>
                                        </div>
                                        <div className="em-testimonial-text">
                                            <p>
                                                Partnering with Metatroncube Software Solutions was a game-changer for our Rent South Beach Miami website. Their expertise in digital marketing, especially SEO and social media, significantly increased our online visibility and customer engagement. As a leading digital marketing agency in Canada, they delivered results beyond our expectations. Highly recommend them for anyone looking to boost their online presence!
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </SwiperSlide>
                        </Swiper>

                        <div className="testi-shape">
                            <div className="testi-shape-thumb">
                                <img src="/assets/images/elements/right-top-element-1.webp" alt="Decorative Shape" />
                            </div>
                        </div>
                    </div>
                </div>

                {/*==================================================*/}
                {/* End consen Testimonial Area */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start consen Call Do Action Area Css */}
                {/*==================================================*/}
                <div className="call-do-action-area">
                    <div className="container">
                        <div className="row justify-content-center text-center">
                            <div className="col-lg-10 col-md-12">
                                <div className="consen-section-title upper mb-4">
                                    <h5 className="text-primary">Ready to Start?</h5>
                                    <h2 className="call-do-action-area-h2">Turn your ideas into reality with us.</h2>
                                </div>
                                <div className="new-button">
                                    <Link legacyBehavior href="/contact">
                                        <a className="btn btn-primary px-4 mt-3">Start Now</a>
                                    </Link>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                {/*==================================================*/}
                {/* End consen Call Do Action Area Css */}
                {/*==================================================*/}
                {/*==================================================*/}
                {/* Start consen Subscribe Area */}
                {/*==================================================*/}
                <div className="sub">
                    <div className="container">
                        <SubCard />
                    </div>
                </div>

                {/*==================================================*/}
                {/* End consen Subscribe Area */}
                {/*==================================================*/}
            </Layout >
        </>
    );
};
export default About;