import Card from "./ServiceCard";
import EnvisionImg from "../../assets/imgs/Envision.jpg";
import CaptureImg from "../../assets/imgs/Capture.png";
import EditImg from "../../assets/imgs/Edit.png";
import PublishImg from "../../assets/imgs/Publish.jpg";

const CameraCards = () => {
  return (
    <div className="h-full flex lg:mt-20 flex-col flex-wrap gap-4 xl:flex-row mx-4">
      <Card title="Envision" description="Prespective" imgSrc={EnvisionImg} />
      <Card title="Capture" description="Moments" imgSrc={CaptureImg} />
      <Card title="Edit" description="Moments" imgSrc={EditImg} />
      <Card title="Publish" description="Content" imgSrc={PublishImg} />
    </div>
  );
};

export default CameraCards;
