@foreach ($blogCategories as $category)
<section class="strategic-section">
    <div class="container">
  
        <!-- Section Header -->
        <div class="section-header">
            <div class="section-icon">
                <i class="fa fa-compass"></i>
            </div>
            <h2 class="section-title">{{ $category->name }}</h2>
            <div class="section-divider"></div>
        </div>
        <!-- Articles Grid -->
        <div class="strategic-grid">
            <!-- Left Column - Small Articles -->
            <div class="strategic-left">
                @foreach ($category->blogs as $index => $blog)
                    @if ($index > 0 && $index <= 4)
                    <article class="strategic-article-small">
                        <div class="article-image-thumb">
                            <a href="{{ $blog->link }}">
                                <img src="{{ $blog->image_path }}" alt="{{ $blog->name }}">
                            </a>
                        </div>
                        <div class="article-badge badge-strategic">{{ $category->name }}</div>
                        <div class="article-content">
                            <h3 class="article-title-thumb">
                                <a href="{{ $blog->link }}">{{ $blog->name }}</a>
                            </h3>
                        </div>
                    </article>
                    @endif
                @endforeach
            </div>

            <!-- Right Column - Large Featured Article -->
            @if ($category->blogs->isNotEmpty())
            <article class="strategic-article-large">
                @php
                    $featuredBlog = $category->blogs->first();
                @endphp
                <div class="article-image-featured">
                    <a href="{{ $featuredBlog->link }}">
                        <img src="{{ $featuredBlog->image_path }}" alt="{{ $featuredBlog->name }}">
                    </a>
                </div>
                <div class="article-badge badge-strategic">{{ $category->name }}</div>
                <div class="article-content">
                    <h2 class="article-title-featured">
                        <a href="{{ $featuredBlog->link }}">{{ $featuredBlog->name }}</a>
                    </h2>
                    <div class="article-meta">
                        <span class="article-author">{{ $featuredBlog->author->name ?? '' }}</span>
                        <span class="article-date">{{ $featuredBlog->date ?? '' }}</span>
                    </div>
                    <div class="article-excerpt">
                        <p>{!! $featuredBlog->short_desc !!}</p>
                    </div>
                    <div class="article-stats">
                        <span class="stat-item"><i class="fa fa-comments"></i> 0</span>
                    </div>
                </div>
            </article>
            @endif
        </div>
    </div>
</section>
@endforeach