@extends('layouts.master')

@section('editable_content')

    <div class="header-background">

        <div class="content-container">

            @include('layouts.partials.contactPerson')

            <div class="base-breadcrumb">
                @include('layouts.partials.breadcrumb')
            </div>


            @if(isset($page->content->services))
                <div class="base-intro-block">
                    <div class="base-content-block @if($page->content->services->images->count() != 0) full-row @endif">

                        <h2>{{$page->content->services->translation->name}}</h2>
                        {{ $page->content->services->translation->description }}

                    </div>

                    @if($page->content->services->images->count() != 0)
                    <div class="base-image-block">
                            <div class="base-image bottom-aligned"
                                 style="background-image: url('{{$page->content->services->images->first()->medium_image_url}}')"></div>
                    </div>
                    @endif
                </div>
            @endif

            <div class="latest-posts">
                @foreach($services as $service)
                    <div class="post-block button-linking" data-href="/{{$service->translation->route->route}}">

                        <div class="post-image" style=" @if($service->images->count() != 0) background-image: url('{{$service->images->first()->medium_image_url}}') @endif">
                        </div>

                        <div class="post-intro">

                            <h2>{{$service->translation->name}}</h2>
                            <h4>{{$service->translation->sub_title}}</h4>
                            <div class="arrow-right">
                            </div>

                        </div>

                    </div>
                @endforeach
            </div>

        </div>

    </div>

    @include('layouts.partials.cta')

@endsection