index.php file; ACF field displaying incorrectly

index.php

<?php get_header(); ?>

			<div id="content">

				<div id="inner-content" class="wrap cf">	

			$posts = get_field('featured_post_top', 'option');

if( $posts ): ?>
    <div class="featured-post-top">
    <?php foreach( $posts as $post): // variable must be called $post (IMPORTANT) ?>
        <?php setup_postdata($post); ?>
        
            <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
             <p class="featured-post-category"><?php the_category( ','); ?></p>
            <?php if ( has_post_thumbnail() ) : ?>
    <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
        <?php the_post_thumbnail('bones-600'); ?>
    </a>
    <?php endif; ?>	
        
    <?php endforeach; ?>
    </div>
    <?php wp_reset_postdata(); // IMPORTANT - reset the $post object so the rest of the page works correctly ?>
<?php endif; ?>	
</div>

						<main id="main" class="m-all t-2of3 d-5of7 cf" role="main" itemscope itemprop="mainContentOfPage" itemtype="http://schema.org/Blog">				
									

									<ul class="grid-wrapper">

							<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

							<li class="grid-item">


								<section class="entry-content cf">


									<?php if ( has_post_thumbnail() ) : ?>
    <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
        <?php the_post_thumbnail('grid-thumbnail'); ?>
    </a>
<?php endif; ?>
								</section>

								<header class="article-header">

									 <p class="grid-category"><?php the_category( ','); ?></p>

									 <div class="header-border"></div>

									 <h1 class="h2 entry-title"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>

								</header>


							<?php endwhile; ?>

					

							<?php else : ?>

									<article id="post-not-found" class="hentry cf">
											<header class="article-header">
												<h1><?php _e( 'Oops, Post Not Found!', 'bonestheme' ); ?></h1>
										</header>
											<section class="entry-content">
												<p><?php _e( 'Uh Oh. Something is missing. Try double checking things.', 'bonestheme' ); ?></p>
										</section>
										<footer class="article-footer">
												<p><?php _e( 'This is the error message in the index.php template.', 'bonestheme' ); ?></p>
										</footer>
									</article>

							<?php endif; ?>

						</li>

					</ul>


						</main>


							<div class="featured-top">
								<?php 


							<div class="featured-center">
								<?php 

$posts = get_field('featured_post_center', 'option');

if( $posts ): ?>
    <div class="featured-post-center">
    <?php foreach( $posts as $post): // variable must be called $post (IMPORTANT) ?>
        <?php setup_postdata($post); ?>
        
            <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
             <p class="featured-post-category"><?php the_category( ','); ?></p>
            <?php if ( has_post_thumbnail() ) : ?>
    <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
        <?php the_post_thumbnail('bones-300'); ?>
    </a>
    <?php endif; ?>	
        
    <?php endforeach; ?>
    </div>
    <?php wp_reset_postdata(); // IMPORTANT - reset the $post object so the rest of the page works correctly ?>
<?php endif; ?>	
</div>


<div class="featured-bottom">
<?php 
$posts = get_field('featured_post_bottom', 'option');

if( $posts ): ?>
    <div class="featured-post-bottom">
    <?php foreach( $posts as $post): // variable must be called $post (IMPORTANT) ?>
        <?php setup_postdata($post); ?>
        
            <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
             <p class="featured-post-category"><?php the_category( ','); ?></p>
            <?php if ( has_post_thumbnail() ) : ?>
    <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
        <?php the_post_thumbnail('bones-600'); ?>
    </a>
    <?php endif; ?>	
        
    <?php endforeach; ?>
    </div>
    <?php wp_reset_postdata(); // IMPORTANT - reset the $post object so the rest of the page works correctly ?>
<?php endif; ?>	
</div>


<!-- POPUlAR THIS MONTH -->
			<div class="popular-wrapper">
				<div class="popular-content">
					<?php 
						$i = 1;
						while($i < 4) { 
							$post_object = get_field('post_' . $i . '_month', 'option');
							if( $post_object ): 
									// override $post
									$post = $post_object;
									setup_postdata( $post );
									$the_title = get_the_title();
									$the_link = get_permalink();
									$thecategory = get_the_terms( $post->ID, 'category');
									if ($thecategory) {
									foreach ( $thecategory as $term ) {
											$category = $term->name;
											$category_slug = $term->slug;
											break 1;
										}
									}

						?>
							<div class="popular_item">
								<div class="pop_img"><a href="<?php echo $the_link; ?>"><?php the_post_thumbnail('grid-thumbnail'); ?></a></div>
								<div class="pop_txt">
									<div class="pop_cat serif_display_fancy s12 g3 non_alias ls1 upper"><?php echo $category; ?></div>
									<div class="pop_item_title sans_light s13"><a href="<?php echo $the_link; ?>"><?php echo $the_title; ?></a></div>
								</div>
							</div>
						<?php 

						wp_reset_postdata();
						endif;
						$i++;
						} // end while
					?>
				</div>

			</div>
		




						<img src="http://localhost:8888/designsponge/wp-content/uploads/2016/07/asterisk.png" class="asterisk" alt="asterisk">

							<?php previous_posts_link( '« previous posts' ); ?>

									<div class="page-navigation"><?php next_posts_link( 'More Posts', 0 ); ?></div>


				</div>

			</div>


<?php get_footer(); ?>