import React from "react";
import Link from "next/link";
import Image from "next/image";
import Heading from "@/components/reuseables/Heading";
import { motion } from "framer-motion";
import { fadeIn } from "@/components/reuseables/variants";
import { Col, Container, Row } from "react-bootstrap";
import { cleanImage } from "@/layout/imageHandling";

const overviewData = [
  {
    id: 1,
    subtitle: "About Us",
    title: "Welcome to Advith Consulting ",
    paragraphs: [
      "Welcome to Advith Consulting, a boutique finance consulting firm with over 40 years of excellence. Our core pillars—Knowledge, People, and Client Servicing—drive our success. We value our team’s unique contributions, fostering a collaborative environment that delivers tailored, innovative solutions. We build strong, lasting client relationships by understanding and exceeding their goals. Our commitment to business ethics and quality work has earned us a reputation for excellence and credibility. United by our values, we continue to deliver exceptional financial consulting services.",
    ],
    linkText: "Know More",
    linkUrl: "/contact",
    imageSrc: "/images/people/welcome_advith.webp",
    imageAlt: "image",
  },
  // Add more objects here if you have more content sections
];

const Overview = ({overview}) => {
  console.log(overview?.Content,"overview")
  return (
    <>
      <div className="what-we-do-area pt-50">
        <Container>
          {/* {overviewData.map((item) => ( */}
            <Row className="align-items-center">
              <Col lg={12} md={12}>
                <div className="what-we-do-text">
                  <span className="sub-title">{overview?.Subtitle}</span>
                  <Heading el="h2" heading={overview?.Title} className="h2" />
                   <div
                    className="Content"
                    dangerouslySetInnerHTML={{ __html: overview?.Content }}
                  />
                    {/* <p className="mb-3">{overview.Description}</p> */}
               
                  <Link href={overview?.CTA?.URL ? overview?.CTA?.URL : "#"} className="default-btn">
                  {overview?.CTA?.text }<i className="ri-arrow-right-line"></i>
                  </Link>
                </div>
              </Col>

             
            </Row>
          {/* ))} */}
        </Container>
      </div>
    </>
  );
};

export default Overview;