Why my the_permalink doesn't work?

My client bought this theme (Peachfolio) and brought me to make some changes. I am not a professional programmer, so I’m facing some difficulties.

There is a section at the footer.php that displays a list of the last four posts (custom post types = portfolio) in a given category with their thumbnails.

These thumbnails have a link that opens a fancybox, but my client wants to open the post. I’ve tried using the_permalink in various ways but never got the expected result.

Below is the code in question. I hope someone can help me. Thanks! (The test page is here: https://historica.com.br/books/)

<div id="recent-works">
<h1 class="title"><?php echo peachfolio_option('recent_works_title', '?') ?></h1>
<ul id="portfolio-items" class="clearfix">
<?php
query_posts(array('post_type' => 'portfolio', 'posts_per_page' => peachfolio_option('recent_works_count', 4)));
$count = 1;
while (have_posts()) {
the_post();
echo '<li class="' . (!($count++ % 4) ? 'last' : '') . '">';
echo '<a href="' . wp_get_attachment_url(get_post_thumbnail_id()) . '" class="fancybox">';
echo the_post_thumbnail('recent');
echo '</a>';
echo '<span class="title">';
the_title();
echo '</span>';
echo '<span class="cat">';
echo get_the_category_list();
echo '</span>';
echo '</li>';
}
?>
</ul>
</div>