@@include('../blocks/head.html')

<section class="hero">
   <div class="hero__wrapper">
      <div class="hero__body">
         <div class="hero-bg">
            <div class="hero-bg__wrapper">
               <div class="hero-bg__logo">
                  <img src="../../images/hero/logo.svg" alt="" />
               </div>
               <div class="hero-bg__media">
                  <div class="hero-bg__video hero-video">
                     <video muted loop playsinline>
                        <source src="../../video/hero.webm" type="video/webm" />
                        <source src="../../video/hero.mp4" type="video/mp4" />
                     </video>
                  </div>
                  <!-- <div class="hero-bg__image hero-image">
                     <img src="../../images/hero/hero.png" alt="" class="hero-bg__image" />
                  </div> -->
               </div>
            </div>
         </div>
         <div class="hero-content__container container">
            <div class="hero-content">
               <div class="hero-content__body">
                  <h1 class="hero-content__h1 h1">Event-агентство нового типа</h1>
                  <div class="hero-content__descr">
                     <p>С 2003 года удивляем, заряжаем, развиваем федеральные и региональные бренды</p>
                     <!-- <ul>
                        <li>Удивляем</li>
                        <li>Заряжаем</li>
                        <li>Развиваем</li>
                     </ul> -->
                  </div>
                  <div class="hero-content__btns">
                     <div class="hero-content__btn btn">Оставить заявку</div>
                     <a href="" class="hero-content__link arrow-link">
                        <span class="arrow-link__arrow">
                           <img src="../../icons/header/arraw.svg" alt="" />
                        </span>
                        <span class="arrow-link__text">смотреть кейсы</span>
                     </a>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</section>
<section class="section services-block">
   <div class="services-block__wrapper">
      <div class="container">
         <div class="services-block__body">
            <div class="services-block__top">
               <div class="services-block__titles">
                  <h2 class="services-block__h2 h2">Наши услуги</h2>
                  <div class="services-block__descr h2-text-heading">
                     Мы разделили услуги на 4 большие категории, внутри которых вы найдёте интересующие вас мероприятия
                  </div>
               </div>
               <div class="services-block__slider-controls">
                  <div class="services-block__slider-nav">
                     <div class="services-slider__btn-prev slider-btn slider-btn--prev"></div>
                     <div class="services-slider__btn-next slider-btn slider-btn--next"></div>
                  </div>
                  <div class="services-block__slider-pag">
                     <div class="services-slider__pagination slider-pagination"></div>
                  </div>
               </div>
            </div>
            <div class="services-block__slider services-slider swiper">
               <div class="services-slider__wrapper swiper-wrapper">
                  <div class="services-slider__slide swiper-slide service-slide">
                     <div class="service-slide__wrapper">
                        <div class="service-slide__body">
                           <div class="service-slide__cover">
                              <div class="service-slide__image">
                                 <img src="../../images/services.jpg" alt="" />
                              </div>
                              <div class="service-slide__tabel">Offline | Online</div>
                           </div>
                           <h3 class="service-slide__title h4-text-heading">Деловые мероприятия</h3>
                           <div class="service-slide__descr">
                              Федеральные и региональные B2B-мероприятия, как инструменты достижения бизнес-целей:
                              роста, позиционирования, продаж, диалога с рынком
                           </div>
                           <div class="service-slide__links">
                              <a href="" class="service-slide__link link-format">Конференции</a>
                              <a href="" class="service-slide__link link-format">Презентации</a>
                              <a href="" class="service-slide__link link-format">Бизнес-завтраки</a>
                              <a href="" class="service-slide__link link-format">Форумы и семинары</a>
                              <a href="" class="service-slide__link link-format">Выставки</a>
                              <a href="" class="service-slide__link link-format">+7 форматов</a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="services-slider__slide swiper-slide service-slide">
                     <div class="service-slide__wrapper">
                        <div class="service-slide__body">
                           <div class="service-slide__cover">
                              <div class="service-slide__image">
                                 <img src="../../images/services.jpg" alt="" />
                              </div>
                              <div class="service-slide__tabel">Offline | Online</div>
                           </div>
                           <h3 class="service-slide__title h4-text-heading">Деловые мероприятия</h3>
                           <div class="service-slide__descr">
                              Федеральные и региональные B2B-мероприятия, как инструменты достижения бизнес-целей:
                              роста, позиционирования, продаж, диалога с рынком
                           </div>
                           <div class="service-slide__links">
                              <a href="" class="service-slide__link link-format">Конференции</a>
                              <a href="" class="service-slide__link link-format">Презентации</a>
                              <a href="" class="service-slide__link link-format">Бизнес-завтраки</a>
                              <a href="" class="service-slide__link link-format">Форумы и семинары</a>
                              <a href="" class="service-slide__link link-format">Выставки</a>
                              <a href="" class="service-slide__link link-format">+7 форматов</a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="services-slider__slide swiper-slide service-slide">
                     <div class="service-slide__wrapper">
                        <div class="service-slide__body">
                           <div class="service-slide__cover">
                              <div class="service-slide__image">
                                 <img src="../../images/services.jpg" alt="" />
                              </div>
                              <div class="service-slide__tabel">Offline | Online</div>
                           </div>
                           <h3 class="service-slide__title h4-text-heading">Деловые мероприятия</h3>
                           <div class="service-slide__descr">
                              Федеральные и региональные B2B-мероприятия, как инструменты достижения бизнес-целей:
                              роста, позиционирования, продаж, диалога с рынком
                           </div>
                           <div class="service-slide__links">
                              <a href="" class="service-slide__link link-format">Конференции</a>
                              <a href="" class="service-slide__link link-format">Презентации</a>
                              <a href="" class="service-slide__link link-format">Бизнес-завтраки</a>
                              <a href="" class="service-slide__link link-format">Форумы и семинары</a>
                              <a href="" class="service-slide__link link-format">Выставки</a>
                              <a href="" class="service-slide__link link-format">+7 форматов</a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="services-slider__slide swiper-slide service-slide">
                     <div class="service-slide__wrapper">
                        <div class="service-slide__body">
                           <div class="service-slide__cover">
                              <div class="service-slide__image">
                                 <img src="../../images/services.jpg" alt="" />
                              </div>
                              <div class="service-slide__tabel">Offline | Online</div>
                           </div>
                           <h3 class="service-slide__title h4-text-heading">Деловые мероприятия</h3>
                           <div class="service-slide__descr">
                              Федеральные и региональные B2B-мероприятия, как инструменты достижения бизнес-целей:
                              роста, позиционирования, продаж, диалога с рынком
                           </div>
                           <div class="service-slide__links">
                              <a href="" class="service-slide__link link-format">Конференции</a>
                              <a href="" class="service-slide__link link-format">Презентации</a>
                              <a href="" class="service-slide__link link-format">Бизнес-завтраки</a>
                              <a href="" class="service-slide__link link-format">Форумы и семинары</a>
                              <a href="" class="service-slide__link link-format">Выставки</a>
                              <a href="" class="service-slide__link link-format">+7 форматов</a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="services-slider__slide swiper-slide service-slide">
                     <div class="service-slide__wrapper">
                        <div class="service-slide__body">
                           <div class="service-slide__cover">
                              <div class="service-slide__image">
                                 <img src="../../images/services.jpg" alt="" />
                              </div>
                              <div class="service-slide__tabel">Offline | Online</div>
                           </div>
                           <h3 class="service-slide__title h4-text-heading">Деловые мероприятия</h3>
                           <div class="service-slide__descr">
                              Федеральные и региональные B2B-мероприятия, как инструменты достижения бизнес-целей:
                              роста, позиционирования, продаж, диалога с рынком
                           </div>
                           <div class="service-slide__links">
                              <a href="" class="service-slide__link link-format">Конференции</a>
                              <a href="" class="service-slide__link link-format">Презентации</a>
                              <a href="" class="service-slide__link link-format">Бизнес-завтраки</a>
                              <a href="" class="service-slide__link link-format">Форумы и семинары</a>
                              <a href="" class="service-slide__link link-format">Выставки</a>
                              <a href="" class="service-slide__link link-format">+7 форматов</a>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</section>

<section class="section cases">
   <div class="cases__wrapper">
      <div class="container">
         <div class="cases__body">
            <h2 class="cases__title h2">кейсы</h2>
            <div class="cases__descr h2-text-heading dark-text">проекты, которыми мы гордимся</div>

            <div class="cases__tabs tabs">
               <div class="tabs__body">
                  <div class="tabs__nav tabs-nav">
                     <div class="tabs-nav__list">
                        <div class="tabs-nav__item active" data-tab="1" data-slug="all"><span>Все</span></div>
                        <div class="tabs-nav__item" data-tab="2" data-slug=""><span>Новые</span></div>
                        <div class="tabs-nav__item" data-tab="3" data-slug=""><span>Event</span></div>
                        <div class="tabs-nav__item" data-tab="4" data-slug=""><span>PR Event</span></div>
                        <div class="tabs-nav__item" data-tab="2" data-slug=""><span>Новые</span></div>
                        <div class="tabs-nav__item" data-tab="3" data-slug=""><span>Event</span></div>
                        <div class="tabs-nav__item" data-tab="4" data-slug=""><span>PR Event</span></div>
                        <div class="tabs-nav__item" data-tab="2" data-slug=""><span>Новые</span></div>
                        <div class="tabs-nav__item" data-tab="3" data-slug=""><span>Event</span></div>
                        <div class="tabs-nav__item" data-tab="4" data-slug=""><span>PR Event</span></div>
                        <div class="tabs-nav__item" data-tab="2" data-slug=""><span>Новые</span></div>
                        <div class="tabs-nav__item" data-tab="3" data-slug=""><span>Event</span></div>
                        <div class="tabs-nav__item" data-tab="4" data-slug=""><span>PR Event</span></div>
                     </div>
                  </div>
                  <div class="tabs__content cases__content">
                     <div class="cases__list">
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Торжественная встреча фитнес-тренеров РУДН</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Межправительственный совет дорожников</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                        <a href="" class="cases__item cases-item">
                           <div class="cases-item__cover">
                              <img src="../../images/cases.jpg" alt="" />
                           </div>
                           <div class="cases-item__substrate arrow-link">
                              <span class="caption arrow-link__text">Т. Конф</span>
                              <span class="arrow-link__arrow">
                                 <img src="../../icons/header/arraw.svg" alt="" />
                              </span>
                           </div>
                        </a>
                     </div>
                  </div>
               </div>
            </div>
            <a href="" class="cases__link arrow-link dark">
               <span class="arrow-link__arrow">
                  <img src="../../icons/header/arrow-dark.svg" alt="" />
               </span>
               <span class="arrow-link__text dark-text">смотреть все кейсы</span>
            </a>
         </div>
      </div>
   </div>
</section>

<section class="section logos">
   <div class="logos__wrapper">
      <div class="container">
         <h2 class="logos__title h2">клиенты</h2>
         <div class="logos__subtitle h2-text-heading">Нам доверяют бренды по всей России</div>
         <div class="logos__list">
            <div class="logos__track">
               <div class="logos__item">
                  <img src="../../images/logos/1.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/2.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/3.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/4.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/1.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/2.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/3.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/4.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/4.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/1.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/2.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/3.png" alt="" />
               </div>
               <div class="logos__item">
                  <img src="../../images/logos/4.png" alt="" />
               </div>
            </div>
         </div>
      </div>
   </div>
</section>

<section class="section about">
   <div class="about__wrapper">
      <div class="container">
         <div class="about__body">
            <div class="about__content">
               <div class="about__title h2">Об агентстве</div>
               <div class="about__subtitle h2-text-heading">
                  АртПикник — ваш заботливый партнёр, специалист по корпоративным мероприятиям, в уровне которых
                  вы будете уверены!
               </div>
               <div class="about__advantages">
                  <div class="about__advantages-item advantages-item">
                     <div class="advantages-item__num h2-text-heading">20+</div>
                     <div class="advantages-item__text text">Года в организации мероприятий</div>
                  </div>
                  <div class="about__advantages-item advantages-item">
                     <div class="advantages-item__num h2-text-heading">150+</div>
                     <div class="advantages-item__text text">Релизованных форматов мероприятий</div>
                  </div>
                  <div class="about__advantages-item advantages-item">
                     <div class="advantages-item__num h2-text-heading">9170</div>
                     <div class="advantages-item__text text">Мероприятий реализовано за 2025</div>
                  </div>
                  <div class="about__advantages-item advantages-item">
                     <div class="advantages-item__num h2-text-heading">2000</div>
                     <div class="advantages-item__text text">Максимальное число гостей на мероприятии</div>
                  </div>
               </div>

               <a href="" class="about__link arrow-link dark">
                  <span class="arrow-link__arrow">
                     <img src="../../icons/header/arrow-dark.svg" alt="" />
                  </span>
                  <span class="arrow-link__text dark-text">узнать больше</span>
               </a>
            </div>
            <div class="about__bg">
               <div class="about__bg-wrapper">
                  <div class="about__team">
                     <picture>
                        <source srcset="../../images/team1600.png" type="image/webp" media="(min-width: 1200px)" />
                        <source srcset="../../images/team.png" type="image/webp" media="(min-width: 768px)" />
                        <source srcset="../../images/team540.png" type="image/webp" media="(min-width: 567px)" />
                        <img src="../../images/team360.png" alt="" />
                     </picture>
                  </div>
                  <div class="about__znak">
                     <img src="../../images/logo-or.svg" alt="" />
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</section>
@@include('../blocks/footer.html')