<? if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED !== true) die();
/** @var array $arParams */
/** @var array $arResult */
/** @global CMain $APPLICATION */
/** @global CUser $USER */
/** @global CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);

?>



<section class="page-section page-section--dark page-section--overflow-hidden" data-animate="unity-development">
    <div class="unity-development" data-animate="unity-development">
        <div class="container">
            <div class="unity-development__inner">
                <div class="unity-development__left">
                    <div class="section-title unity-development__title section-title--dark">
                        <div class="section-title__wrap">
                            <p class="section-title__badge"><?=$arResult['TAG']?></p>
                            <h2 data-animate="title" class="title title--h2 section-title__title words lines
                            splitting is-show" style="--word-total: 5; --line-total: 2;"><?=$arResult['TITLE']?></h2>
                        </div>

                    </div>

                    <div class="unity-development__left-list-content" data-da-max=".unity-development__right, 767, last">
                        <?=$arResult['TEXT']?>
                    </div>
                </div>
                <div class="unity-development__right">
                    <div class="unity-development__slider">
                        <ul class="unity-development__list">
                            <?php foreach ($arResult["ITEMS"] as $k=>$arItem) :
                                $img1921 = CFile::GetPath($arItem["PROPERTIES"]['IMG_1921']["VALUE"]);
                                $img768 = CFile::GetPath($arItem["PROPERTIES"]['IMG_768']["VALUE"]);
                                $img767 = CFile::GetPath($arItem["PROPERTIES"]['IMG_767']["VALUE"]);
                                ?>
                              <li class="unity-development__item <?=($k==1)?'unity-development__item--next':'unity-development__item--active'?>">
                                <div class="solutions-career-item unity-development__card">
                                    <div class="solutions-career-item__bg">
                                        <div class="solutions-career-item__bg-image">
                                            <picture>
                                                <source media="(min-width: 1921px)"
                                                        srcset="<?= $img1921 ?>"
                                                        type="image/webp">
                                                <source media="(min-width: 768px)"
                                                        srcset="<?= $img768 ?>"
                                                        type="image/webp">
                                                <source media="(max-width: 767px)"
                                                        srcset="<?= $img767 ?>"
                                                        type="image/webp">
                                                <img src="<?= $arItem["PREVIEW_PICTURE"]["SRC"] ?>"
                                                     srcset="<?= $arItem["PREVIEW_PICTURE"]["SRC"] ?>"
                                                     alt="Изображение"width="870" height="250" loading="lazy">
                                            </picture>

                                        </div>
                                    </div>
                                    <h3><?=$arItem['NAME']?></h3>
                                    <p><?=$arItem['PREVIEW_TEXT']?></p>
                                </div>
                            </li>
                            <? endforeach; ?>

                        </ul>
                    </div>
                </div>
            </div>

        </div>
    </div>

</section>