<?php get_header(); ?>
<main>

<div class=" fix about-section mb-65">
        <div class="container">
            <div class="row justify-content-between align-items-center">
                <div class="col-lg-5 col-sm-5 col-md-4 col-12">
                    <div class="tp-hero-4__section-box pb-15">
                        <h3 class="tp-hero-4-title wow tpfadeUp" data-wow-duration=".9s" data-wow-delay=".5s">
                            Blogs
                        </h3>
                    </div>
                    <div class="tp-hero-4__content wow tpfadeUp" data-wow-duration=".9s" data-wow-delay=".7s">
                        <p>
                        Welcome to our blog – a hub where inspiration and knowledge converge! Immerse yourself in our latest articles, rich with insights, trends, and engaging content designed to enlighten and entertain. Join our journey of discovery, and let our newest posts inspire you with fresh perspectives and valuable knowledge.
                        </p>
                    </div>
                </div>
                <div class="col-lg-7 col-md-8 col-sm-7 col-12">
                    
                    <img src="https://wavecolordrop.com/wp-content/uploads/2023/10/about-col-image.png" alt="">
                    
                </div>
            </div>
        </div>
    </div>
    <!-- blog-area-start -->
    <div class="tp-blog-4__area">
        <div class="container custom-container-3">
            <div class="row">
                <div class="col-xl-12">
                    <div class="tp-blog-4__section-box text-center mb-55">
                        <?php //dynamic_sidebar('most-recent-news'); 
                        ?>
                        <span class="tp-section-subtitle-5"><?php the_field('latest_buzz') ?></span>
                        <h4 class="tp-section-title-2"><?php the_field('stay_informed_–_read') ?>
                            </span></h4>
                    </div>
                </div>
            </div>
            <div class="row text-sm-center text-md-start">
                <?php
                $wpnews = array(
                    'post_type' => 'blogs',
                    'post_status' => 'publish',
                    'order'          => 'DESC',
                    // 'posts_per_page' => 6
                );
                $news_query = new WP_Query($wpnews);
                while ($news_query->have_posts()) {
                    $news_query->the_post();
                    $news_image_path = wp_get_attachment_image_src(
                        get_post_thumbnail_id(),
                        'large'
                    );
                ?>

                    <div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-6 text-sm-center text-lg-start mb-50 wow tpfadeUp" data-wow-duration=".9s" data-wow-delay=".3s">
                        <div class="tp-blog-4__item">
                            <a href="<?php the_permalink(); ?>">
                                <div class="tp-blog-4__thumb p-relative">
                                    <img src="<?php echo $news_image_path[0] ?>" alt="">
                                </div>
                                <div class="tp-blog-4__content">
                                    <h4 class="tp-blog-4__title">
                                        <?php the_title(); ?>
                                    </h4>
                                </div>
                                <div class="tp-blog-4__meta">
                                    <p><?php the_excerpt(); ?></p>
                                    <p>
                                    <?php echo get_the_date(); ?>&nbsp; &nbsp;
                                    </p>
                                    
                        <?php //echo get_the_author_meta('display_name', get_the_author_meta());?>
                                </div>
                        </div>
                        </a>
                    </div>
                <?php } ?>

            </div>
        </div>
    </div>
    <!-- blog-area-end -->
  

</main>
<?php //dynamic_sidebar('instagram-slider-section'); 
?>
<script src="https://cdn.jsdelivr.net/npm/flexslider@2.7.2/jquery.flexslider.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/flexslider@2.7.2/flexslider.min.css" rel="stylesheet">
<div class="container-fluid p-0 mb-5">
    <div class="row textr-center">
        <h3 class="mb-4 mb-md-5 text-center title tp-section-title-2">Follow our <span class="common-text-color">Instagram Account</span></h3>
        <div class="col-lg-12">
            <?php //echo do_shortcode('[insta-gallery id="0"]'); ?>
        </div>
    </div>
</div>
<style>
    img.instagram-gallery-item__media:hover,
    video.instagram-gallery-item__media:hover {
        transform: scale(1.1);
    }
</style>
<?php get_footer(); ?>