@extends('layouts/master')

@section('css')
@stop

@section('title')
About Us | Your Trusted Design & Construction Consultants
@stop

@section('metas')
    <meta name="title" content="About Us | Your Trusted Design & Construction Consultants">
    <meta name="description" content="Learn more about our journey, expertise, and commitment to excellence. With over 20 years of experience, we specialize in delivering bespoke design and construction solutions that turn visions into stunning realities.">
    <meta name="keywords" content="{{ setting('site.keywords') }}">
    <meta property="og:title" content="About Us | Your Trusted Design & Construction Consultants">
    <meta property="og:description" content="Learn more about our journey, expertise, and commitment to excellence. With over 20 years of experience, we specialize in delivering bespoke design and construction solutions that turn visions into stunning realities.">
    <meta property="og:url" content="{{ url()->current() }}">
    <meta property="og:site_name" content="{{ ucwords(config('app.name')) }}">
    <meta property="og:locale" content="en_GB">
    <meta property="og:type" content="{{ ucwords(config('app.name')) }}">
    <meta name="twitter:title" content="About Us | Your Trusted Design & Construction Consultants">
    <meta name="twitter:description" content="">
    <meta name="twitter:domain" content="{{ env("APP_URL") }}">
@stop

@section('content')
<!-- Page Header Start -->
<div class="page-header parallaxie">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <!-- Page Header Box Start -->
                <div class="page-header-box">
                    <h1 class="text-anime-style-2" data-cursor="-opaque">About Us</h1>
                    <nav class="wow fadeInUp">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
                            <li class="breadcrumb-item active" aria-current="page">About Us</li>
                        </ol>
                    </nav>
                </div>
                <!-- Page Header Box End -->
            </div>
        </div>
    </div>
</div>
<!-- Page Header End -->

@include('inc.about-us-section')

<!-- Vision Mission Start -->
<div class="vision-mission">
    <div class="container">
        <div class="row section-row align-items-center">
            <div class="col-lg-6">
                <!-- Section Title Start -->
                <div class="section-title dark-section">
                    <h3 class="wow fadeInUp">vision mission</h3>
                    <h2 class="text-anime-style-2" data-cursor="-opaque">A Closer Look at How <span>Our Agency</span> Works</h2>
                </div>
                <!-- Section Title End -->
            </div>

            <div class="col-lg-6">
                <!-- Section Title Content Start -->
                <div class="section-title-content dark-section">
                    <p class="wow fadeInUp" data-wow-delay="0.2s">
                        Our portfolio highlights a rich variety of projects, showcasing our expertise in creating tailored designs. From elegantly crafted residential spaces to innovative and functional commercial interiors, each project reflects our commitment to quality, creativity, and client satisfaction.</p>
                </div>
                <!-- Section Title Content End -->
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <!-- Vision Mission Box Start -->
                <div class="vision-mission-box">
                    <!-- Vision Mission Item Start -->
                    <div class="vision-mission-item wow fadeInUp">
                        <div class="icon-box">
                            <img src="{{ url('frontend/images/icon-our-vision.svg') }}" alt="">
                        </div>
                        <div class="vision-mission-content">
                            <h3>our vision</h3>
                            <p>
                                At the heart of everything we do is a vision to redefine excellence in design and construction. We aspire to create spaces that not only inspire but also stand as a testament to innovation, functionality, and timeless elegance.
                                We envision a world where every project reflects the individuality and aspirations of our clients, combining artistry with practicality to craft environments that enhance lives. Our goal is to push boundaries, embrace sustainable practices, and set new benchmarks in quality, creativity, and client satisfaction.
                                With passion and dedication, we aim to be a trusted partner in transforming ideas into reality—one project at a time.
                            </p>
                        </div>
                    </div>
                    <!-- Vision Mission Item End -->

                    <!-- Vision Mission Item Start -->
                    <div class="vision-mission-item wow fadeInUp" data-wow-delay="0.2s">
                        <div class="icon-box">
                            <img src="{{ url('frontend/images/icon-our-mission.svg') }}" alt="">
                        </div>
                        <div class="vision-mission-content">
                            <h3>our mission</h3>
                            <p>
                                Our mission is to craft exceptional spaces that blend creativity, functionality, and innovation. We aim to bring our clients ideas to life by delivering tailored solutions that exceed expectations and create lasting impressions.
                                With a focus on precision and sustainable practices, we are committed to pushing boundaries and redefining industry standards. Our approach emphasizes collaboration, ensuring every project reflects the unique vision and goals of those we work with.
                                Guided by passion and a commitment to excellence, we strive to be a trusted partner, transforming ideas into realities that inspire and endure.
                            </p>
                        </div>
                    </div>
                    <!-- Vision Mission Item End -->
                </div>
                <!-- Vision Mission Box End -->
            </div>
        </div>
    </div>
</div>
<!-- Vision Mission End -->

<!-- Best Seeling Start -->
<div class="best-selling">
    <div class="container">
        <div class="row">
            <div class="col-lg-6">
                <!-- Best Seeling Content Start -->
                <div class="best-selling-content">
                    <!-- Best Seeling Content Image Start -->
                    <div class="best-selling-content-img">
                        <figure class="image-anime reveal">
                            <img src="{{ url('frontend/images/best-selling-img-1.jpg') }}" alt="">
                        </figure>
                    </div>
                    <!-- Best Seeling Content Image End -->

                    <!-- Section Title Start -->
                    <div class="section-title">
                        <h3 class="wow fadeInUp">Premium Finishes You Can Trust</h3>
                        <h2 class="text-anime-style-2" data-cursor="-opaque">Uncompromising Quality, <span>Sourced with Care</span></h2>
                        <p class="wow fadeInUp" data-wow-delay="0.2s">We partner exclusively with trusted suppliers, ensuring that every material meets our high standards for quality, sustainability, and reliability.</p>
                    </div>
                    <!-- Section Title End -->
                </div>
                <!-- Best Seeling Content End -->
            </div>
            <div class="col-lg-6">
                <!-- Best Seeling Image Start -->
                <div class="best-selling-iamge">
                    <figure class="image-anime reveal">
                        <img src="{{ url('frontend/images/best-selling-img-2.jpg') }}" alt="">
                    </figure>
                </div>
                <!-- Best Seeling Image End -->
            </div>
        </div>
    </div>
</div>
<!-- Best Seeling End -->

@include('inc.testimonials' , ['testimonials' => $testimonials])

@include('inc.how-we-work')

<!-- Our Faqs Stat -->
<div class="our-faqs">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-7">
                <!-- Our Faq Content Start -->
                <div class="our-faqs-content">
                    <!-- Section Title Start -->
                    <div class="section-title">
                        <h3 class="wow fadeInUp">asked question</h3>
                        <h2 class="text-anime-style-2" data-cursor="-opaque">Have your any question look <span>here now</span></h2>
                        <p class="wow fadeInUp" data-wow-delay="0.2s">Nostra turma dedicata consilium arctius operatur ut visionem tuam intelligat et eam ad vitam adducat cum magna cura in singula</p>
                    </div>
                    <!-- Section Title End -->

                    <!-- FAQ Accordion Start -->
                    <div class="faq-accordion" id="accordion">
                        <!-- FAQ Item Start -->
                        @foreach($faqs as $f)
                            <div class="accordion-item wow fadeInUp">
                                <h2 class="accordion-header" id="heading{{ $f->id }}">
                                    <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse{{ $f->id }}" aria-expanded="true" aria-controls="collapse{{ $f->id }}">
                                        <span>{{ $loop->iteration }}.</span>  {{ $f->questions }}
                                    </button>
                                </h2>
                                <div id="collapse{{ $f->id }}" class="accordion-collapse collapse @if($loop->iteration == 1) show @endif" aria-labelledby="heading{{ $f->id }}" data-bs-parent="#accordion">
                                    <div class="accordion-body">
                                        <p>{{ $f->answers }}</p>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                        <!-- FAQ Item End -->
                    </div>
                    <!-- FAQ Accordion End -->
                </div>
                <!-- Our Faq Content End -->
            </div>

            <div class="col-lg-5">
                <!-- Our Faq Image Start -->
                <div class="our-faqs-image">
                    <figure class="image-anime reveal">
                        <img src="{{ url('frontend/images/faqs-image.jpg') }}" alt="">
                    </figure>
                </div>
                <!-- Our Faq Image End -->
            </div>
        </div>
    </div>
</div>
<!-- Our Faqs End -->

<!-- Our Clients Start -->
<div class="our-clients">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="our-clients-box">
                    <!-- Section Title Start -->
                    <div class="section-title">
                        <h3 class="wow fadeInUp">our clients</h3>
                        <h2 class="text-anime-style-2" data-cursor="-opaque">Transforming 1,000+ spaces with tailored designs</h2>
                        <p class="wow fadeInUp" data-wow-delay="0.2s">Our client-centered approach ensures that we listen, understand, and deliver tailored solutions that align perfectly with their needs. By combining innovation, craftsmanship, and attention to detail, we create spaces that reflect their individuality while meeting the highest standards of quality.</p>
                    </div>
                    <!-- Section Title End -->

                    <!-- Client Logo Slider Start -->
                    <!--<div class="our-client-slider">-->
                    <!--    <div class="swiper">-->
                    <!--        <div class="swiper-wrapper">-->
                                <!-- Client Logo Start -->
                    <!--            @foreach($clients as $c)-->
                    <!--                <div class="swiper-slide">-->
                    <!--                    <div class="client-logo">-->
                    <!--                        <img src="{{ url('storage') }}/{{ $c->image }}" alt="{{ $c->title }}">-->
                    <!--                    </div>-->
                    <!--                </div>-->
                    <!--            @endforeach-->
                                <!-- Client Logo End -->
                    <!--        </div>-->
                    <!--    </div>-->
                    <!--</div>-->
                    <!-- Client Logo Slider End -->
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Our Clients End -->
@stop

@section('js')
@stop