<?php
/* Template Name: Web Lyft Blog */
get_header();
?>

<style>
body {background:#0b0b0b; color:#eee; font-family:"Poppins",sans-serif;}
.container {max-width:960px; margin:40px auto; padding:0 20px;}
.blog-post {background:#181818; border:1px solid #2C3E91; border-radius:10px; padding:25px; margin-bottom:30px; box-shadow:0 3px 8px rgba(0,0,0,0.5);}
.blog-post h2 a {color:#D4AF37; text-decoration:none;}
.blog-post h2 a:hover {color:#fff;}
.blog-post p {color:#ccc;}
.readmore {display:inline-block; margin-top:10px; background:linear-gradient(90deg,#2C3E91,#D4AF37); color:#fff; padding:10px 18px; border-radius:5px; text-decoration:none; font-weight:600;}
.readmore:hover {opacity:0.8;}
</style>

<div class="container">
  <h1 style="text-align:center;color:#D4AF37;">Web Lyft Digital Blog</h1>
  <p style="text-align:center;color:#aaa;">Insights, Tools, and Growth Tips for Small Businesses</p>

  <?php
  $args = array(
    'post_type' => 'post',
    'posts_per_page' => 6
  );
  $query = new WP_Query($args);

  if ($query->have_posts()) :
    while ($query->have_posts()) : $query->the_post();
  ?>
      <div class="blog-post">
        <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
        <p><?php the_excerpt(); ?></p>
        <a href="<?php the_permalink(); ?>" class="readmore">Read More</a>
      </div>
  <?php
    endwhile;
    wp_reset_postdata();
  else :
    echo '<p>No posts found.</p>';
  endif;
  ?>
</div>

<?php get_footer(); ?>