@extends('frontend.layouts.master')

@section('header')
    @include('frontend.layouts.header-layout.three')
@endsection

@section('contents') 
<!-- breadcrumb-area -->
<section id="hero" class="hero section dark-background">
  <div id="hero-carousel" class="carousel slide carousel-fade" data-bs-ride="carousel" data-bs-interval="5000">
    <div class="carousel-item active"> <img src="{{ asset('frontend/img/hero-carousel/awar2.jpg') }}" alt="">
      <div class="carousel-container">
        <nav aria-label="breadcrumb">
          <ol class="breadcrumb text-white">
            <li class="breadcrumb-item"><a href="{{ route('home') }}">{{ __('Home') }}</a></li>
            <li class="breadcrumb-item active  text-white" aria-current="page">{{ __('Customer Awareness') }}</li>
          </ol>
        </nav>
        <h1 class="fw-bold hero-title fs-1">{{ __('Customer Awareness') }}</h1>
      </div>
    </div>
    <!-- End Carousel Item --> 
  </div>
</section>
<section id="open-peronalacc" class="open-peronalacc px-3">
  <div class="container">
    <div class="row">
      <div class="col-12">
        <div class="text-center pe-4 py-md-3  border-bottom" data-aos="fade-left" data-aos-delay="200">
			{!! replaceImageSources($awarness1?->description) !!}
        </div>
      </div>
    </div>
  </div>
</section>
<section id="customer-awareness" class="open-peronalacc pt-0 px-3">
  <div class="container card  border-0 container-md ">
    {!! replaceImageSources($awarness2?->description) !!}
    
  </div>
</section>
<section id="social-awareness" class="social-awareness pt-0 px-3">
  <div class="container card border-0  ">
    {!! replaceImageSources($awarness3?->description) !!}
    
  </div>
</section>
<section class="corporsate-acc bg-smlight paraimg px-3">
  <div class="container container-sm">
    {!! replaceImageSources($awarness4?->description) !!}
    
  </div>
</section>
<section class="Commitment px-3">
  <div class="container">
    <div class="row">
      {!! replaceImageSources($awarness5?->description) !!}
      
    </div>
  </div>
</section>

<!--  Marquee Area --> 
@include('frontend.partials.marquee')
@endsection
@section('footer')
    @include('frontend.layouts.footer-layout.two')
@endsection