{extends file="includes/layout.html"}

{block name="styles"}
<link href="{$templates_dir}css/page-home.min.css?{$global_version}" rel="stylesheet">
{/block}

{block name="main"}
<div role="main" class="main home-page" id="main">


    <!-- <div class="wrapper wrapper-p-0"> -->
    <section class="section-banner">
        <div class="swiper swiper-banner" id="swiperBanner">
            <div class="swiper-wrapper">
                {foreach $banerHomepageTop as $item}
                <{if !empty($item.redirect)}a href="{$item.redirect}" target="{$item.target}"{else}div{/if} class="swiper-slide swiper-banner__slide">
                    <div class="swiper-banner__showcase">
                        <h1>{$item.content}</h1>
                    </div>
                    <picture>
                        <source media="(max-width:650px)" srcset="{image f=$item.mainImageFilename h=730 m=cr r=path}">
                        <img src="{image f=$item.mainImageFilename w=1920 h=882 m=cr r=path}" alt="{$item.mainImageAlt}"
                            class="img-cover" width="1920" height="882">
                    </picture>
                </{if !empty($item.redirect)}a{else}div{/if}>
                {/foreach}
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </section>
    <!-- </div> -->

    <div class="wrapper">
        <div class="section-stats">
            <div class="section-stats__left">
                <div>
                    <span>{$fields.homepage_points_1_title|nl2br}</span>
                    <p>{$fields.homepage_points_1_subtitle|nl2br}</p>
                </div>
                <div>
                    <span>{$fields.homepage_points_2_title|nl2br}</span>
                    <p>{$fields.homepage_points_2_subtitle|nl2br}</p>
                </div>
                <div>
                    <span>{$fields.homepage_points_3_title|nl2br}</span>
                    <p>{$fields.homepage_points_3_subtitle|nl2br}</p>
                </div>
                <div>
                    <span>{$fields.homepage_points_4_title|nl2br}</span>
                    <p>{$fields.homepage_points_4_subtitle|nl2br}</p>
                </div>
            </div>
            <div class="section-stats__right">
                <h3 class="heading-md">{$fields.homepage_about_title|nl2br}</h3>
                <p>{$fields.homepage_about_content|nl2br}</p>
                <a href="{seoLink id_element=1596}" class="btn">{$fields.homepage_about_link}</a>
            </div>
        </div>
    </div>

    {include file="includes/sections/section-categories.html"}

    {if !empty($realizationList1)}
    <div class="wrapper wrapper-sm-none">
        <div class="section-maps">
            <div class="switchs">
                <button class="switchs__btn active" data-switch="world">{'label_realization_world'|translate}</button>
                <button class="switchs__btn" data-switch="europe">{'label_realization_europe'|translate}</button>
            </div>

            <div class="swiper swiper-maps swiper-maps--world active" data-map="world">
                {include file="includes/sections/section-realizations2.html" elements=$realizationList1
                parentLink=$realizationParentLink isEurope=false}
                <div class="swiper-pagination"></div>
                <div class="swiper-button-prev swiper-button-prev--orange"></div>
                <div class="swiper-button-next swiper-button-prev--orange"></div>
            </div>
            <div class="swiper swiper-maps swiper-maps--europe" data-map="europe">
                {include file="includes/sections/section-realizations2.html" elements=$realizationList1
                parentLink=$realizationParentLink isEurope=true}
                <div class="swiper-pagination"></div>
                <div class="swiper-button-prev swiper-button-prev--orange"></div>
                <div class="swiper-button-next swiper-button-prev--orange"></div>
            </div>
        </div>
    </div>
    {/if}

    {include file="includes/sections/section-realizations.html" elements=$realizationList2
    parentLink=$realizationParentLink title=$fields.homepage_realizations_title
    subtitle=$fields.homepage_realizations_subtitle}

    {include file="includes/sections/section-news.html" elements=$blogList parentLink=$blogParentLink}

</div>
{/block}

{block name="scripts"}
<script src="{$templates_dir}js/page-home.min.js?{$global_version}"></script>
{/block}