import React from "react";
import SectionTitle from "@/components/common/SectionTitle";

const ChooseSection = () => (
    <section className="choose-3-section p-relative section-space" style={{ backgroundImage: "url(/assets/images/services/bg-1.webp)" }}>
        <div className="shape-1" style={{ backgroundImage: "url(/assets/images/services/choose/element-1.webp)", opacity: 0.1 }}></div>
        <div className="small-container">
            <div className="row">
                <div className="col-xxl-6 col-xl-6 col-lg-6">
                    <div className="choose-3-image-area p-relative">
                        <div className="shape-1" style={{ backgroundImage: "url(/assets/images/services/choose/element-2.webp)" }}></div>
                        <figure className="image w-img">
                            <img loading="lazy" src="/assets/images/services/choose/grid.webp" alt="Crafting tailored digital solutions for every need" />
                        </figure>
                        {/* <div className="image-3-area">
                            <div className="image-3 p-relative">
                                <img loading="lazy" src="/assets/imgs/about/about-2.jpg" alt="" />
                                <div className="play-btn">
                                    <div className="video_player_btn">
                                        <a href="https://www.youtube.com/watch?v=eEzD-Y97ges" className="popup-video"><i className="fa-solid fa-play"></i></a>
                                    </div>
                                </div>
                            </div>
                        </div> */}
                        <h1>Metatron</h1>
                    </div>
                </div>
                <div className="col-xxl-6 col-xl-6 col-lg-6">
                    <div className="choose-3-content-area pl-60 pt-20 p-relative">
                        <SectionTitle
                            tagline="Our Services"
                            title="Crafting Tailored Digital Solutions for Every Need"
                            className="wow fadeInLeft"
                        />
                        <p>At Metatroncube, we blend innovation with expertise to shape bespoke digital solutions. Furthermore, our services range from cutting-edge web & app development, leveraging technologies like HTML, CSS, Node.js, and Angular, to strategic SEO and impactful digital marketing. Additionally, in creative graphic design, we meticulously craft each project to meet your unique business objectives. Moreover, in the realm of mobile app development, we utilize platforms such as Flutter, Android, and Swift to deliver exceptional user experiences. Consequently, we’re not just developers and designers; we’re architects of your digital success.</p>
                        {/* <div className="row g-4 pt-35">
                            {[
                                { icon: "fa-solid fa-microchip", label: "Quality Materials", isIcon: true },
                                { icon: "icon-8.png", label: "Best Services", isIcon: false },
                                { icon: "fa-solid fa-headset", label: "24/7 Call Support", isIcon: true },
                                { icon: "fa-solid fa-award", label: "Award Winning", isIcon: true }
                            ].map((item, i) => (
                                <div key={i} className="col-lg-6">
                                    <div className="icon-box-area">
                                        <div className="icon-box">
                                            {item.isIcon ? <i className={item.icon}></i> : <img loading="lazy" src={`/assets/imgs/icon/${item.icon}`} alt="img" />}
                                        </div>
                                        <h5><a href="#">{item.label}</a></h5>
                                    </div>
                                </div>
                            ))}
                        </div> */}
                    </div>
                </div>
            </div>
        </div>
    </section>
);

export default ChooseSection;