@extends('index')

@section('main')
    <section class="section top-section relative" style="background-image: url('assets/img/img-bg-1.jpg');">
        <figure class="section-abs-img section-abs-img--machines-1"><img class="js-paroller" data-paroller-factor="0.2" data-paroller-type="foreground" src="assets/img/img-leaf-1.png" alt=""></figure>
        <figure class="section-abs-img section-abs-img--machines-2"><img class="js-paroller" data-paroller-factor="-0.2" data-paroller-type="foreground" src="assets/img/img-leaf-2.png" alt=""></figure>
        <div class="section__inner section__inner--section section__inner--center">

            <div class="container">
                <div class="row">
                    <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
                        <h1 class="top-section__title main-title main-title--white main-title--large cmb text-center">
                            {!! nl2br(\App\Helpers\Helper::htmlTag($page->extra_i18n->top->header, 's', 'strong')) !!}</h1>
                    </div>
                </div>

            </div>
        </div>

    </section>
    <div class="section mt-20 mb-20">
        <div class="section__inner section__inner--section bg-color-key-4 relative">
            <figure class="section-abs-img section-abs-img--machines-3"><img class="js-paroller" data-paroller-factor="0.2" data-paroller-type="foreground" src="assets/img/img-item-20.png" alt=""></figure>
            <figure class="section-abs-img section-abs-img--machines-4"><img class="js-paroller" data-paroller-factor="-0.2" data-paroller-type="foreground" src="assets/img/img-item-15.png" alt=""></figure>
            <figure class="section-abs-img section-abs-img--machines-5"><img class="js-paroller" data-paroller-factor="0.2" data-paroller-type="foreground" src="assets/img/img-item-17.png" alt=""></figure>
            <figure class="section-abs-img section-abs-img--machines-6"><img class="js-paroller" data-paroller-factor="0.2" data-paroller-type="foreground" src="assets/img/img-item-16.png" alt=""></figure>
            <div class="container z-index">
                <div class="products-list">
                    <div class="row gutters-14">
                        @foreach($automats as $item)
                        <div class="col-xs-6 col-md-3 flex flex--stretch">
                            <a href="{{ $item->getUrl() }}" class="product-item">
                                <figure class="product-item__img"><img src="{{ $item->hasImage() ? $item->getImage()->adaptive(185, 320) : '' }}" alt="{{ $item->hasImage() ? $item->getImage()->data->name : '' }}"></figure>
                                <div class="product-item__title">{{ $item->name }}</div>
                            </a>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>

    </div>

    @if(!empty($page->extra_i18n->icons->items))
    <section class="section overflow-h relative" data-anchor="section-3">
        <figure class="section-abs-img section-abs-img--machines-7"><img class="js-paroller" data-paroller-factor="0.2" data-paroller-type="foreground" src="assets/img/img-item-19.png" alt=""></figure>
        <div class="section__inner section__inner--center relative z-index">
            <div class="container">
                <div class="row">
                    <div class="col-md-8 col-md-offset-2 flex flex--center-y">
                        <h2 class="main-title main-title--large-mb text-center">
                            {!! \App\Helpers\Helper::htmlTags($page->extra_i18n->icons->header ?? '', [[ 'y', 'span', 'class="color-key-1"'], [ 's', 'strong', '']]) !!}</h2>
                    </div>
                </div>
                <div class="icons-list">
                    <div class="row center-sm-alt">
                        @foreach($page->extra_i18n->icons->items as $item)
                            @php
                                $file = new \IguanaStudio\Cms\Models\File();
                                $file->path = $item->image[0]->path ?? '';
                                $file->data = $item->image[0]->data ?? '';
                            @endphp

                        <div class="col-xs-6 col-sm-4 col-md-2-3">
                            <div class="icon-item icon-item--alt">
                                <figure class="icon-item__icon">
                                    <img src="{{ $file->adaptive(53, 53) ?? '' }}" alt="{{ $file->data->name ?? '' }}">
                                </figure>
                                <div class="icon-item__text">
                                    <p>{!! nl2br($item->text ?? '') !!}</p>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </section>
    @endif
@endsection