@extends('landing.master')
@section('title', 'Smart Invest Group – Заедно е попаметно. #СегаМожеме')
@section('meta_title', 'Smart Invest Group – Заедно е попаметно. #СегаМожеме')
@section('keywords', 'заработка, инвестирање, безбеден')
@section('description', 'Паметен, лесен и безбеден начин за инвестирање - Инвестирајте дигитално и добијте загарантирана заработка')
{{-- facebook meta tags --}}
@section('fb_meta_title', 'Smart Invest Group – Заедно е попаметно. #СегаМожеме')
@section('fb_description',  'Паметен, лесен и безбеден начин за инвестирање - Инвестирајте дигитално и добијте загарантирана заработка')
@section('fb_route', URL::current())
@section('fb_type', 'website')
@section('fb_image', Vite::asset('resources/images/homepage/si-group-social.png'))

{{--twitter meta tags --}}
@section('twitter_meta_title',  'Smart Invest Group – Заедно е попаметно. #СегаМожеме')
@section('twitter_description', 'Паметен, лесен и безбеден начин за инвестирање - Инвестирајте дигитално и добијте загарантирана заработка')
@section('twitter_url',  URL::current())

@section('content')
    <div class="w-full overflow-hidden relative block bg-[#F8F8F8]">
        <section class="w-full block pb-10 md:pb-20 pt-20 sm:pt-[90px] xl:pt-[160px]">
            <div class="mx-auto max-w-[1440px] px-5 block">
                <div class="bg-[#F2F2F2] rounded-2xl lg:rounded-[20px] p-5 py-8 lg:px-10 text-center sm:text-left overflow-hidden">
                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="flex flex-col sm:flex-row justify-between items-center -mx-2.5 mb-5 md:mb-8">
                        <div class="px-2.5">
                            <h2 class="text-3xl md:text-4xl xl:text-5xl !leading-[130%] font-bold">{{ __('Успешно завршени проекти') }}</h2>
                        </div>
                        <div class="px-2.5 py-2.5 text-center hidden sm:block w-auto">
                            <div class="relative w-[43px] sm:w-[63px] xl:w-[71px] h-[43px] sm:h-[63px] xl:h-[71px] rounded-full bg-white/50 border border-[#E6E6E6] flex items-center justify-center after:absolute after:content-[''] after:rounded-full after:border after:border-[#ECECEC] after:bg-white after:w-[46px] after:md:w-[54px] after:h-[46px] after:md:h-[54px] after:inset-0 after:m-auto after:shadow-[6.67px_16px_29.33px_rgba(191,191,202,0.25)] shadow-[0px_9.33px_16px_rgba(191,191,202,0.25)]">
                                <svg class="w-[23px] md:w-[23px] h-auto fill-colormain relative z-10" width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M11.4995 21.8019C10.9245 21.8019 10.3591 21.6677 9.89911 21.409L5.3662 18.7927C3.48786 17.5277 3.36328 17.2977 3.36328 15.314V10.5606C3.36328 8.57688 3.48786 8.34688 5.32786 7.11063L9.9087 4.46563C10.8191 3.93854 12.1895 3.93854 13.0999 4.46563L17.6329 7.08188C19.5112 8.34688 19.6358 8.57688 19.6358 10.5606V15.314C19.6358 17.2977 19.5112 17.5277 17.6712 18.764L13.0904 21.409C12.6399 21.6773 12.0649 21.8019 11.4995 21.8019ZM11.4995 5.51021C11.1737 5.51021 10.8479 5.57729 10.6179 5.71146L6.08495 8.32771C4.80078 9.19979 4.80078 9.19979 4.80078 10.5606V15.314C4.80078 16.6748 4.80078 16.6748 6.13286 17.5756L10.6274 20.1631C11.0874 20.4315 11.9212 20.4315 12.3812 20.1631L16.9141 17.5469C18.1983 16.6748 18.1983 16.6748 18.1983 15.314V10.5606C18.1983 9.19979 18.1983 9.19979 16.8662 8.29896L12.3716 5.71146C12.1512 5.57729 11.8254 5.51021 11.4995 5.51021Z"/>
                                    <path d="M16.7712 8.03018C16.3782 8.03018 16.0524 7.70435 16.0524 7.31143V4.79102C16.0524 3.27685 15.4103 2.63477 13.8962 2.63477H9.10449C7.59033 2.63477 6.94824 3.27685 6.94824 4.79102V7.24435C6.94824 7.63727 6.62241 7.9631 6.22949 7.9631C5.83658 7.9631 5.51074 7.64685 5.51074 7.24435V4.79102C5.51074 2.47185 6.78533 1.19727 9.10449 1.19727H13.8962C16.2153 1.19727 17.4899 2.47185 17.4899 4.79102V7.31143C17.4899 7.70435 17.1641 8.03018 16.7712 8.03018Z"/>
                                    <path d="M13.0624 16.8956C12.8611 16.8956 12.6503 16.8573 12.4395 16.7711L11.5003 16.4069L10.5611 16.7807C10.0532 16.9819 9.53573 16.934 9.15239 16.6561C8.76906 16.3781 8.56781 15.899 8.59656 15.3527L8.65406 14.3465L8.01198 13.5702C7.66698 13.139 7.55198 12.6407 7.70531 12.1807C7.84906 11.7302 8.24198 11.3852 8.76906 11.2511L9.74656 11.0019L10.2928 10.149C10.8774 9.22898 12.1328 9.22898 12.7174 10.149L13.2636 11.0019L14.2411 11.2511C14.7682 11.3852 15.1611 11.7302 15.3049 12.1807C15.4486 12.6311 15.3336 13.139 14.9886 13.5607L14.3466 14.3369L14.4041 15.3432C14.4328 15.8894 14.2316 16.359 13.8482 16.6465C13.6182 16.8094 13.3499 16.8956 13.0624 16.8956ZM9.12364 12.6502L9.76573 13.4265C9.98614 13.6852 10.1107 14.0973 10.0916 14.4327L10.0341 15.439L10.9732 15.0652C11.2895 14.9407 11.7111 14.9407 12.0274 15.0652L12.9666 15.439L12.9091 14.4327C12.8899 14.0973 13.0145 13.6948 13.2349 13.4265L13.877 12.6502L12.8995 12.4011C12.5736 12.3148 12.2286 12.0657 12.0466 11.7877L11.5099 10.9444L10.9636 11.7877C10.7816 12.0752 10.4366 12.3244 10.1107 12.4107L9.12364 12.6502Z"/>
                                </svg>
                            </div>
                        </div>
                    </div>

                    <div class="flex flex-col gap-5 lg:gap-[65px]">
                        @foreach($finished_projects as $finished_project)
                            @if ($loop->iteration % 2 != 0)
                                <div class="flex flex-row flex-wrap items-stretch lg:-mx-4">
                                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="w-full lg:w-1/2 lg:px-4 h-[73vw] sm:h-[60vw] lg:h-auto rounded-2xl lg:rounded-[20px] mb-3 lg:mb-0">
                                        <div class="relative w-full h-full">
                                            <div class="absolute text-[10px] sm:text-sm font-bold bg-bgdark shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] left-4 lg:left-6 top-4 lg:top-10 text-white sm:py-3 p-2.5 !leading-tight max-w-[104px] h-[50px] sm:max-w-[140px] sm:h-[58px] overflow-hidden rounded-[10px] z-20">
                                                <div class="relative h-full flex items-center">
                                                    <p>{{ __('Вкупна заработка') }} <span class="text-coloryellow">{!! $finished_project->procenton !!}%*</span></p>
                                                    <svg class="w-full absolute top-0 right-0 left-0 bottom-0" width="104" height="46" viewBox="0 0 104 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path opacity="0.07" d="M107 45.8135C106.832 53.5518 104.261 60.1225 98.8863 65.5071C94.4271 69.973 89.9478 74.4197 85.4482 78.8474C83.4429 80.8253 81.0373 81.4875 78.3405 80.6366C75.7481 79.8178 74.1466 77.9864 73.6301 75.3143C73.1894 73.0247 73.7513 70.9238 75.405 69.2609C79.8596 64.7877 84.3901 60.3937 88.8532 55.9206C92.7981 51.9596 94.117 47.1967 92.4381 41.866C90.771 36.574 87.0144 33.3729 81.5318 32.4581C76.8719 31.6797 72.8445 33.1539 69.5136 36.4814C60.9692 45.0065 52.5561 53.6545 43.8974 62.0583C36.0714 69.6602 26.6388 71.9279 16.2826 68.6611C5.92647 65.3942 -0.462854 58.0569 -2.47319 47.3399C-4.23791 37.932 -1.53784 29.6579 5.15767 22.8227C11.9289 15.9049 18.8128 9.09997 25.6631 2.2681C29.0933 -1.15542 34.3454 -0.629762 36.7662 3.34805C37.5701 4.68022 37.9029 6.24461 37.7109 7.78925C37.519 9.33389 36.8135 10.7689 35.708 11.863C28.8118 18.773 21.9138 25.6835 15.0142 32.5945C9.53162 38.1089 9.51816 46.7586 14.9519 52.1635C17.5196 54.7109 20.9893 56.1375 24.6036 56.1318C28.2178 56.1261 31.6831 54.6886 34.2427 52.1332C42.6295 43.7361 51.0129 35.3357 59.3929 26.9319C63.7131 22.5834 68.8138 19.8338 74.87 18.7505C88.8397 16.2519 103.011 25.5622 106.181 39.4079C106.448 40.5872 106.655 41.7666 106.812 42.9662C106.933 43.9636 106.946 44.9778 107 45.8135Z" fill="#A3A3A3"/>
                                                    </svg>
                                                </div>
                                            </div>
                                            <picture>
                                                <img src="{{ $finished_project->picture }}" alt="{!! $finished_project->name !!}" width="357" height="253" class="object-cover object-center w-full h-full rounded-2xl lg:rounded-[20px] relative z-10">
                                            </picture>
                                            <div class="absolute text-[10px] sm:text-base  font-bold bg-white/60 shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] backdrop-blur-[6px] left-4 lg:left-9 right-4 lg:right-9 bottom-4 lg:bottom-11 text-bgdark rounded-[5px] z-10 py-1 px-2 sm:py-3 sm:px-2 lg:px-12 !leading-tight">
                                                * {{ __('Максимална заработка доколку средствата се вложат на или пред денот на започнување на проектот') }}.
                                            </div>
                                        </div>
                                    </div>
                                    <div class="w-full lg:w-1/2 lg:px-4 mb-5 sm:mb-10 lg:mb-0">
                                        <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="bg-white rounded-2xl lg:rounded-[20px] p-4 lg:p-10 xl:px-22 xl:py-30 h-full">
                                            <div class="h-full lg:max-w-[450px] flex flex-col justify-center mx-auto">
                                                <div class="mb-4 md:mb-7">
                                                    @guest
                                                        @if(session()->has('locale'))
                                                            @if(session('locale') == 'mk')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $finished_project->name !!}</p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $finished_project->description !!}</div>
                                                            @endif

                                                            @if(session('locale') == 'en')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($finished_project->name_eng != null)
                                                                        {!! $finished_project->name_eng !!}
                                                                    @else
                                                                        {!! $finished_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($finished_project->description_eng != null)
                                                                        {!! $finished_project->description_eng !!}
                                                                    @else
                                                                        {!! $finished_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif

                                                            @if(session('locale') == 'al')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($finished_project->name_alb != null)
                                                                        {!! $finished_project->name_alb !!}
                                                                    @else
                                                                        {!! $finished_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($finished_project->description_alb != null)
                                                                        {!! $finished_project->description_alb !!}
                                                                    @else
                                                                        {!! $finished_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif
                                                        @else
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $finished_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $finished_project->description !!}</div>
                                                        @endif
                                                    @else
                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "mk")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $finished_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $finished_project->description !!}</div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "en")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($finished_project->name_eng != null)
                                                                    {!! $finished_project->name_eng !!}
                                                                @else
                                                                    {!! $finished_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($finished_project->description_eng != null)
                                                                    {!! $finished_project->description_eng !!}
                                                                @else
                                                                    {!! $finished_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "al")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($finished_project->name_alb != null)
                                                                    {!! $finished_project->name_alb !!}
                                                                @else
                                                                    {!! $finished_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($finished_project->description_alb != null)
                                                                    {!! $finished_project->description_alb !!}
                                                                @else
                                                                    {!! $finished_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif
                                                    @endguest
                                                </div>
                                                <div class="bg-neutral-100 text-neutral-500 rounded-[10px] mb-4">
                                                    <div class="flex flex-col sm:flex-row flex-wrap justify-between -mx-[5px] p-2.5">
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Почеток на градба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $finished_project->start_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Завршување на проектот') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $finished_project->end_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Рок на изградба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ $finished_project->return_of_investment }} {{ __('месеци') }}.</p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <p class="mb-4 text-base sm:text-lg uppercase text-bgdark font-bold">{{ __('МОЖНОСТ ЗА ИНВЕСТИРАЊЕ ДО') }} <span class="text-blucolormain">{!! number_format($finished_project->investment_opportunity, 0, '.', ',') !!} {{ __('ЕВРА') }}</span></p>
                                                <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                 
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @else
                                <div class="flex flex-row flex-wrap items-stretch lg:-mx-4"> 
                                    <div class="w-full lg:w-1/2 lg:px-4 mb-5 sm:mb-10 lg:mb-0 order-last lg:order-first">
                                        <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="bg-white rounded-2xl lg:rounded-[20px] p-4 lg:p-10 xl:px-22 xl:py-30 h-full">
                                            <div class="h-full lg:max-w-[450px] flex flex-col justify-center mx-auto">
                                                <div class="mb-4 md:mb-7">
                                                    @guest
                                                        @if(session()->has('locale'))
                                                            @if(session('locale') == 'mk')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $finished_project->name !!}</p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $finished_project->description !!}</div>
                                                            @endif

                                                            @if(session('locale') == 'en')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($finished_project->name_eng != null)
                                                                        {!! $finished_project->name_eng !!}
                                                                    @else
                                                                        {!! $finished_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($finished_project->description_eng != null)
                                                                        {!! $finished_project->description_eng !!}
                                                                    @else
                                                                        {!! $finished_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif

                                                            @if(session('locale') == 'al')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($finished_project->name_alb != null)
                                                                        {!! $finished_project->name_alb !!}
                                                                    @else
                                                                        {!! $finished_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($finished_project->description_alb != null)
                                                                        {!! $finished_project->description_alb !!}
                                                                    @else
                                                                        {!! $finished_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif
                                                        @else
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $finished_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $finished_project->description !!}</div>
                                                        @endif
                                                    @else
                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "mk")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $finished_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $finished_project->description !!}</div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "en")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($finished_project->name_eng != null)
                                                                    {!! $finished_project->name_eng !!}
                                                                @else
                                                                    {!! $finished_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($finished_project->description_eng != null)
                                                                    {!! $finished_project->description_eng !!}
                                                                @else
                                                                    {!! $finished_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "al")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($finished_project->name_alb != null)
                                                                    {!! $finished_project->name_alb !!}
                                                                @else
                                                                    {!! $finished_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($finished_project->description_alb != null)
                                                                    {!! $finished_project->description_alb !!}
                                                                @else
                                                                    {!! $finished_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif
                                                    @endguest
                                                </div>
                                                <div class="bg-neutral-100 text-neutral-500 rounded-[10px] mb-4">
                                                    <div class="flex flex-col sm:flex-row flex-wrap justify-between -mx-[5px] p-2.5">
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Почеток на градба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $finished_project->start_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Завршување на проектот') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $finished_project->end_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Рок на изградба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ $finished_project->return_of_investment }} {{ __('месеци') }}.</p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <p class="mb-4 text-base sm:text-lg uppercase text-bgdark font-bold">{{ __('МОЖНОСТ ЗА ИНВЕСТИРАЊЕ ДО') }} <span class="text-blucolormain">{!! number_format($finished_project->investment_opportunity, 0, '.', ',') !!} {{ __('ЕВРА') }}</span></p>
                                                <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="w-full lg:w-1/2 lg:px-4 h-[73vw] sm:h-[60vw] lg:h-auto rounded-2xl lg:rounded-[20px] mb-3 lg:mb-0">
                                        <div class="relative w-full h-full">
                                            <div class="absolute text-[10px] sm:text-sm font-bold bg-bgdark shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] left-4 lg:left-6 top-4 lg:top-10 text-white sm:py-3 p-2.5 !leading-tight max-w-[104px] h-[50px] sm:max-w-[140px] sm:h-[58px] overflow-hidden rounded-[10px] z-20">
                                                <div class="relative h-full flex items-center">
                                                    <p>{{ __('Вкупна заработка') }} <span class="text-coloryellow">{!! $finished_project->procenton !!}%*</span></p>
                                                    <svg class="w-full absolute top-0 right-0 left-0 bottom-0" width="104" height="46" viewBox="0 0 104 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path opacity="0.07" d="M107 45.8135C106.832 53.5518 104.261 60.1225 98.8863 65.5071C94.4271 69.973 89.9478 74.4197 85.4482 78.8474C83.4429 80.8253 81.0373 81.4875 78.3405 80.6366C75.7481 79.8178 74.1466 77.9864 73.6301 75.3143C73.1894 73.0247 73.7513 70.9238 75.405 69.2609C79.8596 64.7877 84.3901 60.3937 88.8532 55.9206C92.7981 51.9596 94.117 47.1967 92.4381 41.866C90.771 36.574 87.0144 33.3729 81.5318 32.4581C76.8719 31.6797 72.8445 33.1539 69.5136 36.4814C60.9692 45.0065 52.5561 53.6545 43.8974 62.0583C36.0714 69.6602 26.6388 71.9279 16.2826 68.6611C5.92647 65.3942 -0.462854 58.0569 -2.47319 47.3399C-4.23791 37.932 -1.53784 29.6579 5.15767 22.8227C11.9289 15.9049 18.8128 9.09997 25.6631 2.2681C29.0933 -1.15542 34.3454 -0.629762 36.7662 3.34805C37.5701 4.68022 37.9029 6.24461 37.7109 7.78925C37.519 9.33389 36.8135 10.7689 35.708 11.863C28.8118 18.773 21.9138 25.6835 15.0142 32.5945C9.53162 38.1089 9.51816 46.7586 14.9519 52.1635C17.5196 54.7109 20.9893 56.1375 24.6036 56.1318C28.2178 56.1261 31.6831 54.6886 34.2427 52.1332C42.6295 43.7361 51.0129 35.3357 59.3929 26.9319C63.7131 22.5834 68.8138 19.8338 74.87 18.7505C88.8397 16.2519 103.011 25.5622 106.181 39.4079C106.448 40.5872 106.655 41.7666 106.812 42.9662C106.933 43.9636 106.946 44.9778 107 45.8135Z" fill="#A3A3A3"/>
                                                    </svg>
                                                </div>
                                            </div>
                                            <picture>
                                                <img src="{!! $finished_project->picture !!}" alt="{{ $finished_project->name }}" width="357" height="253" class="object-cover object-center w-full h-full rounded-2xl lg:rounded-[20px] relative z-10">
                                            </picture>
                                            <div class="absolute text-[10px] sm:text-base  font-bold bg-white/60 shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] backdrop-blur-[6px] left-4 lg:left-9 right-4 lg:right-9 bottom-4 lg:bottom-11 text-bgdark rounded-[5px] z-10 py-1 px-2 sm:py-3 sm:px-2 lg:px-12 !leading-tight">
                                                * {{ __('Максимална заработка доколку средствата се вложат на или пред денот на започнување на проектот') }}.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endif
                        @endforeach
                        

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

        <section class="w-full block py-10 md:py-20">
            <div class="mx-auto max-w-[1440px] px-5 block">
                <div class="bg-[#F2F2F2] rounded-2xl lg:rounded-[20px] p-5 py-8 lg:px-10 text-center sm:text-left overflow-hidden">
                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="flex flex-col sm:flex-row justify-between items-center -mx-2.5 mb-5 md:mb-8">
                        <div class="px-2.5">
                            <h2 class="text-3xl md:text-4xl xl:text-5xl !leading-[130%] font-bold">{{ __('Тековни проекти за инвестирање') }}</h2>

                        </div>
                        <div class="px-2.5 py-2.5 text-center hidden sm:block w-auto">
                            <div class="relative w-[43px] sm:w-[63px] xl:w-[71px] h-[43px] sm:h-[63px] xl:h-[71px] rounded-full bg-white/50 border border-[#E6E6E6] flex items-center justify-center after:absolute after:content-[''] after:rounded-full after:border after:border-[#ECECEC] after:bg-white after:w-[46px] after:md:w-[54px] after:h-[46px] after:md:h-[54px] after:inset-0 after:m-auto after:shadow-[6.67px_16px_29.33px_rgba(191,191,202,0.25)] shadow-[0px_9.33px_16px_rgba(191,191,202,0.25)]">
                                <svg class="w-[23px] md:w-[23px] h-auto fill-colormain relative z-10" width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M12.4587 21.8014H4.79199C2.47283 21.8014 1.19824 20.5269 1.19824 18.2077V10.541C1.19824 8.22185 2.47283 6.94727 4.79199 6.94727H9.58366C9.97657 6.94727 10.3024 7.2731 10.3024 7.66602V18.2077C10.3024 19.7219 10.9445 20.3639 12.4587 20.3639C12.8516 20.3639 13.1774 20.6898 13.1774 21.0827C13.1774 21.4756 12.8516 21.8014 12.4587 21.8014ZM4.79199 8.38477C3.27783 8.38477 2.63574 9.02685 2.63574 10.541V18.2077C2.63574 19.7219 3.27783 20.3639 4.79199 20.3639H9.39198C9.04698 19.7985 8.86491 19.0798 8.86491 18.2077V8.38477H4.79199Z"/>
                                    <path d="M9.58366 8.38607H4.79199C4.39908 8.38607 4.07324 8.06023 4.07324 7.66732V5.75065C4.07324 4.29398 5.25199 3.11523 6.70866 3.11523H9.68906C9.90948 3.11523 10.1203 3.22063 10.2545 3.39313C10.3887 3.57521 10.4366 3.80524 10.3791 4.01607C10.3216 4.2269 10.3024 4.46648 10.3024 4.79232V7.66732C10.3024 8.06023 9.97658 8.38607 9.58366 8.38607ZM5.51074 6.94857H8.86491V4.79232C8.86491 4.70607 8.86491 4.6294 8.86491 4.55273H6.70866C6.04741 4.55273 5.51074 5.0894 5.51074 5.75065V6.94857Z"/>
                                    <path d="M13.417 13.1764C13.0241 13.1764 12.6982 12.8506 12.6982 12.4577V7.66602C12.6982 7.2731 13.0241 6.94727 13.417 6.94727C13.8099 6.94727 14.1357 7.2731 14.1357 7.66602V12.4577C14.1357 12.8506 13.8099 13.1764 13.417 13.1764Z"/>
                                    <path d="M17.25 13.1764C16.8571 13.1764 16.5312 12.8506 16.5312 12.4577V7.66602C16.5312 7.2731 16.8571 6.94727 17.25 6.94727C17.6429 6.94727 17.9687 7.2731 17.9687 7.66602V12.4577C17.9687 12.8506 17.6429 13.1764 17.25 13.1764Z"/>
                                    <path d="M17.2503 21.8014H13.417C13.0241 21.8014 12.6982 21.4756 12.6982 21.0827V17.2493C12.6982 16.3293 13.4553 15.5723 14.3753 15.5723H16.292C17.212 15.5723 17.9691 16.3293 17.9691 17.2493V21.0827C17.9691 21.4756 17.6432 21.8014 17.2503 21.8014ZM14.1357 20.3639H16.5316V17.2493C16.5316 17.1152 16.4262 17.0098 16.292 17.0098H14.3753C14.2412 17.0098 14.1357 17.1152 14.1357 17.2493V20.3639Z"/>
                                    <path d="M5.75 17.0111C5.35708 17.0111 5.03125 16.6852 5.03125 16.2923V12.459C5.03125 12.0661 5.35708 11.7402 5.75 11.7402C6.14292 11.7402 6.46875 12.0661 6.46875 12.459V16.2923C6.46875 16.6852 6.14292 17.0111 5.75 17.0111Z"/>
                                    <path d="M18.208 21.8014H12.458C10.1388 21.8014 8.86426 20.5268 8.86426 18.2077V4.79102C8.86426 2.47185 10.1388 1.19727 12.458 1.19727H18.208C20.5272 1.19727 21.8018 2.47185 21.8018 4.79102V18.2077C21.8018 20.5268 20.5272 21.8014 18.208 21.8014ZM12.458 2.63477C10.9438 2.63477 10.3018 3.27685 10.3018 4.79102V18.2077C10.3018 19.7218 10.9438 20.3639 12.458 20.3639H18.208C19.7222 20.3639 20.3643 19.7218 20.3643 18.2077V4.79102C20.3643 3.27685 19.7222 2.63477 18.208 2.63477H12.458Z"/>
                                </svg>
                            </div>
                        </div>
                    </div>
                    <div class="flex flex-col gap-5 lg:gap-[65px]">

                        @foreach($ongoing_projects as $ongoing_project)
                            @if ($loop->iteration % 2 != 0)
                                <div class="flex flex-row flex-wrap items-stretch lg:-mx-4">
                                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="w-full lg:w-1/2 lg:px-4 h-[73vw] sm:h-[60vw] lg:h-auto rounded-2xl lg:rounded-[20px] mb-3 lg:mb-0">
                                        <div class="relative w-full h-full">
                                            <div class="absolute text-[10px] sm:text-sm font-bold bg-bgdark shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] left-4 lg:left-6 top-4 lg:top-10 text-white sm:py-3 p-2.5 !leading-tight max-w-[104px] h-[50px] sm:max-w-[140px] sm:h-[58px] overflow-hidden rounded-[10px] z-20">
                                                <div class="relative h-full flex items-center">
                                                    <p>{{ __('Вкупна заработка') }} <span class="text-coloryellow">{!! $ongoing_project->procenton !!}%*</span></p>
                                                    <svg class="w-full absolute top-0 right-0 left-0 bottom-0" width="104" height="46" viewBox="0 0 104 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path opacity="0.07" d="M107 45.8135C106.832 53.5518 104.261 60.1225 98.8863 65.5071C94.4271 69.973 89.9478 74.4197 85.4482 78.8474C83.4429 80.8253 81.0373 81.4875 78.3405 80.6366C75.7481 79.8178 74.1466 77.9864 73.6301 75.3143C73.1894 73.0247 73.7513 70.9238 75.405 69.2609C79.8596 64.7877 84.3901 60.3937 88.8532 55.9206C92.7981 51.9596 94.117 47.1967 92.4381 41.866C90.771 36.574 87.0144 33.3729 81.5318 32.4581C76.8719 31.6797 72.8445 33.1539 69.5136 36.4814C60.9692 45.0065 52.5561 53.6545 43.8974 62.0583C36.0714 69.6602 26.6388 71.9279 16.2826 68.6611C5.92647 65.3942 -0.462854 58.0569 -2.47319 47.3399C-4.23791 37.932 -1.53784 29.6579 5.15767 22.8227C11.9289 15.9049 18.8128 9.09997 25.6631 2.2681C29.0933 -1.15542 34.3454 -0.629762 36.7662 3.34805C37.5701 4.68022 37.9029 6.24461 37.7109 7.78925C37.519 9.33389 36.8135 10.7689 35.708 11.863C28.8118 18.773 21.9138 25.6835 15.0142 32.5945C9.53162 38.1089 9.51816 46.7586 14.9519 52.1635C17.5196 54.7109 20.9893 56.1375 24.6036 56.1318C28.2178 56.1261 31.6831 54.6886 34.2427 52.1332C42.6295 43.7361 51.0129 35.3357 59.3929 26.9319C63.7131 22.5834 68.8138 19.8338 74.87 18.7505C88.8397 16.2519 103.011 25.5622 106.181 39.4079C106.448 40.5872 106.655 41.7666 106.812 42.9662C106.933 43.9636 106.946 44.9778 107 45.8135Z" fill="#A3A3A3"/>
                                                    </svg>
                                                </div>
                                            </div>
                                            <picture>
                                                <img src="{!! $ongoing_project->picture !!}" alt="{!! $ongoing_project->name !!}" width="357" height="253" class="object-cover object-center w-full h-full rounded-2xl lg:rounded-[20px] relative z-10">
                                            </picture>
                                            <div class="absolute text-[10px] sm:text-base  font-bold bg-white/60 shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] backdrop-blur-[6px] left-4 lg:left-9 right-4 lg:right-9 bottom-4 lg:bottom-11 text-bgdark rounded-[5px] z-10 py-1 px-2 sm:py-3 sm:px-2 lg:px-12 !leading-tight">
                                                * {{ __('Максимална заработка доколку средствата се вложат на или пред денот на започнување на проектот') }}.
                                            </div>
                                        </div>
                                    </div>
                                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="w-full lg:w-1/2 lg:px-4 mb-5 sm:mb-10 lg:mb-0">
                                        <div class="bg-white rounded-2xl lg:rounded-[20px] p-4 lg:p-10 xl:px-22 xl:py-30 h-full">
                                            <div class="h-full lg:max-w-[450px] flex flex-col justify-center mx-auto">
                                                <div class="mb-4 md:mb-7">
                                                    @guest
                                                        @if(session()->has('locale'))
                                                            @if(session('locale') == 'mk')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $ongoing_project->name !!}</p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $ongoing_project->description !!}</div>
                                                            @endif

                                                            @if(session('locale') == 'en')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($ongoing_project->name_eng != null)
                                                                        {!! $ongoing_project->name_eng !!}
                                                                    @else
                                                                        {!! $ongoing_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($ongoing_project->description_eng != null)
                                                                        {!! $ongoing_project->description_eng !!}
                                                                    @else
                                                                        {!! $ongoing_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif

                                                            @if(session('locale') == 'al')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($ongoing_project->name_alb != null)
                                                                        {!! $ongoing_project->name_alb !!}
                                                                    @else
                                                                        {!! $ongoing_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($ongoing_project->description_alb != null)
                                                                        {!! $ongoing_project->description_alb !!}
                                                                    @else
                                                                        {!! $ongoing_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif
                                                        @else
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $ongoing_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $ongoing_project->description !!}</div>
                                                        @endif
                                                    @else
                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "mk")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $ongoing_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $ongoing_project->description !!}</div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "en")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($ongoing_project->name_eng != null)
                                                                    {!! $ongoing_project->name_eng !!}
                                                                @else
                                                                    {!! $ongoing_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($ongoing_project->description_eng != null)
                                                                    {!! $ongoing_project->description_eng !!}
                                                                @else
                                                                    {!! $ongoing_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "al")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($ongoing_project->name_alb != null)
                                                                    {!! $ongoing_project->name_alb !!}
                                                                @else
                                                                    {!! $ongoing_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($ongoing_project->description_alb != null)
                                                                    {!! $ongoing_project->description_alb !!}
                                                                @else
                                                                    {!! $ongoing_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif
                                                    @endguest
                                                </div>
                                                <div class="bg-neutral-100 text-neutral-500 rounded-[10px] mb-4">
                                                    <div class="flex flex-col sm:flex-row flex-wrap justify-between -mx-[5px] p-2.5">
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Почеток на градба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $ongoing_project->start_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Завршување на проектот') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $ongoing_project->end_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Рок на изградба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ $ongoing_project->return_of_investment }} {{ __('месеци') }}</p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <p class="mb-4 text-base sm:text-lg uppercase text-bgdark font-bold">{{ __('МОЖНОСТ ЗА ИНВЕСТИРАЊЕ ДО') }} <span class="text-blucolormain">{!! number_format($ongoing_project->investment_opportunity, 0, '.', ',') !!} {{ __('ЕВРА') }}</span></p>

                                                @guest
                                                    <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                                        <div class="p-[2px] w-full sm:w-auto">   
                                                            <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'ednokratna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ') }}</a>
                                                        </div>
                                                        <div class="p-[2px] w-full sm:w-auto">   
                                                            <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'mesecna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ НА РАТИ') }}</a>
                                                        </div>
                                                    </div>
                                                @else
                                                    @if(auth()->user()->getRoleNames()->implode(', ') == "" || auth()->user()->getRoleNames()->implode(', ') == null)
                                                        <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'ednokratna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ') }}</a>
                                                            </div>
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'mesecna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ НА РАТИ') }}</a>
                                                            </div>
                                                        </div>
                                                    @else
                                                        <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <button disabled class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ') }}</button>
                                                            </div>
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <button disabled class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ НА РАТИ') }}</button>
                                                            </div>
                                                        </div>
                                                    @endif
                                                @endguest


                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @else
                                <div class="flex flex-row flex-wrap items-stretch lg:-mx-4"> 
                                    <div class="w-full lg:w-1/2 lg:px-4 mb-5 sm:mb-10 lg:mb-0 order-last lg:order-first">
                                        <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="bg-white rounded-2xl lg:rounded-[20px] p-4 lg:p-10 xl:px-22 xl:py-30 h-full">
                                            <div class="h-full lg:max-w-[450px] flex flex-col justify-center mx-auto">
                                                <div class="mb-4 md:mb-7">
                                                    @guest
                                                        @if(session()->has('locale'))
                                                            @if(session('locale') == 'mk')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $ongoing_project->name !!}</p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $ongoing_project->description !!}</div>
                                                            @endif

                                                            @if(session('locale') == 'en')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($ongoing_project->name_eng != null)
                                                                        {!! $ongoing_project->name_eng !!}
                                                                    @else
                                                                        {!! $ongoing_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($ongoing_project->description_eng != null)
                                                                        {!! $ongoing_project->description_eng !!}
                                                                    @else
                                                                        {!! $ongoing_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif

                                                            @if(session('locale') == 'al')
                                                                <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                    @if($ongoing_project->name_alb != null)
                                                                        {!! $ongoing_project->name_alb !!}
                                                                    @else
                                                                        {!! $ongoing_project->name !!}
                                                                    @endif
                                                                </p>
                                                                <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                    @if($ongoing_project->description_alb != null)
                                                                        {!! $ongoing_project->description_alb !!}
                                                                    @else
                                                                        {!! $ongoing_project->description !!}
                                                                    @endif
                                                                </div>
                                                            @endif
                                                        @else
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $ongoing_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $ongoing_project->description !!}</div>
                                                        @endif
                                                    @else
                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "mk")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">{!! $ongoing_project->name !!}</p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">{!! $ongoing_project->description !!}</div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "en")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($ongoing_project->name_eng != null)
                                                                    {!! $ongoing_project->name_eng !!}
                                                                @else
                                                                    {!! $ongoing_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($ongoing_project->description_eng != null)
                                                                    {!! $ongoing_project->description_eng !!}
                                                                @else
                                                                    {!! $ongoing_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif

                                                        @if(\App\Models\User::where('id', Auth::user()->id)->first()->lang == "al")
                                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">
                                                                @if($ongoing_project->name_alb != null)
                                                                    {!! $ongoing_project->name_alb !!}
                                                                @else
                                                                    {!! $ongoing_project->name !!}
                                                                @endif
                                                            </p>
                                                            <div class="text-base sm:text-lg !leading-tight text-neutral-500">
                                                                @if($ongoing_project->description_alb != null)
                                                                    {!! $ongoing_project->description_alb !!}
                                                                @else
                                                                    {!! $ongoing_project->description !!}
                                                                @endif
                                                            </div>
                                                        @endif
                                                    @endguest
                                                </div>
                                                <div class="bg-neutral-100 text-neutral-500 rounded-[10px] mb-4">
                                                    <div class="flex flex-col sm:flex-row flex-wrap justify-between -mx-[5px] p-2.5">
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Почеток на градба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $ongoing_project->start_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Завршување на проектот') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $ongoing_project->end_date)->format('d/m/Y') }}</p>
                                                        </div>
                                                        <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                            <p class="">{{ __('Рок на изградба') }}</p>
                                                            <p class="text-bgdark font-bold text-base">{{ $ongoing_project->return_of_investment }} {{ __('месеци') }}</p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <p class="mb-4 text-base sm:text-lg uppercase text-bgdark font-bold">{{ __('МОЖНОСТ ЗА ИНВЕСТИРАЊЕ ДО') }} <span class="text-blucolormain">{!! number_format($ongoing_project->investment_opportunity, 0, '.', ',') !!} {{ __('ЕВРА') }}</span></p>
                                                @guest
                                                    <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                                        <div class="p-[2px] w-full sm:w-auto">   
                                                            <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'ednokratna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ') }}</a>
                                                        </div>
                                                        <div class="p-[2px] w-full sm:w-auto">   
                                                            <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'mesecna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ НА РАТИ') }}</a>
                                                        </div>
                                                    </div>
                                                @else
                                                    @if(auth()->user()->getRoleNames()->implode(', ') == "" || auth()->user()->getRoleNames()->implode(', ') == null)
                                                        <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'ednokratna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ') }}</a>
                                                            </div>
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <a href="{{ route('invest.page.index', ['project_slug' => $ongoing_project->slug, 'tipUplata' => 'mesecna']) }}" target="_blank" class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ НА РАТИ') }}</a>
                                                            </div>
                                                        </div>
                                                    @else
                                                        <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <button disabled class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ') }}</button>
                                                            </div>
                                                            <div class="p-[2px] w-full sm:w-auto">   
                                                                <button disabled class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">{{ __('ИНВЕСТИРАЈ НА РАТИ') }}</button>
                                                            </div>
                                                        </div>
                                                    @endif
                                                @endguest
                                            </div>
                                        </div>
                                    </div>
                                    <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="w-full lg:w-1/2 lg:px-4 h-[73vw] sm:h-[60vw] lg:h-auto rounded-2xl lg:rounded-[20px] mb-3 lg:mb-0">
                                        <div class="relative w-full h-full">
                                            <div class="absolute text-[10px] sm:text-sm font-bold bg-bgdark shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] left-4 lg:left-6 top-4 lg:top-10 text-white sm:py-3 p-2.5 !leading-tight max-w-[104px] h-[50px] sm:max-w-[140px] sm:h-[58px] overflow-hidden rounded-[10px] z-20">
                                                <div class="relative h-full flex items-center">
                                                    <p>{{ __('Вкупна заработка') }} <span class="text-coloryellow">{!! $ongoing_project->procenton !!}%*</span></p>
                                                    <svg class="w-full absolute top-0 right-0 left-0 bottom-0" width="104" height="46" viewBox="0 0 104 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                        <path opacity="0.07" d="M107 45.8135C106.832 53.5518 104.261 60.1225 98.8863 65.5071C94.4271 69.973 89.9478 74.4197 85.4482 78.8474C83.4429 80.8253 81.0373 81.4875 78.3405 80.6366C75.7481 79.8178 74.1466 77.9864 73.6301 75.3143C73.1894 73.0247 73.7513 70.9238 75.405 69.2609C79.8596 64.7877 84.3901 60.3937 88.8532 55.9206C92.7981 51.9596 94.117 47.1967 92.4381 41.866C90.771 36.574 87.0144 33.3729 81.5318 32.4581C76.8719 31.6797 72.8445 33.1539 69.5136 36.4814C60.9692 45.0065 52.5561 53.6545 43.8974 62.0583C36.0714 69.6602 26.6388 71.9279 16.2826 68.6611C5.92647 65.3942 -0.462854 58.0569 -2.47319 47.3399C-4.23791 37.932 -1.53784 29.6579 5.15767 22.8227C11.9289 15.9049 18.8128 9.09997 25.6631 2.2681C29.0933 -1.15542 34.3454 -0.629762 36.7662 3.34805C37.5701 4.68022 37.9029 6.24461 37.7109 7.78925C37.519 9.33389 36.8135 10.7689 35.708 11.863C28.8118 18.773 21.9138 25.6835 15.0142 32.5945C9.53162 38.1089 9.51816 46.7586 14.9519 52.1635C17.5196 54.7109 20.9893 56.1375 24.6036 56.1318C28.2178 56.1261 31.6831 54.6886 34.2427 52.1332C42.6295 43.7361 51.0129 35.3357 59.3929 26.9319C63.7131 22.5834 68.8138 19.8338 74.87 18.7505C88.8397 16.2519 103.011 25.5622 106.181 39.4079C106.448 40.5872 106.655 41.7666 106.812 42.9662C106.933 43.9636 106.946 44.9778 107 45.8135Z" fill="#A3A3A3"/>
                                                    </svg>
                                                </div>
                                            </div>
                                            <picture>
                                                <img src="{!! $ongoing_project->picture !!}" alt="{!! $ongoing_project->name !!}" width="357" height="253" class="object-cover object-center w-full h-full rounded-2xl lg:rounded-[20px] relative z-10">
                                            </picture>
                                            <div class="absolute text-[10px] sm:text-base  font-bold bg-white/60 shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] backdrop-blur-[6px] left-4 lg:left-9 right-4 lg:right-9 bottom-4 lg:bottom-11 text-bgdark rounded-[5px] z-10 py-1 px-2 sm:py-3 sm:px-2 lg:px-12 !leading-tight">
                                                * {{ __('Максимална заработка доколку средствата се вложат на или пред денот на започнување на проектот') }}.

                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endif
                        @endforeach
                    </div>
                </div>
            </div>
        </section>

        <section class="w-full block py-10 md:py-20">
            <div class="mx-auto max-w-[1440px] px-5 block">
                <div class="bg-red-50 rounded-2xl lg:rounded-[20px] p-5 py-8 lg:px-10 text-center sm:text-left relative overflow-hidden">
                    <div class="absolute rounded-2xl lg:rounded-[20px] top-0 left-0 right-0 bottom-0 h-full w-full flex items-center justify-center z-10 bg-white/17 backdrop-blur-[15px] md:backdrop-blur-[20px] uppercase text-[#222222] font-medium text-5xl md:text-6xl xl:text-[92px] ">
                        <p>{{ __('НАСКОРО') }}</p>
                    </div>
                    <div class="hidden sm:flex justify-end mb-5 md:mb-8">
                        <div class="relative w-[43px] sm:w-[63px] xl:w-[71px] h-[43px] sm:h-[63px] xl:h-[71px] rounded-full bg-white/50 border border-[#E6E6E6] flex items-center justify-center after:absolute after:content-[''] after:rounded-full after:border after:border-[#ECECEC] after:bg-white after:w-[46px] after:md:w-[54px] after:h-[46px] after:md:h-[54px] after:inset-0 after:m-auto after:shadow-[6.67px_16px_29.33px_rgba(191,191,202,0.25)] shadow-[0px_9.33px_16px_rgba(191,191,202,0.25)] z-20">
                            <svg class="w-[23px] md:w-[23px] h-auto fill-colormain relative z-10" width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M11.4995 21.8019C10.9245 21.8019 10.3591 21.6677 9.89911 21.409L5.3662 18.7927C3.48786 17.5277 3.36328 17.2977 3.36328 15.314V10.5606C3.36328 8.57688 3.48786 8.34688 5.32786 7.11063L9.9087 4.46563C10.8191 3.93854 12.1895 3.93854 13.0999 4.46563L17.6329 7.08188C19.5112 8.34688 19.6358 8.57688 19.6358 10.5606V15.314C19.6358 17.2977 19.5112 17.5277 17.6712 18.764L13.0904 21.409C12.6399 21.6773 12.0649 21.8019 11.4995 21.8019ZM11.4995 5.51021C11.1737 5.51021 10.8479 5.57729 10.6179 5.71146L6.08495 8.32771C4.80078 9.19979 4.80078 9.19979 4.80078 10.5606V15.314C4.80078 16.6748 4.80078 16.6748 6.13286 17.5756L10.6274 20.1631C11.0874 20.4315 11.9212 20.4315 12.3812 20.1631L16.9141 17.5469C18.1983 16.6748 18.1983 16.6748 18.1983 15.314V10.5606C18.1983 9.19979 18.1983 9.19979 16.8662 8.29896L12.3716 5.71146C12.1512 5.57729 11.8254 5.51021 11.4995 5.51021Z"/>
                                <path d="M16.7712 8.03018C16.3782 8.03018 16.0524 7.70435 16.0524 7.31143V4.79102C16.0524 3.27685 15.4103 2.63477 13.8962 2.63477H9.10449C7.59033 2.63477 6.94824 3.27685 6.94824 4.79102V7.24435C6.94824 7.63727 6.62241 7.9631 6.22949 7.9631C5.83658 7.9631 5.51074 7.64685 5.51074 7.24435V4.79102C5.51074 2.47185 6.78533 1.19727 9.10449 1.19727H13.8962C16.2153 1.19727 17.4899 2.47185 17.4899 4.79102V7.31143C17.4899 7.70435 17.1641 8.03018 16.7712 8.03018Z"/>
                                <path d="M13.0624 16.8956C12.8611 16.8956 12.6503 16.8573 12.4395 16.7711L11.5003 16.4069L10.5611 16.7807C10.0532 16.9819 9.53573 16.934 9.15239 16.6561C8.76906 16.3781 8.56781 15.899 8.59656 15.3527L8.65406 14.3465L8.01198 13.5702C7.66698 13.139 7.55198 12.6407 7.70531 12.1807C7.84906 11.7302 8.24198 11.3852 8.76906 11.2511L9.74656 11.0019L10.2928 10.149C10.8774 9.22898 12.1328 9.22898 12.7174 10.149L13.2636 11.0019L14.2411 11.2511C14.7682 11.3852 15.1611 11.7302 15.3049 12.1807C15.4486 12.6311 15.3336 13.139 14.9886 13.5607L14.3466 14.3369L14.4041 15.3432C14.4328 15.8894 14.2316 16.359 13.8482 16.6465C13.6182 16.8094 13.3499 16.8956 13.0624 16.8956ZM9.12364 12.6502L9.76573 13.4265C9.98614 13.6852 10.1107 14.0973 10.0916 14.4327L10.0341 15.439L10.9732 15.0652C11.2895 14.9407 11.7111 14.9407 12.0274 15.0652L12.9666 15.439L12.9091 14.4327C12.8899 14.0973 13.0145 13.6948 13.2349 13.4265L13.877 12.6502L12.8995 12.4011C12.5736 12.3148 12.2286 12.0657 12.0466 11.7877L11.5099 10.9444L10.9636 11.7877C10.7816 12.0752 10.4366 12.3244 10.1107 12.4107L9.12364 12.6502Z"/>
                            </svg>
                        </div>
                    </div>
                    <div class="flex flex-col gap-5 lg:gap-[65px]">
                        <div class="flex flex-row flex-wrap items-stretch lg:-mx-4">
                            <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="w-full lg:w-1/2 lg:px-4 h-[73vw] sm:h-[60vw] lg:h-auto rounded-2xl lg:rounded-[20px] mb-3 lg:mb-0">
                                <div class="relative w-full h-full">
                                    <div class="absolute text-[10px] sm:text-sm font-bold bg-bgdark shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] left-4 lg:left-6 top-4 lg:top-10 text-white sm:py-3 p-2.5 !leading-tight max-w-[104px] h-[50px] sm:max-w-[140px] sm:h-[58px] overflow-hidden rounded-[10px] z-20">
                                        <div class="relative h-full flex items-center">
                                            <p>{{ __('Вкупна заработка') }} <span class="text-coloryellow">10%*</span></p>
                                            <svg class="w-full absolute top-0 right-0 left-0 bottom-0" width="104" height="46" viewBox="0 0 104 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                <path opacity="0.07" d="M107 45.8135C106.832 53.5518 104.261 60.1225 98.8863 65.5071C94.4271 69.973 89.9478 74.4197 85.4482 78.8474C83.4429 80.8253 81.0373 81.4875 78.3405 80.6366C75.7481 79.8178 74.1466 77.9864 73.6301 75.3143C73.1894 73.0247 73.7513 70.9238 75.405 69.2609C79.8596 64.7877 84.3901 60.3937 88.8532 55.9206C92.7981 51.9596 94.117 47.1967 92.4381 41.866C90.771 36.574 87.0144 33.3729 81.5318 32.4581C76.8719 31.6797 72.8445 33.1539 69.5136 36.4814C60.9692 45.0065 52.5561 53.6545 43.8974 62.0583C36.0714 69.6602 26.6388 71.9279 16.2826 68.6611C5.92647 65.3942 -0.462854 58.0569 -2.47319 47.3399C-4.23791 37.932 -1.53784 29.6579 5.15767 22.8227C11.9289 15.9049 18.8128 9.09997 25.6631 2.2681C29.0933 -1.15542 34.3454 -0.629762 36.7662 3.34805C37.5701 4.68022 37.9029 6.24461 37.7109 7.78925C37.519 9.33389 36.8135 10.7689 35.708 11.863C28.8118 18.773 21.9138 25.6835 15.0142 32.5945C9.53162 38.1089 9.51816 46.7586 14.9519 52.1635C17.5196 54.7109 20.9893 56.1375 24.6036 56.1318C28.2178 56.1261 31.6831 54.6886 34.2427 52.1332C42.6295 43.7361 51.0129 35.3357 59.3929 26.9319C63.7131 22.5834 68.8138 19.8338 74.87 18.7505C88.8397 16.2519 103.011 25.5622 106.181 39.4079C106.448 40.5872 106.655 41.7666 106.812 42.9662C106.933 43.9636 106.946 44.9778 107 45.8135Z" fill="#A3A3A3"/>
                                            </svg>
                                        </div>
                                    </div>
                                    <picture>
                                        <source srcset="{{ Vite::asset('resources/images/homepage/proektot-e-zavrsen.webp') }} 1x" type="image/webp">
                                        <img src="{{ Vite::asset('resources/images/homepage/proektot-e-zavrsen.jpg') }}" alt="#" width="357" height="253" class="object-cover object-center w-full h-full rounded-2xl lg:rounded-[20px] relative z-10">
                                    </picture>
                                    <div class="absolute text-[10px] sm:text-base  font-bold bg-white/60 shadow-[0px_2px_5.2px_rgba(0,0,0,0.15)] backdrop-blur-[6px] left-4 lg:left-9 right-4 lg:right-9 bottom-4 lg:bottom-11 text-bgdark rounded-[5px] z-10 py-1 px-2 sm:py-3 sm:px-2 lg:px-12 !leading-tight">
                                        * {{ __('Максимална заработка доколку средствата се вложат на или пред денот на започнување на проектот') }}.
                                    </div>
                                </div>
                            </div>
                            <div class="w-full lg:w-1/2 lg:px-4 mb-5 sm:mb-10 lg:mb-0">
                                <div data-aos="fade-down" data-aos-duration="2000" data-aos-delay="100" class="bg-white rounded-2xl lg:rounded-[20px] p-4 lg:p-10 xl:px-22 xl:py-30 h-full">
                                    <div class="h-full lg:max-w-[450px] flex flex-col justify-center mx-auto">
                                        <div class="mb-4 md:mb-7">
                                            <p class="font-bold text-bgdark text-2xl xl:text-[35px] mb-4 md:mb-7">X1 е почеток на нашата приказна</p>
                                            <p class="text-base sm:text-lg !leading-tight text-neutral-500">Станбен објект, сместен на атрактивна и мирна локација во подножјето на Златен Рид со незаменлив поглед кон Пелистер, на само 10 минути од Широк сокак, кој ќе овозможи удобно и модерно домување.</p>
                                        </div>
                                        <div class="bg-neutral-100 text-neutral-500 rounded-[10px] mb-4">
                                            <div class="flex flex-col sm:flex-row flex-wrap justify-between -mx-[5px] p-2.5">
                                                <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                    <p class="">{{ __('Почеток на градба') }}</p>
                                                    <p class="text-bgdark font-bold text-base">28/02/2023</p>
                                                </div>
                                                <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                    <p class="">{{ __('Завршување на проектот') }}</p>
                                                    <p class="text-bgdark font-bold text-base">27/02/2024</p>
                                                </div>
                                                <div class="text-base sm:text-lg !leading-tight sm:w-1/3 p-[5px]">
                                                    <p class="">{{ __('Рок на изградба') }}</p>
                                                    <p class="text-bgdark font-bold text-base">12 месеци</p>
                                                </div>
                                            </div>
                                        </div>

                                        <p class="mb-4 text-base sm:text-lg uppercase text-bgdark font-bold">{{ __('МОЖНОСТ ЗА ИНВЕСТИРАЊЕ ДО') }} <span class="text-blucolormain">100,000 {{ __('ЕВРА') }}</span></p>
                                        <div class="flex flex-wrap flex-col sm:flex-row items-center justify-start -mx-[2px]">
                                            <div class="p-[2px] w-full sm:w-auto">   
                                                <a href="#"  class="w-full sm:w-auto text-sm text-white py-2.5 px-4 bg-colormain transition-all hover:bg-transparent border border-colormain hover:text-colormain rounded-full inline-block uppercase">ИНВЕСТИРАЈ</a>
                                            </div>
                                            <div class="p-[2px] w-full sm:w-auto">   
                                                <a href="#" class="w-full sm:w-auto text-sm text-colormain py-2.5 px-4 bg-transparent border border-[#507EFF] transition-all hover:border-colormain rounded-full inline-block uppercase">ИНВЕСТИРАЈ НА РАТИ</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section class="w-full block relative overflow-hidden mt-10 md:mt-20 py-10 md:py-20 text-center sm:text-left">
            <livewire:subscribers.subscribe />
        </section>
    </div>
@endsection

{{-- @push('modals') --}}

{{-- @endpush --}}
@push('scripts')

@endpush