
    <!-- Most Viewed Post (LCP Optimized) -->
<section class="most-viewed-post bg-transparent">
  <div class="container">
    <hr>
    <h2 style="border-left:3px solid black; padding-left:5px; class="text-start mb-4 fw-bold text-dark">
    <?php get_theme_mod('howcan_most_viewed_title'); ?>
    </h2>

    <?php
    // LCP Optimized Query
    $args = array(
      'posts_per_page' => 1,
      'meta_key'       => 'howcan_post_views_count',
      'orderby'        => 'meta_value_num',
      'order'          => 'DESC',
      'no_found_rows'  => true, // Better performance
      'ignore_sticky_posts' => true
    );
    $most_viewed = new WP_Query($args);
    if ($most_viewed->have_posts()) :
      while ($most_viewed->have_posts()) : $most_viewed->the_post(); ?>

        <article class="card border-0 bg-transparent shadow-none text-start">
          <?php if (has_post_thumbnail()) :
            // LCP Optimized Image with lazy loading disabled for first image
            $img_url = get_the_post_thumbnail_url(get_the_ID(), 'large');
          ?>
            <a href="<?php the_permalink(); ?>" aria-label="<?php the_title_attribute(); ?>">
              <img 
                src="<?php echo esc_url($img_url); ?>" 
                class="img-fluid rounded-4 lcp-image"
                alt="<?php the_title_attribute(); ?>"
                width="100%"
                height="50%"
                fetchpriority="high"
                decoding="async" />
            </a>
          <?php endif; ?>

          <div class="card-body mt-3">
            <h1 class="card-title h3 fw-bold">
              <a href="<?php the_permalink(); ?>" class="text-dark text-decoration-none">
                <?php the_title(); ?>
              </a>
            </h1>
            
            <div class="row container">
            <p class="text-muted"><time datetime="<?php echo get_the_date('c'); ?>" itemprop="datePublished"><?php echo get_the_date(); ?></time></p> ,
                <p class="text-muted pl-2">
          <?php
            if ( get_theme_mod( 'howcan_enable_post_views', true ) ) {
              echo '<div class="post-views">' . esc_html( howcan_get_post_views( get_the_ID() ) ,'howcan' ).'</div>';
            }
            ?>
                </p>
         
            </div>  
            <p class="card-text text-dark-50 mb-3">
              <?php echo esc_html(wp_trim_words(get_the_excerpt(), 50)); ?>
            </p>
            <a href="<?php the_permalink(); ?>" class="btn btn-dark rounded-pill px-4">
              Read More
            </a>
          </div>
        </article>

      <?php endwhile;
      wp_reset_postdata();
    else : ?>
      <p class="text-center text-light">No posts found.</p>
    <?php endif; ?>

  </div>
</section>