@extends('web.layouts.container')

@section('content')
    <!-- ---------- services ----------- -->
    @if(count($services))
        <section class="services_new section_padding">
            <div class="container">
                <div class="section_head">
                    <h6> <img src="{{asset('assets/web/images/sec_head_sh.svg')}}" alt=""> {{__('services.head')}}</h6>
                    <h2>{{__('main.numerous_services')}}</h2>
                </div>
                <div class="content">
                    <div class="flip-cards row">

                        <?php
                        $routes = [
                            route('consulting.consultingBookingForm'),
                            route('cases.index'),
                            route('documentation.index'),
                            route('company.index'),
                            route('other.index'),
                        ];
                        ?>
                        @foreach($services as $key => $service)
                            <div class="col-lg-4">
                                <div class="card-container">
                                    <div class="card">
                                        <div class="face back">
                                            <div class="cont text-center">
                                                <h5 class="mb-3"> {{$service->title}} </h5>
                                                <p>{!! stripText($service->description) !!}</p>
                                                <a href="{{$routes[$key]}}" class="butn mt-4">
                                                    <span>{{__('main.see_more')}}</span>
                                                </a>
                                            </div>
                                        </div>
                                        <div class="face front">
                                            <div class="cont">
                                                <img src="{{asset($service->image)}}" alt=""  class="icon">
                                                <h3> {{$service->title}} </h3>
                                                <i class="bi bi-arrow-left arrow"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </section>
    @endif
    <!-- ------------ services ----------- -->
    @if($homeSections)
        <section class="services_sec bg-white">
            <div class="container">
                <div class="section_head">
                    <h6> <img src="{{asset('assets/web/images/sec_head_sh.svg')}}" alt="">{{__('main.community_services')}} </h6>
                    <h2>{{__('main.community_services')}}</h2>
                </div>
                <div class="content">
                    <div class="row">
                        <div class="col-lg-8">
                            <div class="info">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="services_box wow fadeInUp">
                                            <div class="icon">
                                                <img src="{{asset('assets/web/images/icons/ser1.svg')}}" alt="">
                                            </div>
                                            <div class="inf">
                                                <h6>{{$homeSections->social_service_box_1_title}}</h6>
                                                <div class="text">{!! stripText($homeSections->social_service_box_1_description) !!} </div>
                                                @if(($homeSections->points['first_box_points'] ?? null))
                                                    @foreach($homeSections->points['first_box_points'][$lang] as $point)
                                                        <span class="lnk">{{$point}}</span>
                                                    @endforeach
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="services_box wow fadeInUp" data-wow-delay="0.2s">
                                            <div class="icon">
                                                <img src="{{asset('assets/web/images/icons/ser3.svg')}}" alt="">
                                            </div>
                                            <div class="inf">
                                                <h6>{{$homeSections->social_service_box_2_title}}</h6>
                                                <div class="text">{!! stripText($homeSections->social_service_box_2_description) !!} </div>
                                                @if(($homeSections->points['second_box_points'] ?? null))
                                                    @foreach($homeSections->points['second_box_points'][$lang] as $point)
                                                        <span class="lnk">{{$point}}</span>
                                                    @endforeach
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="services_box wow fadeInUp" data-wow-delay="0.4s">
                                            <div class="icon">
                                                <img src="{{asset('assets/web/images/icons/ser2.svg')}}" alt="">
                                            </div>
                                            <div class="inf">
                                                <h6>{{$homeSections->social_service_box_3_title}}</h6>
                                                <div class="text">{!! stripText($homeSections->social_service_box_3_description) !!} </div>
                                                @if(($homeSections->points['third_box_points'] ?? null))
                                                    @foreach($homeSections->points['third_box_points'][$lang] as $point)
                                                        <span class="lnk">{{$point}}</span>
                                                    @endforeach
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="services_box wow fadeInUp" data-wow-delay="0.6s">
                                            <div class="icon">
                                                <img src="{{asset('assets/web/images/icons/ser4.svg')}}" alt="">
                                            </div>
                                            <div class="inf">
                                                <h6>{{$homeSections->social_service_box_4_title}}</h6>
                                                <div class="text">{!! stripText($homeSections->social_service_box_4_description) !!} </div>
                                                @if(($homeSections->points['fourth_box_points'] ?? null))
                                                    @foreach($homeSections->points['fourth_box_points'][$lang] as $point)
                                                        <span class="lnk">{{$point}}</span>
                                                    @endforeach
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <div class="img wow fadeInUp" data-wow-delay="0.8s">
                                <img src="{{asset($homeSections->social_service_image)}}" alt="">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- ------------ features ----------- -->
        <section class="features section_padding">
            <div class="container">
                <div class="section_head">
                    <h6> <img src="{{asset('assets/web/images/sec_head_sh.svg')}}" alt=""> {{__('main.distinguishes_us')}} </h6>
                    <h2>{{__('main.offered_advantages')}}</h2>
                </div>
                <div class="content">
                    <div class="row align-items-center justify-content-between">
                        <div class="col-lg-4">
                            <div class="feat_box wow fadeInUp">
                                <div class="icon">
                                    <img src="{{asset('assets/web/images/icons/f1.svg')}}" alt="">
                                </div>
                                <div class="inf">
                                    <h6>{{$homeSections->advantage_box_1_title}}</h6>
                                    <div class="text">{!! stripText($homeSections->advantage_box_1_description) !!}</div>
                                </div>
                            </div>
                            <div class="feat_box wow fadeInUp">
                                <div class="icon">
                                    <img src="{{asset('assets/web/images/icons/f2.svg')}}" alt="">
                                </div>
                                <div class="inf">
                                    <h6>{{$homeSections->advantage_box_2_title}}</h6>
                                    <div class="text">{!! stripText($homeSections->advantage_box_2_description) !!}</div>
                                </div>
                            </div>
                            <div class="feat_box wow fadeInUp">
                                <div class="icon">
                                    <img src="{{asset('assets/web/images/icons/f3.svg')}}" alt="">
                                </div>
                                <div class="inf">
                                    <h6>{{$homeSections->advantage_box_3_title}}</h6>
                                    <div class="text">{!! stripText($homeSections->advantage_box_3_description) !!}</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3">
                            <div class="mob_img">
                                <img src="{{asset($homeSections->advantage_image)}}" alt="" class="main_img wow zoomIn">
                                <img src="{{asset('assets/web/images/mob_crk.svg')}}" alt="" class="img_crcl">
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <div class="feat_box l_box wow fadeInUp">
                                <div class="icon">
                                    <img src="{{asset('assets/web/images/icons/f4.svg')}}" alt="">
                                </div>
                                <div class="inf">
                                    <h6>{{$homeSections->advantage_box_4_title}}</h6>
                                    <div class="text">{!! stripText($homeSections->advantage_box_4_description) !!}</div>
                                </div>
                            </div>
                            <div class="feat_box l_box wow fadeInUp">
                                <div class="icon">
                                    <img src="{{asset('assets/web/images/icons/f5.svg')}}" alt="">
                                </div>
                                <div class="inf">
                                    <h6>{{$homeSections->advantage_box_5_title}}</h6>
                                    <div class="text">{!! stripText($homeSections->advantage_box_5_description) !!}</div>
                                </div>
                            </div>
                            <div class="feat_box l_box wow fadeInUp">
                                <div class="icon">
                                    <img src="{{asset('assets/web/images/icons/f6.svg')}}" alt="">
                                </div>
                                <div class="inf">
                                    <h6>{{$homeSections->advantage_box_6_title}}</h6>
                                    <div class="text">{!! stripText($homeSections->advantage_box_6_description) !!}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    @endif

    @if($about)
        <!-- ------------ numbers ----------- -->
        <section class="numbers section_padding" id="numbers">
            <div class="container">
                <div class="content">
                    <div class="info wow fadeInUp">
                        <div class="section_head head_light">
                            <h6> <img src="{{asset('assets/web/images/sec_head_sh.svg')}}" alt="">{{__('main.our_achievements')}}</h6>
                            <h2> {{$achieveTitle1}} <br>{{$achieveTitle2}} </h2>
                            <div class="text">{!! stripText($about->achieve_description) !!}</div>
{{--                            <a href="{{route('consulting.index')}}" class="butn mt-4">--}}
{{--                            <span> <i class="bi bi-calendar"></i> {{__('main.booking_appointment')}} </span>--}}
{{--                            </a>--}}
                        </div>
                    </div>
                    <div class="num_content ">
                        <div class="row">
                            <div class="col-lg-3 col-6">
                                <div class="num_box py-5 wow fadeInUp">
                                    <h3> +k <span class="counter">{{$about->client_numbers}}</span> </h3>
                                    <p>{{$about->client_title}}</p>
                                </div>
                            </div>
                            <div class="col-lg-3 col-6">
                                <div class="num_box py-5 wow fadeInUp" data-wow-delay="0.2s">
                                    <h3> + <span class="counter">{{$about->cases_numbers}}</span> </h3>
                                    <p>{{$about->cases_title}}</p>
                                </div>
                            </div>
                            <div class="col-lg-3 col-6">
                                <div class="num_box py-5 wow fadeInUp" data-wow-delay="0.4s">
                                    <h3> + <span class="counter">{{$about->consulting_numbers}}</span> </h3>
                                    <p>{{$about->consulting_title}}</p>
                                </div>
                            </div>
                            <div class="col-lg-3 col-6">
                                <div class="num_box py-5 wow fadeInUp" data-wow-delay="0.6s">
                                    <h3> + <span class="counter">{{$about->documentation_numbers}}</span> </h3>
                                    <p>{{$about->documentation_title}}</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-4">
                        <div class="num_content">

                        </div>
                    </div>
                    <div class="col-lg-8">

                    </div>
                </div>
            </div>
        </section>
        <!-- ------------ about ----------- -->
        <section class="about section_padding">
            <div class="container">
                <div class="row justify-content-between align-items-center">
                    <div class="col-lg-5">
                        <div class="section_head wow fadeInUp">
                            <h6> <img src="{{asset('assets/web/images/sec_head_sh.svg')}}" alt=""> {{__('abouts.head')}}</h6>
                            <!--<h2>{{$aboutTitle1}} <br>{{$aboutTitle2}}</h2>-->
                            <div class="text">{{stripText($about->about_description)}}</div>
                            <a href="{{route('aboutUs')}}" class="butn">
                                <span>{{__('main.read_more')}}</span>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-5">
                        <div class="img wow fadeInUp" data-wow-delay="0.2s">
                            <img src="{{asset($about->about_image_1)}}" alt="" class="main_img">
{{--                            <img src="{{asset($about->about_image_2)}}" alt="" class="sub_img wow zoomIn" data-wow-delay="0.5s">--}}
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <div class="vision" >
            <div class="container">
                <div class="row bx-5">
                    <div class="col-lg-4">
                        <div class="items wow fadeInUp">
                            <div class="icon">
                                <i class="bi bi-eye"></i>
                            </div>
                            <div class="info">
                                <h5>{{$about->vision_title}}</h5>
                                <div class="text">{!! stripText($about->vision_description) !!} </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="items wow fadeInUp" data-wow-delay="0.2s">
                            <div class="icon">
                                <i class="bi bi-chat"></i>
                            </div>
                            <div class="info">
                                <h5>{{$about->message_title}}</h5>
                                <div class="text">{!! stripText($about->vision_description) !!} </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="items wow fadeInUp" data-wow-delay="0.4s">
                            <div class="icon">
                                <i class="bi bi-bullseye"></i>
                            </div>
                            <div class="info">
                                <h5>{{$about->mission_title}}</h5>
                                <div class="text">{!! stripText($about->mission_description) !!} </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
@endsection

@section('inner_js')

@endsection
