/home/bdqbpbxa/rc-subdomains/waykay-rc.goodface.com.ua/wp-content/themes/waykay/front-page.php
<?php
  // Template name: Home page

  get_header();

  $template_directory = get_template_directory_uri();
  $srcset = "srcset='{$template_directory}/assets/images/lazyload.png'";
  $main = get_field('main');
?>

<main>
	<section class="hero gradient-section" id="<?php echo $main['section_id']; ?>" data-animate-group="list">
		<div class="gradient" data-animate="fade">
			<picture>
				<source srcset="<?php echo  $template_directory; ?>/assets/images/gradients/hero-dots-mob.png"  media="(max-width: 760px)">
				<img src="<?php echo  $template_directory; ?>/assets/images/gradients/hero-dots.png" alt="">
			</picture>
		</div>
		<div class="container">
			<div class="hero__wrapper">
				<div class="content">
					<h1 class="title title-1 mob-title-1" data-animate="word" data-index="1">
            <?php echo $main['title']; ?>
					</h1>
          <?php
            if ($main['subtitle']) :
          ?>
            <p class="subtitle body-1 mob-body-1" data-animate="swim-top" data-index="2">
              <?php echo $main['subtitle']; ?>
            </p>
          <?php
            endif;
            $link = get_link_group_field($main['link']);
            if ($link): 
          ?>
					<a href="<?php echo $link['url']; ?>" <?php echo $link['target']; ?> class="button button-text mob-button-text" data-animate="swim-top" data-index="2">
          <?php echo $link['title']; ?>
						<span class="arrow"></span>
					</a>
          <?php endif; ?>
				</div>
				<div class="media" data-animate="fade" data-index="2" data-do-not-clear-animate>
					<img src="<?php echo $main['main_image']['url']; ?>" alt="<?php echo $main['main_image']['alt']; ?>">
					<div class="absolut-images paralax_object">
						<div class="img text-card text-card-2 layer" data-depth="0.5"  data-index="3"><img src="<?php echo  $template_directory; ?>/assets/images/hero/text-card-2.png" alt=""></div>
						<div class="img layer blur" data-depth="0.8"  data-index="2"><img src="<?php echo  $template_directory; ?>/assets/images/hero/toy.png" alt=""></div>
						<div class="img layer logo" data-depth="-0.6"  data-index="4"><img src="<?php echo  $template_directory; ?>/assets/images/hero/modo.png" alt=""></div>
						<div class="img layer blur" data-depth="-0.7"  data-index="4"><img src="<?php echo  $template_directory; ?>/assets/images/hero/casino.png" alt=""></div>
						<div class="img layer logo" data-depth="0.2"  data-index="2"><img src="<?php echo  $template_directory; ?>/assets/images/hero/paypal.png" alt="" ></div>
						<div class="img layer blur" data-depth="0.5"  data-index="3.5"><img src="<?php echo  $template_directory; ?>/assets/images//hero/gamepad.png" alt="" ></div>
						<div class="img layer logo" data-depth="-0.7"  data-index="4"><img src="<?php echo  $template_directory; ?>/assets/images/hero/mercado-pago.png" alt=""  ></div>
						<div class="img layer text-card" data-depth="0.6"  data-index="3"><img src="<?php echo  $template_directory; ?>/assets/images/hero/text-card-1.png" alt=""></div>
					</div>
				</div>
			</div>			
		</div>
	</section>

  <?php
    $methods = get_field('methods');
  ?>
	<section class="methods-section">
		<div class="anchor" id="<?php echo $methods['section_id']; ?>"></div>
		<div class="container">
			<div class="text-content">
        <?php
          if ($methods['tag']) :
        ?>
				<div class="tag tag-text mob-tag-text" data-animate="swim-top"><?php echo $methods['tag']; ?></div>
        <?php
          endif;
          if ($methods['title']) :
        ?>
				<h2 class="title title-2 mob-title-2" data-animate="word"><?php echo $methods['title']; ?></h2>
        <?php
          endif;
          if ($methods['text']) :
        ?>
				<p class="text body-1 mob-body-1" data-animate="swim-top">
          <?php echo $methods['text']; ?>
				</p>
        <?php
          endif;
        ?>
			</div>
			<div class="methods-section__wrapper">
        <?php
          foreach($methods['methods_list'] as $item) :
            if ($item['image'] && $item['title']) :
        ?>
          <div class="method-item" data-animate="swim-top">
            <div class="img">
              <img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $item['image']['url']; ?>" alt="<?php echo $item['image']['alt']; ?>">
            </div>
            <p class="text description-2 mob-description-2">
             <?php echo $item['title']; ?>
            </p>
          </div>
        <?php
            endif;
          endforeach;
        ?>

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

  <?php
    $offer = get_field('offer');
  ?>
	<section class="benefits-section gradient-section">
		<div class="anchor" id="<?php echo $offer['section_id']; ?>"></div>
		<div class="gradient" data-animate="fade">
		</div>
		<div class="container">
      <?php
        if ($offer['tag']) :
      ?>
			<div class="tag tag-text mob-tag-text" data-animate="swim-top"><?php echo $offer['tag']; ?></div>
      <?php
        endif;
        if ($offer['title']) :
      ?>
			<h2 class="title title-2 mob-title-2" data-animate="word">
        <?php echo $offer['title']; ?>
			</h2>
      <?php
        endif;
      ?>
      <?php
        if (!wp_is_mobile()) :
          function splitArrayIntoTwo($array) {
            $firstPart = [];
            $secondPart = [];
        
            foreach ($array as $index => $element) {
                if ($index % 2 === 0) {
                    $firstPart[] = $element;
                } else {
                    $secondPart[] = $element;
                }
            }        
            return [$firstPart, $secondPart];
        }        
        $preparedArray = splitArrayIntoTwo($offer['offer_cards']);          
      ?>
        <div class="benefits__wrapper pc-version">
          <?php
            foreach($preparedArray as $key=>$array) :
          ?>
          <div class="benefits__col">
            <?php
              foreach($array as $index=>$item) :
                if ($item['title'] && $item['image']) :
            ?>
              <div class="benefit-card <?php if (($key == 0 && $index == 1) || ($key == 1 && $index == 0)) echo '-higher'; ?>" data-animate="swim-top">
                <div class="img">
                  <img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $item['image']['pc']['url']; ?>" alt="<?php echo $item['image']['pc']['alt']; ?>">
                </div>
                <p class="description description-1 mob-description-1">
                  <?php echo $item['title']; ?>
                </p>
                <?php
                  if ($item['text']) :
                ?>
                  <p class="text body-1 mob-body-1">
                    <?php echo $item['text']; ?>
                  </p>
                <?php
                  endif;
                ?>
              </div>
            <?php
                endif;
              endforeach;
            ?>
          </div>
          <?php
            endforeach;
          ?>
        </div>
      <?php
        else :
      ?>
        <div class="benefits__wrapper mobile-version">
            <?php
              foreach($offer['offer_cards'] as $index=>$item) :
                if ($item['title'] && $item['image']) :
            ?>
              <div class="benefit-card" data-animate="swim-top">
                <div class="img">
                  <img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $item['image']['mob']['url']; ?>" alt="<?php echo $item['image']['mob']['alt']; ?>">
                </div>
                <p class="description description-1 mob-description-1">
                  <?php echo $item['title']; ?>
                </p>
                <?php
                  if ($item['text']) :
                ?>
                  <p class="text body-1 mob-body-1">
                    <?php echo $item['text']; ?>
                  </p>
                <?php
                  endif;
                ?>
              </div>
            <?php
                endif;
              endforeach;
            ?>
        </div>
      <?php
        endif;
      ?>
		</div>
	</section>

  <?php
    $contacts = get_field('contacts');
  ?>
	<section class="contacts-section">
		<div class="anchor" id="<?php echo $contacts['section_id']; ?>"></div>
		<div class="container">
			<div class="text-content">
      <?php
          if ($contacts['tag']) :
        ?>
				<div class="tag tag-text mob-tag-text" data-animate="swim-top"><?php echo $contacts['tag']; ?></div>
        <?php
          endif;
          if ($contacts['title']) :
        ?>
				<h2 class="title title-2 mob-title-2" data-animate="word"><?php echo $contacts['title']; ?></h2>
        <?php
          endif;
          if ($contacts['text']) :
        ?>
				<p class="text body-1 mob-body-1" data-animate="swim-top">
          <?php echo $contacts['text']; ?>
				</p>
        <?php
          endif;
        ?>
			</div>
			<div class="contacts__wrapper">
				<div class="contacts__wrapper-left" data-animate="swim-top">
          <?php
            if ($contacts['mail_icon']) :
          ?>
            <div class="icon">
              <img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $contacts['mail_icon']['url']; ?>" alt="<?php echo $contacts['mail_icon']['alt']; ?>">
            </div>
          <?php
            endif;
            if ($contacts['mail_title']) :
          ?>
					<p class="title description-2 mob-description-2">
            <?php echo $contacts['mail_title']; ?>
					</p>
          <?php
            endif;
            if ($contacts['mail_subtitle']) :
          ?>
					<p class="text body-1 mob-body-1">
						<?php echo $contacts['mail_subtitle']; ?>
					</p>
          <?php
            endif;
            if ($contacts['mail']['url'] && $contacts['mail']['title']) :
          ?>
					<a href="<?php echo $contacts['mail']['url']; ?>" target="<?php echo $contacts['mail']['target']; ?>" class="default-link link-text mob-link-text">
						<?php echo $contacts['mail']['title']; ?>
					</a>
          <?php
            endif;
          ?>
				</div>
				<div class="contacts__wrapper-right" data-animate="swim-top">
					<div class="form-wrapper">
						<div class="form">
              <?php
                echo do_shortcode('[contact-form-7 id="15ab133"]');
              ?>
						</div>
						<div class="thanks-container">
              <?php
                $thanks_window = $contacts['thanks_window'];
                if ($thanks_window['image']) :
              ?>
							<div class="img">
								<img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $thanks_window['image']['url']; ?>" alt="<?php echo $thanks_window['image']['alt']; ?>">
							</div>
              <?php
                endif;
                if ($thanks_window['title']) :
              ?>
							<p class="title title-2 mob-title-2">
                <?php echo $thanks_window['title']; ?>
							</p>
              <?php
                endif;
                if ($thanks_window['text']) :
              ?>
							<p class="text body-1 mob-body-1">
                <?php echo $thanks_window['text']; ?>
							</p>
              <?php
                endif;
              ?>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
</main>

<?php
  get_footer();
?>