<section class="about-section section-padding pt-0" id="about">
    <div class="container">
        <div class="about-wrapper">
            <div class="row g-4">
                <div class="col-lg-6">
                    <div class="about-image-items wow fadeInUp" data-wow-delay=".3s">
	                    @if (!empty($data['content_shape_image']))
		                    <div class="content-shape">
			                    <img src="{{ asset($data['content_shape_image']) }}" alt="shape-img">
		                    </div>
	                    @endif
	                    
	                    @if (!empty($data['bg_shape_image']))
		                    <div class="bg-shape">
			                    <img src="{{ asset($data['bg_shape_image']) }}" alt="bg-shape-img">
		                    </div>
	                    @endif
	                    
	                    @if (!empty($data['main_image']))
		                    <div class="about-image">
			                    <img src="{{ asset($data['main_image']) }}" alt="about-main-img">
			                    
			                    @if (!empty($data['about_tool_shape_image']))
				                    <div class="about-shape">
					                    <img src="{{ asset($data['about_tool_shape_image']) }}" alt="about-tool-shape">
				                    </div>
			                    @endif
		                    </div>
	                    @endif
                    </div>
                </div>
	            
	            <div class="col-lg-6">
                    <div class="about-content">
                        <div class="section-title">
	                        
	                        @if (!empty($data['title_bar_image']))
		                        <span class="sub-title wow fadeInUp">
                                    <img src="{{ asset($data['title_bar_image']) }}" alt="title-bar">
                                    {{ $data['subheading'][$locale] ?? '' }}
                                </span>
	                        @endif
	                        
	                        @if (!empty($data['heading'][$locale]))
		                        <h2 class="wow fadeInUp" data-wow-delay=".3s">
			                        {{ $data['heading'][$locale] }}
		                        </h2>
	                        @endif
	                        
	                        @if (!empty($data['description'][$locale]))
		                        <p class="wow fadeInUp" data-wow-delay=".5s">
			                        {!! nl2br(e($data['description'][$locale])) !!}
		                        </p>
	                        @endif
                        
                        </div>
	                    
	                    {{-- Repeated About Icons --}}
                        <div class="about-icon-area mt-4 mt-md-0">
	                        @foreach($repeatedContents as $repeatedContent)
		                        @php
			                        $contentData = $repeatedContent->content_data ?? [];
		                        @endphp
		                        
		                        <div class="icon-item wow fadeInUp" data-wow-delay=".3s">
			                        <div class="icon">
				                        @if (!empty($contentData['about_icon_class']))
					                        <i class="{{ $contentData['about_icon_class'] }}"></i>
				                        @endif
			                        </div>
			                        <div class="content">
				                        @if (!empty($contentData['about_title'][$locale]))
					                        <h5>{{ $contentData['about_title'][$locale] }}</h5>
				                        @endif
				                        
				                        @if (!empty($contentData['about_text'][$locale]))
					                        <p>{!! nl2br(e($contentData['about_text'][$locale])) !!}</p>
				                        @endif
			                        </div>
		                        </div>
	                        @endforeach
                        </div>
	                    
	                    @if (!empty($data['description'][$locale]))
		                    <p class="wow fadeInUp" data-wow-delay=".3s">
			                    {!! nl2br(e($data['description'][$locale])) !!}
		                    </p>
	                    @endif
	                    
	                    @if (!empty($data['button_url']) && !empty($data['button_text'][$locale]))
		                    <div class="about-button wow fadeInUp" data-wow-delay=".5s">
			                    <a href="{{ $data['button_url'] }}" class="theme-btn">
				                    {{ $data['button_text'][$locale] }}
			                    </a>
		                    </div>
	                    @endif
                    
                    </div>
                </div>
            
            </div>
        </div>
    </div>
</section>
