import Counter from "@/src/components/Counter";
import Careerss from "@/src/components/services-details-banner/careerss.js";
import ProssessBar from "@/src/components/ProssessBar";
import Layout from "@/src/layout/Layout";
import { brandListProps, caseStudyProps } from "@/src/sliderProps";
import dynamic from "next/dynamic";
import SubCard from "@/src/components/AboveFooter";
import ConsenHead from "@/src/ConsenHead";

const CaseStudies = dynamic(() => import("@/src/components/isotope/CarrerCase-study"), {
  ssr: false,
});

const Careers = () => {
  return (
    <>
     <ConsenHead title="Careers at MetatronCube India - Web, App & Digital Jobs" description="Join MetatronCube India for careers in website development, mobile apps, SEO, digital marketing, UI/UX, and graphic design." />
      <Layout footer={1}>
        {/* Breadcrumb */}
        <Careerss pageName={"CAREERS"} />

        {/* Section: Welcome */}
        <div className="ceo-cod pb-90 pt-90">
          <div className="container">
            <div className="row align-items-center">
              {/* Text Section */}
              <div className="col-lg-6 col-md-12 mb-4 mb-lg-0 pl-50">
                <div>
                  <div className="consen-section-title">
                    <h5>Welcome To Your Career Growth Journey</h5>
                  </div>
                  <div className="consen-section-title">
                    <h2>Why Join <span>Metatron Cube India?</span></h2>
                  </div>

                  <h6>
                    Be part of a team where innovation, growth, and collaboration come together.
                  </h6>
                  <div className="lines style-three pt-3 pb-2">
                    <div className="line" />
                  </div>
                  <p className="about-text2">
                    At Metatron Cube India, we don’t just build digital solutions - we create possibilities. With expertise in website development, mobile app development, SEO, digital marketing, and design, our mission is to simplify challenges and deliver solutions that inspire success.
                  </p>

                  <p className="about-text2">
                    We believe in a culture where every idea is valued, and every voice is heard. Whether you’re a developer, designer, strategist, or creative thinker, this is the place to learn, grow, and make a lasting impact. Together, we shape the future of digital innovation.
                  </p>


                </div>
              </div>




              {/* Image Section */}
              <div className="col-lg-6 col-md-12 text-center  pl-50">
                <img src="/assets/images/careers/why-join-us.webp" alt="Why join metatroncube software solutions" className="img-fluid mb-3" />

                <div className="about-shape-thumb bounce-animate">
                  <img src="/assets/images/careers/why-join-us-front.webp" alt="Welcome to your next big opportunity" className="img-fluid" />

                </div>
              </div>
            </div>
          </div>
          <div className="position-relative">

            <img
              src="/assets/images/about/3.webp"
              alt="Shape 2"
              className="img-fluid position-absolute top-0 end-0 bounce-animate2"
            />
          </div>
        </div>

        {/* Section: What We Offer */}
        <div className="process-area color-bg pb-90 pt-90">
          <div className="container">
            <div className="row align-items-center">

              {/* Image - order for responsive change */}
              <div className="col-lg-6 mb-4 mb-lg-0 order-1 order-lg-0">
                <img src="/assets/images/careers/benefits.webp" alt="What we offer" className="img-fluid" />
              </div>

              {/* Text - order for responsive change */}
              <div className="col-lg-6 pb-90 pt-90 pl-50 order-0 order-lg-1">
                <div className="consen-section-title">
                  <h5>Benefits That Matter</h5>
                </div>
                <div className="consen-section-title">
                  <h2> What You’ll<span> Get</span></h2>
                </div>
                <p className="pt-3">
                  <strong>
                    From professional growth to personal well-being, Metatron Cube India is where ambition meets opportunity.
                  </strong>
                </p>
                <div className="service-details-icon-box">
                  <div className="widget-service-details-icon">
                    <ul className="list-unstyled">
                      <li className="mb-3 d-flex">
                        <i className="bi bi-arrow-right-circle mr-2 me-2" />
                        <span><strong>Innovative Projects:</strong> Work on advanced web, mobile, and digital solutions that spark creativity and push boundaries.</span>
                      </li>
                      <li className="mb-3 d-flex">
                        <i className="bi bi-arrow-right-circle mr-2 me-2" />
                        <span><strong>Global Collaboration:</strong> Partner with international clients and diverse teams to gain worldwide exposure.</span>
                      </li>
                      <li className="mb-3 d-flex">
                        <i className="bi bi-arrow-right-circle mr-2 me-2" />
                        <span><strong>Career Development:</strong> Grow your expertise with structured training, mentorship programs, and certifications.</span>
                      </li>
                      <li className="mb-3 d-flex">
                        <i className="bi bi-arrow-right-circle mr-2 me-2" />
                        <span><strong>Inclusive Environment:</strong> Join a workplace built on diversity, respect, and equal opportunities for everyone.</span>
                      </li>
                      <li className="mb-3 d-flex">
                        <i className="bi bi-arrow-right-circle mr-2 me-2" />
                        <span><strong>People-First Culture:</strong> Enjoy flexible work models, wellness initiatives, and a healthy work-life balance.</span>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>

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


        {/* Section: Our Vision */}
        <div className="style-two pt-90 pb-90">
          <div className="container">
            <div className="row align-items-center">
              {/* Text */}
              <div className="col-lg-7 col-md-6 mb-4 mb-lg-0">
                <div className="consen-section-title">
                  <h5>Inspired by Innovation, Driven by Impact</h5>
                </div>
                <div className="consen-section-title">
                  <h2>Our<span> Vision</span></h2>
                </div>
                <p>
                  <strong>
                   Be part of a mission to redefine digital possibilities and create lasting change.
                  </strong>
                </p>
                <p>
                 At Metatron Cube India, we see technology as a catalyst to unlock opportunities, empower businesses, and improve everyday experiences. Our vision is to craft intelligent, scalable, and user-focused solutions that make a real difference.
                </p>
                <p>
                 If you’re looking for a place to grow, collaborate, and contribute to shaping the digital future, we’d love to welcome you to our journey.
                </p>
              </div>

              {/* Image */}
              <div className="col-lg-5 col-md-6 text-center pl-50">
                <img
                  src="/assets/images/careers/guided.webp"
                  alt="Our vision"
                  className="img-fluid"
                />
              </div>
            </div>
          </div>
        </div>

        {/* Section: Case Studies */}

        <div className="case-study-area style-three color-bg">
          <div className="container">
            <CaseStudies />
          </div>
        </div>

        <div className="sub color-bg">
          <div className="container">
            <SubCard />
          </div>
        </div>

      </Layout>
    </>
  );
};

export default Careers;