import { Button } from "@/components/ui/buttons/Button";
import { CustomCard } from "@/components/ui/cards";
import { H3, P, } from "@/components/ui/typography";
import { useTranslations } from "next-intl";
import React from "react";
import image from "../../../../../assets/svg/WhyPresentationImage.webp"
import Link from "next/link";
const WhyPresentation2 = () => {
    const t = useTranslations()
    return (
<section
            className="relative flex flex-col justify-between items-start bg-white rounded-md w-full"
            style={{ backgroundImage: `url(${image.src})`, backgroundSize: 'cover', backgroundPosition: 'center' }}
        >
            
            <CustomCard className=" mx-4 my-10  lg:m-11 p-11 flex flex-col gap-10 lg:w-[60%] xl:w-[40%]">
                <div className="flex flex-col gap-4">
                    <H3>{t("DadyCar: Your complete solution for fleet management")}</H3>
                    <P>DadyCar est une solution innovante dédiée à la gestion optimisée des flottes de véhicules. Grâce à notre plateforme et notre <Link className="text-primary" href="/features/application-mobile-dadycar-go">application mobile</Link>, nous offrons des outils puissants pour suivre, gérer et analyser vos véhicules en temps réel.</P>
                    <P>{t("Our services include personalized alerts, advice on extending battery life and eco-friendly solutions for more sustainable management")}</P>
                    <P>{t("DadyCar simplifies your operations, reduces costs and helps you meet ecological standards while maximizing the efficiency of your fleet")}</P>
                </div>
                <Button className="w-fit">{t("Request a demo")}</Button>
            </CustomCard>
        </section>
    );
};

export default WhyPresentation2;