@extends('layouts.master')
@section('content')
    <!-- Breadcum Start -->
    @include('components.breadcum')
    <!-- Breadcum End -->
    <!-- About Us Start -->
    <section class="about-us v1 pt-50 pb-50 pt-md-70 pb-md-70 pt-xl-100 pb-xl-100">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-xl-7">
                    <div class="about-left">
                        <div class="about-small-img wow animate__fadeInUp" data-wow-delay="0.2s" data-wow-offset="20"
                            data-wow-duration="0.8s">
                            <img src="{{ asset('uploads/site/about/' . $aboutSetting->side_image) }}" alt="about-small-img">
                        </div>
                        <div class="experience wow animate__fadeInUp" data-wow-delay="0.3s" data-wow-offset="20"
                            data-wow-duration="0.8s">
                            <h3 class="text-3 text-xl-2 text-bold">{{ $aboutSetting->experience }}+</h3>
                            <h6 class="text-6 text-bold text-capital">Years Experience</h6>
                        </div>
                        <div class="about-big-img wow animate__fadeInUp" data-wow-delay="0.1s" data-wow-offset="0"
                            data-wow-duration="0.8s">
                            <img src="{{ asset('uploads/site/about/' . $aboutSetting->main_image) }}" alt="about-big-img">
                        </div>
                    </div>
                </div>
                <div class="col-xl-5">
                    <div class="section-title v1">
                        <h6 class="text-para-1 text-xl-6 sub-title-shap text-bold">About Us</h6>
                        <h2 class="text-5 text-xl-3 text-bold">{{ $aboutSetting->title }}</h2>
                        <p class="text-para-2 text-para-xl-1 text-reguler">
                            {!! $aboutSetting->content !!}
                        </p>
                    </div>
                    <ul class="certifi-list">
                        <li><i class="my-icon icon-building-quality"></i>
                            <h6 class="text-6 text-bold">Building Quality Standards.</h6>
                        </li>
                        <li><i class="my-icon icon-certified-engineers"></i>
                            <h6 class="text-6 text-bold">Certified engineers Team</h6>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
    <!-- About Us End -->
@endsection