@extends('site.master', ['headerIsLight' => true]) 

@section('title', $page->translation->meta_title)
@section('meta_description', $page->translation->meta_description)

@section('hero-heading-content')
    <div class="c-hero__buttons">
        @if(app()->getLocale() != 'nl')
            <div class="c-hero__button">
                <button class="c-button  c-button--on-dark  c-button--video-icon js-youtube-modal-button" data-youtube="@lang('site/customers.headingVideo')">
                    <i class="c-button__icon">@include('site.components.icons.video-icon')</i>
                    <span class="c-button__text">@lang('site/customers.watch_video')</span>
                </button>
            </div>
        @endif
        @if(isset($links->bookADemo))
            @include('site.components.buttonLink', ['modifiers' => ['filled', 'on-dark'], 'buttonText' =>  __('site/home.bookDemo'), 'buttonLink' =>  '/' .$links->bookADemo->route])
        @endif
    </div>
@endsection

@section('hero-body')
    @include('site.components.heroHeading', [
               'heroHeadingTitle' => ( !empty($page->translation->visual_name) ? $page->translation->visual_name : $page->translation->name),
               'heroHeadingSubTitle' => $page->translation->description,
               'modifiers' => ['large']
           ])
@endsection

@section('content')

    @include('site.components.hero', [ 'heroImages' => $page->images ])

    <div class="c-body  o-blocks">
        @include('site.organisms.components')

        @if(isset($links->customerStories))
            <div class="l-grid  o-block-bg">
                <div class="u-text-align-center">
                    @include('site.components.buttonLink', [
                        'buttonLink' => '/' . $links->customerStories->route,
                        'buttonText' => __('site/customers.allCustomerStories')
                    ])
                </div>
            </div>
        @endif

        <div class="l-grid  o-block">
            @include('site.components.customerLogos')
        </div>

        <div class="l-grid  o-block-bg">
            <div>
                @include('site.components.cta.cta--bar')
            </div>
        </div>

    </div>

    @include('site.components.youtubeModalOverlay')

@endsection