@extends('layouts.master')
@section('title')
    Accueil
@endsection

@section('content')

    <!--==============================
    Hero Area
    ==============================-->
    <section class="vs-hero-wrapper position-relative  ">
        <div class="vs-hero-carousel" data-height="850" data-container="1900" data-slidertype="responsive">
            <!-- Slide 1-->
            <div class="ls-slide" data-ls="duration:12000; transition2d:5; kenburnszoom:in; kenburnsscale:1.1;">
                <img width="1920" height="850" src="assets/img/hero/back3.jpg" class="ls-bg" alt="hero-bg" />
                <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; width:300px; height:1558px; background-color:rgba(14, 84, 245, 0.5); top:-473px; left:51px;"
                    class="ls-l ls-text-layer d-hd-none"
                    data-ls="offsetxin:-800; offsetyin:-800; durationin:1700; delayin:1200; easingin:easeOutQuint; rotatein:43.46; offsetxout:1200; offsetyout:1200; durationout:8000; startatout:slidechangeonly + 3000; easingout:easeOutQuint; scaleyout:5; rotation:43.46;">
                </div>
                <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; width:589px; height:1819.7px; top:-485px; left:406px; background:linear-gradient(172deg, rgba(5, 26, 79, 0.35) 21%, rgba(0, 0, 0, 0) 54%);"
                    class="ls-l ls-text-layer d-hd-none"
                    data-ls="offsetxin:-800; offsetyin:-800; durationin:1500; delayin:1300; easingin:easeOutQuint; rotatein:43.46; offsetxout:1200; offsetyout:1200; durationout:8000; startatout:slidechangeonly + 3000; easingout:easeOutQuint; scaleyout:5; bgcolorout:transparent; colorout:transparent; rotation:43.46;">
                </div>
                <p style="font-size:18px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; font-family:Exo; color:#ffffff; border-width:2px 2px 2px 2px; border-color:#ffffff; border-radius:5px 5px 5px 5px; padding-top:9px; padding-right:23.5px; padding-left:23.5px; top:240px; left:688px; padding-bottom:9px;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:300; durationin:1500; delayin:400; easingin:easeOutQuint; offsetxout:300; durationout:1500; easingout:easeOutQuint;">
                    EQUIPE PROFESSIONNELLE</p>
                <h1 style="top:225px; left:345px; font-weight:700; background-size:inherit; background-position:inherit; font-size:60px; color:#ffffff; font-family:Exo;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    EVOLUTIC
                </h1>
                <h1 style="top:305px; left:345px; font-weight:700; background-size:inherit; background-position:inherit; font-size:60px; font-family:Exo; color:#ffffff; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    GROUPE — SOLUTIONS DIGITALES
                </h1>
                <div style="top:405px; left:350px; background-size:inherit; background-position:inherit; font-size:22px; line-height:28px; font-family:Fira Sans; width:895px; color:#ffffff; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetyin:50; durationin:1500; delayin:600; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    Nous concevons des plateformes SaaS — EvoluticImmo, StockFri — et accompagnons entreprises et institutions en ingénierie informatique. Innovation produit et expertise terrain, au service de l'Afrique de l'Ouest.
                </div>
                <div style="top:495px; left:350px; background-size:inherit; background-position:inherit; font-size:24px;" class="ls-l ls-hide-tablet ls-hide-phone ls-html-layer" data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint;  position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <p style="font-size:32px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; font-family:Exo; color:#ffffff; border-width:2px 2px 2px 2px; border-color:#ffffff; border-radius:5px 5px 5px 5px; padding-top:18px; padding-right:44px; padding-left:44px; top:160px; left:90px; padding-bottom:18px;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:300; durationin:1500; delayin:400; easingin:easeOutQuint; offsetxout:300; durationout:1500; easingout:easeOutQuint;">
                    EQUIPE PROFESSIONNELLE
                </p>
                <h1 style="top:280px; left:80px; font-weight:700; background-size:inherit; background-position:inherit; font-size:80px; color:#ffffff; font-family:Exo;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    INGENIERIE INFORMATIQUE &amp;
                </h1>
                <h1 style="top:380px; left:80px; font-weight:700; background-size:inherit; background-position:inherit; font-size:80px; font-family:Exo; color:#ffffff; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    IT SOLUTION
                </h1>
                <div style="top:540px; left:80px; background-size:inherit; background-position:inherit; font-size:24px;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <h1 style="top:120px; left:50%; text-align:center; font-weight:700; background-size:inherit; background-position:inherit; font-size:130px; color:#ffffff; font-family:Exo; width:10000px;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    INGENIERIE INFORMATIQUE &amp;
                </h1>
                <h1 style="top:280px; left:50%; text-align:center; font-weight:700; background-size:inherit; background-position:inherit; font-size:130px; font-family:Exo; color:#ffffff; width:10000px; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    IT SOLUTION
                </h1>
                <div style="top:520px; left:50%; text-align:center; background-size:inherit; background-position:inherit; font-size:24px; width:1000px;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <a class="ls-l ls-hide-tablet ls-hide-phone" href="#next" target="_self" data-ls="static:forever;">
                    <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; left:1685px; top:50%;"
                        class="ls-html-layer">
                        <span class="icon-btn style2"><i class="far fa-arrow-right"></i></span>
                    </div>
                </a>
                <a class="ls-l ls-hide-tablet ls-hide-phone" href="#prev" target="_self" data-ls="static:forever;">
                    <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; left:150px; top:50%;"
                        class="ls-html-layer">
                        <span class="icon-btn style2"><i class="far fa-arrow-left"></i></span>
                    </div>
                </a>
            </div>
            <!-- Slide 2-->
            <div class="ls-slide" data-ls="duration:12000; transition2d:5; kenburnszoom:out; kenburnsscale:1.1;">
                <img width="1920" height="850" src="assets/img/hero/back1.jpg" class="ls-bg" alt="hero-bg" style="filter: brightness(100%);"/>
                <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; width:300px; height:1558px; background-color:rgba(14, 84, 245, 0.5); top:-473px; left:51px;"
                    class="ls-l ls-text-layer d-hd-none"
                    data-ls="offsetxin:-800; offsetyin:-800; durationin:1700; delayin:1200; easingin:easeOutQuint; rotatein:43.46; offsetxout:1200; offsetyout:1200; durationout:8000; startatout:slidechangeonly + 3000; easingout:easeOutQuint; scaleyout:5; rotation:43.46;">
                </div>
                <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; width:589px; height:1819.7px; top:-485px; left:406px; background:linear-gradient(172deg, rgba(5, 26, 79, 0.35) 21%, rgba(0, 0, 0, 0) 54%);"
                    class="ls-l ls-text-layer d-hd-none"
                    data-ls="offsetxin:-800; offsetyin:-800; durationin:1500; delayin:1300; easingin:easeOutQuint; rotatein:43.46; offsetxout:1200; offsetyout:1200; durationout:8000; startatout:slidechangeonly + 3000; easingout:easeOutQuint; scaleyout:5; bgcolorout:transparent; colorout:transparent; rotation:43.46;">
                </div>
                <p style="font-size:18px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; font-family:Exo; color:#ffffff; border-width:2px 2px 2px 2px; border-color:#ffffff; border-radius:5px 5px 5px 5px; padding-top:9px; padding-right:23.5px; padding-left:23.5px; top:240px; left:680px; padding-bottom:9px;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:300; durationin:1500; delayin:400; easingin:easeOutQuint; offsetxout:300; durationout:1500; easingout:easeOutQuint;">
                    INNOVATION TECH</p>
                <h1 style="top:225px; left:345px; font-weight:700; background-size:inherit; background-position:inherit; font-size:60px; color:#ffffff; font-family:Exo;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    EVOLUTIC
                </h1>
                <h1 style="top:305px; left:345px; font-weight:700; background-size:inherit; background-position:inherit; font-size:60px; font-family:Exo; color:#ffffff; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    IMMO &amp; STOCKFRI
                </h1>
                <div style="top:405px; left:350px; background-size:inherit; background-position:inherit; font-size:22px; line-height:28px; font-family:Fira Sans; width:895px; color:#ffffff; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetyin:50; durationin:1500; delayin:600; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    Gestion locative avec Mobile Money, pilotage de stock pour commerces — deux plateformes SaaS opérationnelles, développées par nos équipes pour l'Afrique de l'Ouest.    
                </div>
                <div style="top:495px; left:350px; background-size:inherit; background-position:inherit; font-size:24px;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <p style="font-size:32px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; font-family:Exo; color:#ffffff; border-width:2px 2px 2px 2px; border-color:#ffffff; border-radius:5px 5px 5px 5px; padding-top:18px; padding-right:44px; padding-left:44px; top:160px; left:90px; padding-bottom:18px;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:300; durationin:1500; delayin:400; easingin:easeOutQuint; offsetxout:300; durationout:1500; easingout:easeOutQuint;">
                    INNOVATION TECH
                </p>
                <h1 style="top:280px; left:80px; font-weight:700; background-size:inherit; background-position:inherit; font-size:80px; color:#ffffff; font-family:Exo;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    SOLUTIONS
                </h1>
                <h1 style="top:380px; left:80px; font-weight:700; background-size:inherit; background-position:inherit; font-size:80px; font-family:Exo; color:#ffffff; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    INFORMATIQUES &amp; NUMERIQUES
                </h1>
                <div style="top:540px; left:80px; background-size:inherit; background-position:inherit; font-size:24px;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <h1 style="top:120px; left:50%; text-align:center; font-weight:700; background-size:inherit; background-position:inherit; font-size:130px; color:#ffffff; font-family:Exo; width:10000px;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    SOLUTIONS
                </h1>
                <h1 style="top:280px; left:50%; text-align:center; font-weight:700; background-size:inherit; background-position:inherit; font-size:130px; font-family:Exo; color:#ffffff; width:10000px; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    INFORMATIQUES &amp; NUMERIQUES
                </h1>
                <div style="top:520px; left:50%; text-align:center; background-size:inherit; background-position:inherit; font-size:24px; width:1000px;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
            <!-- Slide 3-->
            <div class="ls-slide" data-ls="duration:12000; transition2d:5; kenburnszoom:in; kenburnsscale:1.1;">
                <img width="1920" height="850" src="assets/img/hero/back2.jpg" class="ls-bg" alt="hero-bg" />
                <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; width:300px; height:1558px; background-color:rgba(14, 84, 245, 0.5); top:-473px; left:51px;"
                    class="ls-l ls-text-layer d-hd-none"
                    data-ls="offsetxin:-800; offsetyin:-800; durationin:1700; delayin:1200; easingin:easeOutQuint; rotatein:43.46; offsetxout:1200; offsetyout:1200; durationout:8000; startatout:slidechangeonly + 3000; easingout:easeOutQuint; scaleyout:5; rotation:43.46;">
                </div>
                <div style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; border-color:#000; background-position:0% 0%; background-repeat:no-repeat; width:589px; height:1819.7px; top:-485px; left:406px; background:linear-gradient(172deg, rgba(5, 26, 79, 0.35) 21%, rgba(0, 0, 0, 0) 54%);"
                    class="ls-l ls-text-layer d-hd-none"
                    data-ls="offsetxin:-800; offsetyin:-800; durationin:1500; delayin:1300; easingin:easeOutQuint; rotatein:43.46; offsetxout:1200; offsetyout:1200; durationout:8000; startatout:slidechangeonly + 3000; easingout:easeOutQuint; scaleyout:5; bgcolorout:transparent; colorout:transparent; rotation:43.46;">
                </div>
                <p style="font-size:18px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; font-family:Exo; color:#ffffff; border-width:2px 2px 2px 2px; border-color:#ffffff; border-radius:5px 5px 5px 5px; padding-top:9px; padding-right:23.5px; padding-left:23.5px; top:240px; left:735px; padding-bottom:9px;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:300; durationin:1500; delayin:400; easingin:easeOutQuint; offsetxout:300; durationout:1500; easingout:easeOutQuint;">
                    SERVICES DE QUALITE</p>
                <h1 style="top:225px; left:345px; font-weight:700; background-size:inherit; background-position:inherit; font-size:60px; color:#ffffff; font-family:Exo;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    UNE VARIETE
                </h1>
                <h1 style="top:305px; left:345px; font-weight:700; background-size:inherit; background-position:inherit; font-size:60px; font-family:Exo; color:#ffffff; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    DE SEVICES DE POINTES
                </h1>
                <div style="top:405px; left:350px; background-size:inherit; background-position:inherit; font-size:20px; line-height:28px; font-family:Fira Sans; width:895px; color:#ffffff; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetyin:50; durationin:1500; delayin:600; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    Nous offrons une gamme complète et variée de services. En plus de services numériques, nous offrons également d'autres services tels que la maintenance informatiques, achat et ventes de marchandises et consommables informatiques, service de nettoyage et livraisons</div>
                <div style="top:495px; left:350px; background-size:inherit; background-position:inherit; font-size:24px;"
                    class="ls-l ls-hide-tablet ls-hide-phone ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <p style="font-size:32px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; font-family:Exo; color:#ffffff; border-width:2px 2px 2px 2px; border-color:#ffffff; border-radius:5px 5px 5px 5px; padding-top:18px; padding-right:44px; padding-left:44px; top:160px; left:90px; padding-bottom:18px;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:300; durationin:1500; delayin:400; easingin:easeOutQuint; offsetxout:300; durationout:1500; easingout:easeOutQuint;">
                    SERVICES DE QUALITE</p>
                <h1 style="top:280px; left:80px; font-weight:700; background-size:inherit; background-position:inherit; font-size:80px; color:#ffffff; font-family:Exo;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    UNE VARIETE
                </h1>
                <h1 style="top:380px; left:80px; font-weight:700; background-size:inherit; background-position:inherit; font-size:80px; font-family:Exo; color:#ffffff; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    DE SEVICES DE POINTES
                </h1>
                <div style="top:540px; left:80px; background-size:inherit; background-position:inherit; font-size:24px;"
                    class="ls-l ls-hide-desktop ls-hide-phone ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
                <h1 style="top:120px; left:50%; text-align:center; font-weight:700; background-size:inherit; background-position:inherit; font-size:130px; color:#ffffff; font-family:Exo; width:10000px;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint; position:relative;">
                    UNE VARIETE
                </h1>
                <h1 style="top:280px; left:50%; text-align:center; font-weight:700; background-size:inherit; background-position:inherit; font-size:130px; font-family:Exo; color:#ffffff; width:10000px; text-transform:none; border-style:solid; border-color:#000; background-color:transparent; background-repeat:no-repeat; cursor:auto;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
                    data-ls="offsetxin:-200; durationin:1500; delayin:200; easingin:easeOutQuint; offsetxout:-100; durationout:1500; easingout:easeOutQuint;">
                    DE SEVICES DE POINTES
                </h1>
                <div style="top:520px; left:50%; text-align:center; background-size:inherit; background-position:inherit; font-size:24px; width:1000px;"
                    class="ls-l ls-hide-desktop ls-hide-tablet ls-html-layer"
                    data-ls="offsetyin:50; durationin:1500; delayin:900; easingin:easeOutQuint; offsetyout:50; durationout:1500; easingout:easeOutQuint; position:relative;">
                    <div class="ls-btn-group">
                        <a href="{{route('solutions')}}" class="vs-btn ls-hero-btn">NOS SOLUTIONS<i class="far fa-arrow-right"></i></a>
                        <a href="{{route('contact')}}" class="vs-btn style2 ls-hero-btn">NOUS CONTACTER<i  class="far fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div data-bg-src="assets/img/bg/ab-bg-1-1.jpg">
        <!--==============================
    Features Area
    ==============================-->
        <section class="feature-wrap1  space-top space-extra-bottom">
            <div class="container wow fadeInUp" data-wow-delay="0.2s">
                <div class="row vs-carousel" data-slide-show="3" data-lg-slide-show="2" data-md-slide-show="2">
                    <div class="col-xl-4">
                        <div class="feature-style1">
                            <div class="feature-icon"><img src="assets/img/icon/fe-1-1.png" alt="Features"></div>
                            <h3 class="feature-title h5"><a href="{{ route('solutions') }}" class="text-inherit">Solutions SaaS</a></h3>
                            <p class="feature-text">EvoluticImmo, StockFri et d'autres plateformes que nous concevons pour répondre aux besoins concrets des entreprises africaines.</p>
                            <a href="{{ route('solutions') }}" class="vs-btn style3">Découvrir<i class="far fa-long-arrow-right"></i></a>
                        </div>
                    </div>
                    <div class="col-xl-4">
                        <div class="feature-style1">
                            <div class="feature-icon"><img src="assets/img/icon/fe-1-2.png" alt="Features"></div>
                            <h3 class="feature-title h5"><a class="text-inherit">Formations</a></h3>
                            <p class="feature-text">Développez vos compétences avec nos programmes de formation spécialisés, adaptés aux exigences du marché.</p>
                            <a href="{{route('services')}}" class="vs-btn style3">En savoir plus<i class="far fa-long-arrow-right"></i></a>
                        </div>
                    </div>
                    <div class="col-xl-4">
                        <div class="feature-style1">
                            <div class="feature-icon"><img src="assets/img/icon/fe-1-3.png" alt="Features"></div>
                            <h3 class="feature-title h5"><a class="text-inherit">Prestations de services</a></h3>
                            <p class="feature-text">Bénéficiez de notre expertise avec des services personnalisés pour répondre à tous vos besoins informatiques et divers.</p>
                            <a href="{{route('services')}}" class="vs-btn style3">En savoir plus<i class="far fa-long-arrow-right"></i></a>                            
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
    <!--==============================
    About Us
    ==============================-->
    <section class="position-relative about-style1 space-top space-bottom bg-white">
        <span class="about-shape4 ani-moving-y d-none d-xl-block">
            <img src="assets/img/about/about-bg-shep.png" alt="">
        </span>
        <div class="container z-index-common">
            <div class="row g-lg-5 gx-60">
                <div class="col-lg-6 col-xl-6 mb-20 mb-lg-0 wow fadeInUp" data-wow-delay="0.2s">
                    <div class="img-box11">
                        <div class="img-1">
                            <div class="img-1">
                                <img src="assets/img/who.png" alt="About image">
                            </div>
                            <div class="img-2">
                                <img src="assets/img/who2.jpg" alt="About image" style="width: 293px">
                            </div>
                        </div>
                        <div class="img-3 d-none d-lg-block">
                            <img src="assets/img/who3.png" alt="About image">
                        </div>
                        <div class="d-lg-block">
                            <div class="media-body">
                                <div>
                                    <span class="counter-media__number h1">10+</span>
                                    <p class="counter-media__title">ans d'expérience</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-6 align-self-center wow fadeInUp" data-wow-delay="0.3s">
                    <span class="sec-subtitle"><i class="fas fa-bring-forward"></i>EVOLUTIC GROUPE</span>
                    <h5 class="sec-title h5">Groupe technologique au service de l'Afrique</h5>
                    <p class="mb-4 mt-1 pb-3">Evolutic Groupe conçoit et opère des solutions digitales adaptées aux réalités du marché africain — de la gestion locative à la gestion de stock — tout en accompagnant entreprises et institutions en ingénierie informatique. Notre expertise allie innovation produit et exécution terrain.</p>
                    <div class="call-media">
                        <div class="call-media__icon"><img src="assets/img/icon/tel-1-1.png" alt="icon"></div>
                        <div class="media-body">
                            <span class="call-media__label">SERVICE DISPONIBLE 24H/24</span>
                            <p class="call-media__info">
                                <a href="tel:{{ config('contact.phones.0.tel') }}">{{ config('contact.phones.0.display') }}</a>
                                · <a href="tel:{{ config('contact.phones.1.tel') }}">{{ config('contact.phones.1.display') }}</a>
                                <br>
                                <a href="https://wa.me/{{ config('contact.whatsapp.url') }}">WhatsApp {{ config('contact.whatsapp.display') }}</a>
                            </p>
                        </div>
                    </div>
                    <a href="{{route('about')}}" class="vs-btn">A propos de nous<i class="far fa-long-arrow-right"></i></a>
                </div>
            </div>
        </div>
    </section>

    <!--==============================
    Solutions Area
    ==============================-->
    <section class="space position-relative bg-white" id="solutions">
        <div class="container space-extra-bottom">
            <div class="row justify-content-between align-items-center mb-4">
                <div class="col-lg-7 text-center text-lg-start">
                    <div class="title-area">
                        <span class="sec-subtitle"><i class="fas fa-bring-forward"></i>Nos Solutions</span>
                        <h2 class="sec-title h5">Des logiciels nés sur le terrain, pas dans un bureau</h2>
                        <p class="mt-2">EvoluticImmo et StockFri sont nos produits phares — conçus, développés et opérés par nos équipes au Bénin.</p>
                    </div>
                </div>
                <div class="col-auto d-none d-lg-block">
                    <a href="{{ route('solutions') }}" class="vs-btn">Voir toutes les solutions<i class="far fa-arrow-right"></i></a>
                </div>
            </div>
            <div class="row g-4">
                @foreach (config('solutions.items') as $solution)
                    @include('solutions.partials.card', ['solution' => $solution])
                @endforeach
            </div>
            <div class="text-center d-lg-none mt-4">
                <a href="{{ route('solutions') }}" class="vs-btn">Voir toutes les solutions<i class="far fa-arrow-right"></i></a>
            </div>
        </div>
    </section>

    <div class="position-relative ">
        <div class="counter-shape1"></div>
        <div class="bg-black z-index-common space" data-bg-src="assets/img/bg/counter-bg-1-1.jpg">
            <div class="container wow fadeInUp" data-wow-delay="0.2s">
                <div class="row justify-content-between gy-4">
                    <div class="col-6 col-lg-auto">
                        <div class="counter-media">
                            <div class="counter-media__icon"><img src="assets/img/icon/count-1-1.png" alt="icon"></div>
                            <div class="media-body">
                                <span class="counter-media__number h1 text-white" data-counter="30">30</span>
                                <p class="counter-media__title text-white">Projets réalisés</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-6 col-lg-auto">
                        <div class="counter-media">
                            <div class="counter-media__icon"><img src="assets/img/icon/count-1-2.png" alt="icon"></div>
                            <div class="media-body">
                                <span class="counter-media__number h1 text-white" data-counter="200">200</span>
                                <p class="counter-media__title text-white">Services</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-6 col-lg-auto">
                        <div class="counter-media">
                            <div class="counter-media__icon"><img src="assets/img/icon/count-1-3.png" alt="icon"></div>
                            <div class="media-body">
                                <span class="counter-media__number h1 text-white" data-counter="50">50</span>
                                <p class="counter-media__title text-white">Collaborateurs</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-6 col-lg-auto">
                        <div class="counter-media">
                            <div class="counter-media__icon"><img src="assets/img/icon/count-1-4.png" alt="icon"></div>
                            <div class="media-body">
                                <span class="counter-media__number h1 text-white" data-counter="90">90</span>
                                <p class="counter-media__title text-white">Clients satisfaits</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--==============================
    Service Area
    ==============================-->
    <section class="space position-relative" data-bg-src="assets/img/bg/service-bg.jpg">
        <span class="service-shape2 ani-moving-y d-none d-xl-block">
            <img src="assets/img/shape/service-shape.png" alt="">
        </span>
        <div class="container space-extra-bottom">
            <div class="row justify-content-between align-items-center">
                <div class="col-lg-6 text-center text-lg-start">
                    <div class="title-area">
                        <span class="sec-subtitle"><i class="fas fa-bring-forward"></i>Nos Services</span>
                        <h2 class="sec-title h5">Quels types de services offrons nous ?</h2>
                    </div>
                </div>
                <div class="col-auto d-none d-lg-block">
                    <div class="sec-btns">
                        <button class="vs-btn style4" data-slick-prev="#servicslide1"><i
                                class="far fa-arrow-left"></i>Prev</button>
                        <button class="vs-btn style4" data-slick-next="#servicslide1">Next<i
                                class="far fa-arrow-right"></i></button>
                    </div>
                </div>
            </div>
            <div class="row wow fadeInUp vs-carousel" data-autoplay="true" data-wow-delay="0.2s" data-slide-show="3"
                data-md-slide-show="2" id="servicslide1">
                <div class="col-md-6 col-lg-4">
                    <div class="service-style6">
                        <div class="service-icon-box">
                            <div class="service-icon"><img src="assets/img/icon/sr-icon-1-2.png" alt="Features"></div>
                        </div>
                        <h3 class="service-title h6"><a href="{{route('services')}}">Developpement Web & Mobile</a></h3>
                        <p class="service-text">Nous concevons et développons les sites web, application web et mobiles sur mesure et suivant l'ergonomie de la clientèle</p>
                        <a href="{{route('contact')}}" class="vs-btn style3">Nous contacter<i class="far fa-long-arrow-right"></i></a>
                        <div class="box-shep">
                            <img src="assets/img/service/box-shep1.svg" alt="service-shep">
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-4">
                    <div class="service-style6">
                        <div class="service-icon-box">
                            <div class="service-icon"><img src="assets/img/icon/sr-icon-1-1.png" alt="Features"></div>
                        </div>
                        <h3 class="service-title h5"><a href="{{route('services')}}">Services Informatiques</a></h3>
                        <p class="service-text">Nous assurons la maintenance informatique, Gestion & maintenance de données offline et online, refontes & mise à jour logiciel, </p>
                        <a href="{{route('contact')}}" class="vs-btn style3">Nous contacter<i class="far fa-long-arrow-right"></i></a>
                        <div class="box-shep">
                            <img src="assets/img/service/box-shep1.svg" alt="service-shep">
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-4">
                    <div class="service-style6">
                        <div class="service-icon-box">
                            <div class="service-icon"><img src="assets/img/icon/sr-icon-1-3.png" alt="Features"></div>
                        </div>
                        <h3 class="service-title h5"><a href="{{route('services')}}">Services Accessoires</a></h3>
                        <p class="service-text">Nous sommes également spécialisés dans la fourniture de bureau, matériels informatiques, mise en place de chartes graphiques, conseils et orientations informatiques</p>
                        <a href="{{route('contact')}}" class="vs-btn style3">Nous contacter<i class="far fa-long-arrow-right"></i></a>
                        <div class="box-shep">
                            <img src="assets/img/service/box-shep1.svg" alt="service-shep">
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-4">
                    <div class="service-style6">
                        <div class="service-icon-box">
                            <div class="service-icon"><img src="assets/img/icon/sr-icon-1-4.png" alt="Features"></div>
                        </div>
                        <h3 class="service-title h5"><a href="{{route('services')}}">Services secondaires</a></h3>
                        <p class="service-text">Nous disposons également d'une branche de services de livraison de colis et repas. Un service de nettoyage est également disponible pour mieux vous servir</p>
                        <a href="{{route('contact')}}" class="vs-btn style3">Nous contacter<i class="far fa-long-arrow-right"></i></a>
                        <div class="box-shep">
                            <img src="assets/img/service/box-shep1.svg" alt="service-shep">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--==============================
    CTA Area
    ==============================-->
    <section class="z-index-common cta-style2">
        <div class="vs-container2 space" data-bg-src="assets/img/bg/counter-bg-2-1.jpg">
            <div class="row text-center text-lg-start align-items-center justify-content-around">
                <div class="col-lg-auto">
                    <span class="sec-subtitle text-white">Nous sommes là pour vous répondre 24/7</span>
                    <h2 class="h1 sec-title cta-title1">Une préoccupation ?</h2>
                </div>
                <div class="col-lg-auto">
                    <a href="{{route('contact')}}" class="vs-btn">Nous conntacter<i class="far fa-arrow-right"></i></a>
                </div>
            </div>
        </div>
    </section>
    <!--==============================
    work Area
    ==============================-->
    <section class="space work-layout1">
        <span class="work-shape ani-moving-y d-none d-xl-block">
            <img src="assets/img/shape/work-bg-shep.png" alt="shep">
        </span>
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-6 text-center text-center">
                    <div class="title-area">
                        <span class="sec-subtitle"><i class="fas fa-bring-forward"></i>Notre plan de travail</span>
                        <h2 class="sec-title h5">Comment fonctionnons nous et pourquoi nous choisir?</h2>
                    </div>
                </div>
            </div>
            <div class="row g-5">
                <div class="col-lg-4">
                    <div class="work-box" data-bg-src="assets/img/work/work-1-1.jpg">
                        <div class="box-inner">
                            <p class="work-subtitle">Notre stratégie de travail</p>
                            <h3 class="work-title h5">Nous avons une stratégie de pointe pour la satisfactionde notre clientèle</h3>
                            <a href="{{route('contact')}}" class="vs-btn">Nous contacter<i class="far fa-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-8">
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="feature-style2">
                                <div class="feature-icon"><img src="assets/img/icon/fe-5-1.png" alt="Features"></div>
                                <h3 class="feature-title h5"><a class="text-inherit">Etude de problématique</a></h3>
                                <p class="feature-text">Nous prenons soin de prendre en compte la problématique et le besoin du client et s'inscrire dans son contexte.</p>
                                <span class="feature-number">01</span>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="feature-style2">
                                <div class="feature-icon"><img src="assets/img/icon/fe-5-2.png" alt="Features"></div>
                                <h3 class="feature-title h5"><a class="text-inherit">Analyse et Plannification</a></h3>
                                <p class="feature-text">Nous analysons ensuite le problème pour en découler sur les plans à mettre en place pour un meilleur rendu et une expérience utilisateur</p>
                                <span class="feature-number">02</span>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="feature-style2 mb-lg-0">
                                <div class="feature-icon"><img src="assets/img/icon/fe-5-3.png" alt="Features"></div>
                                <h3 class="feature-title h5"><a class="text-inherit">Résolution</a></h3>
                                <p class="feature-text">Une fois le plan établi et bien orienté, nous procédons à une implication des divers points retenus avec le client lors de l'élaboration du plan.</p>
                                <span class="feature-number">03</span>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="feature-style2 mb-0">
                                <div class="feature-icon"><img src="assets/img/icon/fe-5-4.png" alt="Features"></div>
                                <h3 class="feature-title h5"><a class="text-inherit">Livraison</a></h3>
                                <p class="feature-text">Après s'être assuré de la satisfaction du client, nous procédons à la livraison tout en prenant soin d'offrir un service après-vente de pointe</p>
                                <span class="feature-number">04</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="space-extra-bottom pt-3 position-relative" data-bg-src="assets/img/bg/service-bg.png">
        
    </section>
    <!--==============================
    FAQ Area
    ==============================-->
    <section class="faq-wrap1  ">
        <div class="faq-shape1" data-bg-src="assets/img/bg/faq-bg-1-1.jpg"></div>
        <div class="faq-shape2" data-bg-src="assets/img/bg/faq-bg-1-2.jpg"></div>
        <div class="container">
            <div class="row gx-60">
                <div class="col-lg-6 pb-20 pb-lg-0 wow fadeInUp" data-wow-delay="0.2s">
                    <div class="img-box2">
                        <div class="img-1">
                            <img src="assets/img/faq.jpg" alt="FAQ image">
                        </div>
                        <div class="img-2">
                            <img src="assets/img/faq2.png"  alt="FAQ image">
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 align-self-center">
                    <span class="sec-subtitle text-white"><i class="fas fa-bring-forward"></i>Vous avez une préoccupation ?</span>
                    <h2 class="sec-title text-white mb-4 pb-2 h1">FAQ</h2>
                    <div class="accordion accordion-style1" id="faqVersion1">
                        <div class="accordion-item">
                            <div class="accordion-header" id="headingOne">
                                <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                    Comment vous contacter ?
                                </button>
                            </div>
                            <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#faqVersion1">
                                <div class="accordion-body">
                                    <p> Pour nous contacter, il suffit de vous rendre sur la page de contact où un formulaire simplifié vous est réservé, nous écrire à <a href="mailto:{{ config('contact.email') }}">{{ config('contact.email') }}</a>, nous appeler au <a href="tel:{{ config('contact.phones.0.tel') }}">{{ config('contact.phones.0.display') }}</a> ou <a href="tel:{{ config('contact.phones.1.tel') }}">{{ config('contact.phones.1.display') }}</a>, ou nous joindre sur WhatsApp : <a href="https://wa.me/{{ config('contact.whatsapp.url') }}">{{ config('contact.whatsapp.display') }}</a></p>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-item">
                            <div class="accordion-header" id="headingTwo">
                                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"  data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                    Quel budget prévoir pour bénéficier de vos services ?
                                </button>
                            </div>
                            <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#faqVersion1">
                                <div class="accordion-body">
                                    <p> Nous sommes une structure innovante en matière de technologie. Nous sommes à cet effet à l'écoute de la clientèle ; ainsi donc, aucune marge budgétaire n'est définie si ce n'est qu'après étude de la problématique. Le budget est donc en fonction de la problématique. Rassurez-vous, nous avons meilleur rapport qualité-prix.</p>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-item">
                            <div class="accordion-header" id="headingThree">
                                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                    Comment obtenir un devis ?
                                </button>
                            </div>
                            <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree"
                                data-bs-parent="#faqVersion1">
                                <div class="accordion-body">
                                    <p> L’établissement d’un devis est obligatoire et est encadré par la loi, ainsi plusieurs règles doivent être respectées lors de sa rédaction. Après une étude précise des besoins de nos clients ou prospects, lors de réunions, appels téléphoniques ou après l’étude du cahier des charges, nous allons chiffrer la demande de ces derniers.</p>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-item">
                            <div class="accordion-header" id="headingFour">
                                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
                                    Possibilité de travailler à distance ?
                                </button>
                            </div>
                            <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour"
                                data-bs-parent="#faqVersion1">
                                <div class="accordion-body">
                                    <p> Même si nos bureaux sont situés à Cotonou et Abidjan, nous travaillons à distance avec une grande partie de nos clients. Avec tous les outils web que nous disposons il n'est plus primordial de se rencontrer en dur. Une fois votre accord sur notre proposition commerciale nous serons en étroite communication avec vous pendant toute notre mission ainsi que lors des maintenances, des mises à jours et des rajouts de contenus pendant la vie de notre contrat.</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--==============================
    Blog Area
    ==============================-->
    <section class="vs-blog-wrapper blog-layout1 space-top space-extra-bottom">
    </section>
@endsection