@extends('Layouts.app')
@section('_Titlepage','About')
@section('_aboutpage','active')
@section('_content')

<!--//// swiper css ////-->
    <link rel="stylesheet" href="../../assets/css/swiper-bundle.min.css">
    <link rel="stylesheet" href="../../assets/css/about.css">

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-18">
                <div class="container-xl">
                    <div class="row">
                        <div class="col-12">
                            <div class="unnamed-character-style-30">{{ __('about.About') }}</div>
                            <img src="{{ asset('/images/background/Group 6931.png') }}" alt="gold bar"
                                                    class="logo-gold-bar-2">
                            <div class="unnamed-character-style-31">{{ __('about.Start by applying') }}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-19">
                <div class="container-xl">
                    <div class="unnamed-bg-style-20">
                        <div class="d-grid justify-content-center">
                            <img src="{{ asset('/images/background/Screenshot 2566-10-31 at 11.15 Background Removed.57.png') }}" alt="gold icon"
                            class="logo-gold-bar-3">
                        </div>
                        <div class="d-grid justify-content-center">
                            <div class="unnamed-character-style-32">{{ __('about.Elite Consulting Group (ECG)') }}</div>
                        </div>
                        <div class="d-grid justify-content-center">
                            <div class="unnamed-character-style-33">{{ __('about.Elite Consultancy Group') }}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-22">
                <div class="container-xl">
                    <div class="d-flex justify-content-between align-items-center">
                        <div class="logo-gold-style-1">
                            <div class="unnamed-bg-style-21">
                                <div class="unnamed-character-style-34">{{ __('about.Our Promises') }}</div>
                            </div>
                        </div>
                        <div>
                            <div class="li-line-style-1"></div>
                            <div class="d-flex">
                                <div class="li-style-1"></div>
                                <div class="unnamed-character-style-35">
                                    {{ __('about.Cheapest digital monetary') }}
                                </div>
                            </div>
                            <div class="hr-style-5"></div>
                            <div class="d-flex">
                                <div class="li-style-2"></div>
                                <div class="unnamed-character-style-35">
                                    {{ __('about.Safe and Secure') }}
                                </div>
                            </div>
                            <div class="hr-style-5"></div>
                            <div class="d-flex">
                                <div class="li-style-3"></div>
                                <div class="unnamed-character-style-35">
                                    {{ __('about.Easy and Simple') }}
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-23">
                <div class="container-xl">
                    <div class="d-grid justify-content-center">
                        <div class="unnamed-character-style-36">{{ __('about.A multi-industry') }}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-24 px-0">
                <div class="unnamed-bg-style-25">
                    <div class="px-0">
                        <div class="d-grid justify-content-center mb-style-5">
                            <div class="unnamed-character-style-37">{{ __('about.Roadmap') }}</div>
                            <div class="hr-style-6"></div>
                        </div>
                        <div>
                            <div class="li-line-style-2"></div>
                            <div class="d-flex">
                                <div class="li-style-4 active"></div>
                                <div class="li-style-4"></div>
                                <div class="li-style-4"></div>
                            </div>
                            <div class="d-flex">
                                <div class="box-style-1 ms-style-1">
                                    <div class="unnamed-character-style-38">2020</div>
                                    <div class="unnamed-character-style-39">Q3</div>
                                    <div class="unnamed-character-style-40"> {{ __('about.Initiate partnerships with') }} </div>
                                    <div class="unnamed-character-style-40">{{ __('about.Listing of GoGo') }}</div>
                                </div>
                                <div class="box-style-1 ms-style-2">
                                    <div class="unnamed-character-style-38">2020</div>
                                    <div class="unnamed-character-style-39">Q4</div>
                                    <div class="unnamed-character-style-40"> {{ __('about.SDK/API') }} </div>
                                    <div class="unnamed-character-style-40">{{ __('about.Opening 10 redemption') }}</div>
                                </div>
                                <div class="box-style-1 ms-style-2">
                                    <div class="unnamed-character-style-38">2021</div>
                                    <div class="unnamed-character-style-39">Q1-Q3</div>
                                    <div class="unnamed-character-style-40"> {{ __('about.Complete Series A') }} </div>
                                    <div class="unnamed-character-style-40">{{ __('about.Moving GoldGo tokens') }}</div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-26">
                <div class="bg-white-style-1-3"></div>
                <div class="bg-white-style-1-2"></div>
                <div class="bg-white-style-1-1"></div>
                <div class="container-xl">
                    <div class="d-grid justify-content-center mb-style-6">
                        <div class="unnamed-character-style-41">{{ __('about.The People Behind') }}</div>
                        <div class="d-flex justify-content-center align-items-center">
                            <img src="{{ asset('/images/background/Screenshot 2566-10-31 at 11.15 Background Removed.57.png') }}" alt="gold icon" class="logo-gold-bar-4">
                            <img src="{{ asset('/images/background/Image 3.png') }}" alt="goldgo" class="logo-gold-bar-5">
                        </div>
                        <div class="hr-img-style-1"></div>

                    </div>
                </div>

                <!-- Slider main container -->
                <div class="unnamed-bg-style-27">
                    <div class="swiper ">
                        <!-- Additional required wrapper -->
                        <div class="swiper-wrapper">
                            <!-- Slides -->

                            @foreach ($about_data as $item)
                            {{$count = $item['Director']}}
                            {{$count2 = $item['detail']}}
                            <div class="swiper-slide">
                                <div class="">
                                    <div class="box-style-2">
                                        <div class="unnamed-character-style-42">{{ __('about.people title '.$item["level"]) }} </div>
                                        <div class="unnamed-character-style-43">{{ __('about.people position '.$item["level"]) }}</div>
                                        @for ($i = 1; $i <= $count; $i++)
                                        <div class="unnamed-character-style-44 @if($i == $count) mb-3 @endif">{{ __('about.people detail'.$i.' '.$item["level"]) }}</div>
                                        @endfor
                                        @for ($i = 1; $i <= $count2; $i++)
                                        <div class="unnamed-character-style-45 mb-3">{{ __('about.people detail-f'.$i.' '.$item["level"]) }}</div>
                                        @endfor

                                    </div>
                                    <img src="{{ asset('/images/background/'.$item['img']) }}" alt="image" class="img-people">
                                </div>
                            </div>
                            @endforeach
                        </div>

                        <!-- If we need pagination -->
                        <div class="swiper-pagination ">

                        </div>

                        <!-- If we need navigation buttons -->
                        <div class="swiper-button-prev">
                            <i class='bx bx-arrow-back' style="font-size: 60px;"></i>
                        </div>
                        <div class="swiper-button-next">
                            <i class='bx bx-arrow-back bx-rotate-180' style="font-size: 60px;"></i>
                        </div>

                        <!-- If we need scrollbar -->
                        <div class="swiper-scrollbar"></div>
                    </div>

                </div>


            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-32">
                <div class="container-xl">
                    <div class="d-grid justify-content-center mb-style-5">
                        <div class="unnamed-character-style-48">
                            {{  __('about.Our Team Members')}}
                        </div>
                        <div class="hr-img-style-1"></div>

                    </div>

                    <div class="d-flex justify-content-between">
                        <div class="unnamed-bg-style-29">
                            <div class="logo-team-1"></div>
                            <div class="unnamed-character-style-47">{{  __('about.hr1')}} </div>
                        </div>
                        <div class="unnamed-bg-style-30">
                            <div class="logo-team-2"></div>
                            <div class="unnamed-character-style-47">{{  __('about.Engineer1')}} </div>
                        </div>
                        <div class="unnamed-bg-style-31">
                            <div class="logo-team-3"></div>
                            <div class="unnamed-character-style-47">{{  __('about.Operations1')}} </div>
                        </div>
                    </div>
                    <div class="d-flex justify-content-between">
                        <div class="unnamed-bg-style-29">
                            <div class="logo-team-1"></div>
                            <div class="unnamed-character-style-47">{{  __('about.hr2')}} </div>
                        </div>
                        <div class="unnamed-bg-style-30">
                            <div class="logo-team-2"></div>
                            <div class="unnamed-character-style-47">{{  __('about.Engineer2')}} </div>
                        </div>
                        <div class="unnamed-bg-style-31">
                            <div class="logo-team-3"></div>
                            <div class="unnamed-character-style-47">{{  __('about.Operations2')}} </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>

    <div class="container-fluid bg-white-style-1 px-0">
        <div class="row justify-content-center">
            <div class="unnamed-bg-style-33">
                <div class="d-grid justify-content-center">
                    <div class="unnamed-bg-style-28">
                        <div class="d-grid justify-content-center">
                            <div class="unnamed-character-style-49">
                                {{  __('about.Our Partner')}}
                            </div>
                            <div class="hr-img-style-1"></div>
                        </div>
                        <div class="p-style-2">
                            <div class="d-flex justify-content-between">
                                @for($i=1; $i<7; $i++)
                                <div>
                                    <div class="bg-white-circle-style-1">
                                       <img src="{{ asset('/images/background/Mask Group 13.png') }}" alt="" class="logo-partner-1">
                                    </div>
                                    <div>
                                        {{ __('about.Singapore-Based'.$i) }}
                                    </div>
                                </div>
                                @endfor
                            </div>
                            <div class="d-flex justify-content-between">
                                @for($i=1; $i<7; $i++)
                                <div>
                                    <div class="bg-white-circle-style-1">
                                       <img src="{{ asset('/images/background/Mask Group 13.png') }}" alt="" class="logo-partner-1">
                                    </div>
                                    <div>
                                        {{ __('about.Singapore-Based'.$i) }}
                                    </div>
                                </div>
                                @endfor
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <script src="../../assets/js/swiper-bundle.min.js"></script>
    <script src="../../assets/js/about.js"></script>
@endsection