@extends('master')

@section('title', !empty($page->translation->meta_title) ? $page->translation->meta_title : config('site.company.name'))
@section('meta_description', $page->translation->meta_description)

@section('content')

    <div class="o-hero  o-hero--home">
        <picture class="o-hero__frame">
            @if(isset($page->images) && $page->images->isNotEmpty())
                <source media="(min-width: 1100px)" srcset="{{ $page->images->first()->large_image_url }}">
                <source media="(min-width:475px)" srcset="{{ $page->images->first()->medium_image_url }}">
                <img class="o-hero__img" alt="{{ $page->images->first()->name }}" src="{{ $page->images->first()->small_image_url }}" data-kal="photo-zoom-out" style="--kal-duration: 2.0s;">
            @endif
        </picture>
        <div class="o-hero__menu" data-kal="slide-up" style="--kal-delay: 0.2s">
            @include('components.languageMenu')
        </div>
    </div>

    <div class="l-body">

        <div class="l-block  l-contain  u-spacing-mt1">
            <ul class="c-usp-row">
                @foreach(__('site/home.usp') as $key => $item)
                    <li class="c-usp-row__item" data-kal="slide-left" style="--kal-delay: {{$loop->index * 0.15 + 0.3}}s; --kal-easing: cubic-bezier(.165, .84, .44, 1);">
                        <span class="c-usp-row__icon">@include('components.ring' , ['modifiers' => 'simple'])</span>
                        <span class="c-usp-row__label">{{$item}}</span>
                    </li>
                @endforeach
            </ul>
        </div>

        <div class="l-block  l-contain">
            @if(isset($components) && $components->has('main'))
                @include('organisms.intro', [
                    'introDescription' => $components->get('main')->text,
                    'introButtonText' => __('site/home.intro.plan_intake'),
                    'introButtonLink' => $links->intake->route,
                    'introAltButtonText' => __('site/home.intro.contact_us'),
                    'introAltButtonLink' => $links->contact->route,
                ])
            @else
                <p>&nbsp;</p>
            @endif
        </div>


        <div class="l-block">
            <div class="l-contain">
                @include('organisms.productGrid', ['products' => $composedProducts])
            </div>

            @include('organisms.workflow')
        </div>

        @include('organisms.components')

        <div class="l-block">
            @include('organisms.testimonials', [
                'testimonialsLinkToPage' => true,
            ])
        </div>

        <div class="l-block">
            @include('organisms.certificates')
        </div>

        <div class="l-block  l-contain">
            @include('organisms.cta', [
                'ctaTitle' => __('site/global.cta.title'),
                'ctaButtonText1' => __('site/global.cta.buttonText1'),
                'ctaButtonText2' => __('site/global.cta.buttonText2'),
            ])
        </div>

        <div class="l-block  l-contain">
            @include('organisms.bubbles')
        </div>

    </div>
@endsection