I am giving you idea for that, you have to use jquery for popup. below syntax will give you current post data in popup html.

 while ($the_query->have_posts()): $the_query->the_post(); 

        echo '<div class="non-popup">';
            echo '<div class="card-title" id="card-'.get_the_title.'">'.get_the_title().'</div>';
               write you front end code + html (http://screenshotlink.ru/eff3d7431f4fbcd6a03ca5fcbbc41cdd.png) 
        echo '</div>';
        echo '<div class="popup" style="display:none;">';
            
           echo '<div class="popup-title">'.get_the_title().'</div>';
         
             write your popup html + code      

        echo '</div>';
  
endwhile; 

here is your jquery:

  $(document).ready(function(){
      $(".card-title").on('click',function(){          
           $(this).siblings().css('display','block'); 
      });
  });

I am giving you an idea for this, you have to use jQuery for the popup and the below syntax will give you the current post data in a HTML popup.

 while ($the_query->have_posts()): $the_query->the_post(); 

        echo '<div class="non-popup">';
            echo '<div class="card-title" id="card-'.get_the_title.'">'.get_the_title().'</div>';
               write you front end code + html (http://screenshotlink.ru/eff3d7431f4fbcd6a03ca5fcbbc41cdd.png) 
        echo '</div>';
        echo '<div class="popup" style="display:none;">';
            
           echo '<div class="popup-title">'.get_the_title().'</div>';
         
             write your popup html + code      

        echo '</div>';
  
endwhile; 

Here is the jQuery:

  $(document).ready(function(){
      $(".card-title").on('click',function(){          
           $(this).siblings().css('display','block'); 
      });
  });