<?php
$datas = $args['data'];
$elements = isset($datas['element']) ? $datas['element'] : '';
$hr = !empty($datas['hr']) && $datas['hr'] == true ? '' : 'last:after:hidden';
?>


<div class="container mx-auto py-20">

  <div class="relative flex flex-col gap-20 md:gap-36  md:max-w-[43.75rem] lg:max-w-[62.25rem] mx-auto">
    <?php
    if (!empty($elements)) :
      foreach ($elements as $element) :
    ?>
        <div class="relative flex flex-col md:flex-row after:content-[''] after:block <?php echo $hr; ?> after:h-[1px] after:-bottom-12 md:after:-bottom-20 after:w-full after:absolute after:left-0  after:bg-[#D9D9D9] gap-10 scroll-appear">
          <div class="w-full md:w-4/12 flex ">
            <?php
            if (isset($element['gauche']) && is_array($element['gauche'])) {
              echo '<div class="uppercase font-heading max-w-xs text-[19px]  leading-normal text-balance">' . $element['gauche']['titre'] . '</div>';
            } ?>
          </div>
          <div class="w-full md:w-8/12 wysiwyg">
            <?php
            if (isset($element['droite']) && is_array($element['droite'])) {
              echo '<div class="">' . $element['droite']['texte'] . '</div>';
            } ?>
          </div>
        </div>
    <?php endforeach;
    endif; ?>

  </div>

</div>