@extends('layouts.website_layout')
@section('meta_title', $meta_data->meta_title)
@section('meta_description', $meta_data->meta_description)
@section('canonical_tag', $meta_data->canonical_tag)
@section('banner_image', "banners/".$banner->banner_image)
@section('content')
<main>
    <article class="container-fluid innerBanner p-0">
        <figure>
            <img src="{{url('/')}}/assets/images/banners/{{$banner->banner_image}}" alt="{{$meta_data->page_name}}" class="img-fluid desktop_image">
            <img src="{{url('/')}}/assets/images/banners/{{$banner->banner_image_mobile}}" alt="{{$meta_data->page_name}}" class="img-fluid mobile_image"> 
            <figcaption class="custom__row slider-heading">
                {!!nl2br($banner->banner_caption)!!}
                <p class="paragraph mt-4">{!!nl2br($banner->banner_description)!!}</p>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{url('/')}}">Home</a></li>
                        <li class="breadcrumb-item active" aria-current="page">{{$meta_data->page_name}}</li>
                    </ol>
                </nav>
            </figcaption>
        </figure>
    </article>
    <article class="container-fluid linkNav">
        <nav class="row custom__row text-center">
            <ul class="m-auto">
                <li><a href="{{url('/')}}/commitments">Welcome</a></li>
                <li><a href="{{url('/')}}/business-excellence" class="active">Business Excellence</a></li>
                <li><a href="{{url('/')}}/sustainability">Sustainability</a></li>
                <li><a href="{{url('/')}}/corporate-governance">Corporate Governance</a></li>
            </ul>
        </nav>
    </article>
    <article class="container-fluid servicesRange">
        <div class="row custom__row">
            <section class="col-12 col-md-8 m-auto title text-center">
                <h1 class="secondary-heading">{!!nl2br($banner->introduction_title)!!}</h1>
                <p class="paragraph">{!!nl2br($banner->introduction_description)!!}</p>
            </section>
        </div>
    </article>
    @if(!empty(count($business_excellence_timelines)))
    <article class="container-fluid journey">
        <div class="row custom__row justify-content-center">
            <div class="col-12 col-md-12 col-lg-8 m-auto title text-center">
                <h2 class="secondary-heading">Journey of Raychem Excellence</h2>
            </div>
            <div class="col-12 col-md-12 col-lg-8 m-auto">
                <div class="wrapper">
                    <div class="center-line">
                    </div>
                    @php
                    $i = 0;
                    @endphp
                    @foreach($business_excellence_timelines as $business_excellence_timeline_row)
                    @if(empty($i %2))
                    <div class="row row-1">
                        <section>
                            <i class="icon"></i>
                            <div class="details">
                                <span class="title">{{$business_excellence_timeline_row->business_excellence_timeline_title}}</span>
                                <p class="paragraph">{!!nl2br($business_excellence_timeline_row->business_excellence_timeline_description)!!}</p>
                            </div>
                            <div class="bottom">
                                @if(!empty($business_excellence_timeline_row->business_excellence_timeline_thumbnail))
                                <img src="{{url('/')}}/assets/images/business-excellence/{{$business_excellence_timeline_row->business_excellence_timeline_thumbnail}}" alt="Raychem {{$business_excellence_timeline_row->business_excellence_timeline_title}}" class="img-fluid">
                                @endif
                            </div>
                        </section>
                    </div>
                    @else
                    <div class="row row-2">
                        <section>
                            <i class="icon"></i>
                            <div class="details">
                                <span class="title">{{$business_excellence_timeline_row->business_excellence_timeline_title}}</span>
                                <p class="paragraph">{!!nl2br($business_excellence_timeline_row->business_excellence_timeline_description)!!}</p>
                            </div>
                            <div class="bottom">
                                @if(!empty($business_excellence_timeline_row->business_excellence_timeline_thumbnail))
                                <img src="{{url('/')}}/assets/images/business-excellence/{{$business_excellence_timeline_row->business_excellence_timeline_thumbnail}}" alt="Raychem {{$business_excellence_timeline_row->business_excellence_timeline_title}}" class="img-fluid">
                                @endif
                            </div>
                        </section>
                    </div>
                    @endif
                    @php
                    $i++;
                    @endphp
                    @endforeach
                </div>
            </div>
        </div>
    </article>
    @endif
    @if(!empty(count($business_excellence_stories)))
    <article class="container-fluid buisiness-ex">
        <div class="row custom__row justify-content-center">
            <div class="col-12 col-md-10 col-lg-10">
                <div class="row">
                    <div class="col-12 title mb-4 text-center">
                        <h2 class=" secondary-heading black mb-3">Stories of Excellence</h2>
                    </div>
                    <div class="col-12 owl-carousel stories buisiness__ex__stories">
                        @foreach($business_excellence_stories as $business_excellence_story_row)
                        <div class="item">
                            <div class="row m-0">
                                <div class="col-12 col-md-12 col-lg-7 text">
                                    <h5>{{$business_excellence_story_row->business_excellence_story_title}}</h5>
                                    <p class="paragraph">{!!nl2br($business_excellence_story_row->business_excellence_story_description)!!}</p>
                                    <h6 class="paragraph"><b>{{$business_excellence_story_row->business_excellence_story_name}}</b></h6>
                                    <p class="paragraph designation">{{$business_excellence_story_row->business_excellence_story_designation}}</p>
                                </div>
                                <div class="col-12 col-md-12 col-lg-5 image">
                                    <div class="wrapper">
                                        <span></span>
                                        <img src="{{url('/')}}/assets/images/business-excellence/{{$business_excellence_story_row->business_excellence_story_image}}" alt="{{$business_excellence_story_row->business_excellence_story_name}}" class="img-fluid">
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </article>
    @endif
</main>
@endsection