<? 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">
    <div class="horizontal horizontal--dark" data-animate-horizontal-parent="about-us">
        <div class="horizontal__wrap">
             <div class="horizontal__content-wrap" data-animate-horizontal-content-wrap="about-us">
                    <div class="horizontal__bg-gradient">
                        <picture>

                            <source media="(min-width: 1921px)"
                                    srcset="<?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark-xl.webp, <?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark-xl@2x.webp 2x, <?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark-xl@3x.webp 3x"
                                    type="image/webp">
                            <source media="(min-width: 768px)"
                                    srcset="<?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark-d.webp, <?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark-d@2x.webp 2x, <?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark-d@3x.webp 3x"
                                    type="image/webp">
                            <source media="(max-width: 767px)"
                                    srcset="<?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark.webp, <?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark@2x.webp 2x, <?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark@3x.webp 3x"
                                    type="image/webp">
                            <img src="<?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark.png"
                                 srcset="<?= SITE_TEMPLATE_PATH ?>/images/bg/bg-about-us-dark@2x.png 2x" alt="Изображение." width="779"
                                 height="836" loading="lazy">
                        </picture>

                    </div>
                    <div class="horizontal__pixels" data-pixels="horizontal" data-pixels-qty="45">
                    </div>
                 <div class="horizontal__wrapper">
                     <div class="horizontal__progress-wrap">
                         <div class="horizontal__progress" data-animate-horizontal-progress="about-us"></div>
                     </div>
                     <div class="horizontal__content" data-animate-horizontal-content="about-us">
                         <div class="container horizontal__container">

                             <div class="horizontal__inner">
                                 <div class="section-title horizontal__section-title section-title--dark">
                                     <div class="section-title__wrap">
                                         <p class="section-title__badge"><?=tags(76, 493,"о компании");?></p>
                                         <h2 data-animate="title" class="title title--h2 section-title__title">UDV Group<br class="show-on-xl show-on-desktop"> в цифрах</h2>
                                     </div>

                                 </div>

                                 <ul class="horizontal__features-list">
                                     <?php foreach ($arResult["ITEMS"] as $arItem) : ?>
                                     <?
                                     $this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
                                     $this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
                                     ?>
                                         <li class="horizontal__features-item" id="<?= $this->GetEditAreaId($arItem['ID']); ?>">
                                         <div class="feature-card feature-card--dark">
                                             <div class="feature-card__inner">
                                                 <div class="feature-card__counter">
                                                     <p class="feature-card__counter-value">
                                                         <span data-animate="counter"><?= $arItem['NAME'] ?></span>
                                                         <span data-animate="counter-sign"><?= $arItem["PROPERTIES"]["PLUS"]["VALUE"] ?></span>
                                                     </p>
                                                     <p class="feature-card__counter-description"><?= $arItem["PROPERTIES"]["SUBTITLE"]["VALUE"]?></p>
                                                 </div>
                                                 <div class="feature-card__description-wrap">
                                                     <p class="feature-card__description"><?= $arItem['PREVIEW_TEXT'] ?></p>
                                                 </div>
                                                 <?if($arItem["PROPERTIES"]["TEAM"]["VALUE"]):?>
                                                    <ul class="feature-card__avatar-list">
                                                     <li class="feature-card__avatar-item">
                                                         <div class="avatar avatar--bordered">

                                                             <picture>
                                                                 <source srcset="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-1.webp, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-1@2x.webp 2x,  <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-1@3x.webp 3x" type="image/webp">
                                                                 <img src="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-1.png" srcset="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-1@2x.png 2x,  <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-1@3x.png 3x" alt="Картинка" width="36" height="36" loading="lazy">
                                                             </picture>

                                                         </div>
                                                     </li>
                                                     <li class="feature-card__avatar-item">
                                                         <div class="avatar avatar--bordered">
                                                             <picture>
                                                                 <source srcset="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-2.webp, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-2@2x.webp 2x, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-2@3x.webp 3x" type="image/webp">
                                                                 <img src="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-2.png" srcset="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-2@2x.png 2x, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-2@3x.png 3x" alt="Картинка" width="36" height="36" loading="lazy">
                                                             </picture>

                                                         </div>
                                                     </li>
                                                     <li class="feature-card__avatar-item">
                                                         <div class="avatar avatar--bordered">

                                                             <picture>
                                                                 <source srcset="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-3.webp, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-3@2x.webp 2x, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-3@3x.webp 3x" type="image/webp">
                                                                 <img src="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-3.png" srcset="<?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-3@2x.png 2x, <?=SITE_TEMPLATE_PATH?>/images/avatar/avatar-3@3x.png 3x" alt="Картинка" width="36" height="36" loading="lazy">
                                                             </picture>

                                                         </div>
                                                     </li>
                                                     <li class="feature-card__avatar-item">
                                                         <div class="avatar avatar--bg-green avatar--bordered avatar--icon">

  <span class="avatar__icon">
        <svg width="1em" height="1em" viewBox="0 0 20 20" data-icon="icon-arrow-up-right">

  <use xlink:href="#ai:local:icon-arrow-up-right"></use>

</svg>
      </span>
                                                         </div>
                                                     </li>
                                                 </ul>
                                                 <?endif;?>

                                                 <?if($arItem["PROPERTIES"]["LINK"]["VALUE"]):?>
                                                     <a href="<?= $arItem["PROPERTIES"]["LINK"]["VALUE"] ?>"
                                                        class="button <?= !empty($arItem["PROPERTIES"]["COLOR_LINK"]["VALUE"]) ? 'button--solid-green' : 'button--outline button--dark' ?> ">
                                                <span
                                                        class="button__text"><?= $arItem["PROPERTIES"]["TEXT_LINK"]["VALUE"] ?></span>
                                                         <span
                                                                 class="button__icon">
        <svg width="1em" height="1em" viewBox="0 0 20 20" data-icon="icon-arrow-up-right">

  <use xlink:href="#ai:local:icon-arrow-up-right"></use>

</svg>
      </span>
                                                     </a>
                                                 <?endif;?>

                                                 <?if($arItem["PROPERTIES"]["SECTION"]["VALUE"]):?>
                                                 
                                                     <ul class="feature-card__tag-list">
                                                         <?$k==0;

                                                         foreach ($arItem["PROPERTIES"]["SECTION"]["VALUE"] as
                                                                    $item){

                                                             switch ($k) {
                                                                 case 0:
                                                                     $class = "grteen";
                                                                     break;
                                                                 case 1:
                                                                     $class = "violet";
                                                                     break;
                                                                 case 2:
                                                                     $class = "yellow";
                                                                     break;

                                                             }
                                                             $k++;
                                                             if ($k>2) $k=0;
                                                             ?>
                                                             <div class="tag-text tag-text--transparent
                                                             tag-text--bordered tag-text--<?=$class?>-dot
                                                             tag-text--size-big-small tag-text--dark">
                                                                 <p class="tag-text__text"><?=$item?></p>
                                                             </div>
                                                         <?}?>
                                                       
                                                         
                                                     </ul>
                                                 <?endif;?>


                                             </div>
                                         </div>
                                     </li>
                                     <? endforeach; ?>


                                 </ul>
                             </div>

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

</section>