@section($componentAreaName)

    <section class="c-ctaPerson  @if(isset($component->without_shadow) && $component->without_shadow) c-ctaPerson--without-shadow @endif">
        <div class="l-contain">
            <div class="c-ctaPerson__main">
                <div class="c-ctaPerson__left  c-cta">
                    <p class="c-cta__subtitle">{{ !empty($component->subtitle) ? $component->subtitle : 'Overtuigd van de kracht van MOM Security?' }}</p>
                    <h2 class="c-cta__title">{{ !empty($component->title) ? $component->title : 'Laat u vrijblijvend adviseren door een expert' }}</h2>

                    @if(empty($component->link) && isset($links->advice))
                        <div class="c-cta__button">
                            @include('components.button', [ 'buttonLink' => $links->advice->route, 'buttonText' => !empty($component->button) ? $component->button : 'Adviesgesprek', 'modifiers' => ['icon']])
                        </div>
                    @else
                        <div class="c-cta__button" href="{{ $component->link }}">
                            @include('components.button', [ 'buttonLink' => $links->advice->route, 'buttonText' => !empty($component->button) ? $component->button : 'Adviesgesprek', 'modifiers' => ['icon']])
                        </div>
                    @endif
                </div>

                <div class="c-ctaPerson__right">
                    <div class="c-ctaPerson__svgHolder">
                        @include('components.clippedImage', ['imageUrl' => '/img/cta_person.jpg', 'pathId' => 4])
{{--                        @include('svg.cta-person-mask', ['color'=> '#7AD3FF', 'img' => '/img/cta_person.jpg', 'pathId' => 2])--}}
                    </div>

                    <div class="c-ctaPerson__personalData">
                        <h4 class="c-cta__personal-name">Monique Van Vlierden</h4>
                        <p class="c-cta__personal-function">Zaakvoerster</p>
                        <a class="c-cta__personal-phone" href="tel:{{ config('site.company_phone_call') }}">Bel {{ config('site.company_phone_display') }}</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection

@include('organisms.componentables.layouts.componentableRow')