<?php $__env->startSection('title', 'Blogs - ' . config('app.name')); ?>
<?php $__env->startSection('meta_description', 'Read the latest study abroad articles, visa guidance, and destination insights.'); ?>

<?php $__env->startPush('styles'); ?>
<style>
    .blog-wrap { width: min(1180px, calc(100% - 28px)); margin: 0 auto; }
    .blog-hero { padding: 34px 0 24px; }
    .blog-hero-card { display:grid; grid-template-columns:1.1fr .9fr; gap:28px; padding:30px; border-radius:28px; background:linear-gradient(135deg,#f8fafc,#eef2ff); border:1px solid #dbe4f0; box-shadow:0 18px 45px rgba(15,23,42,.08); }
    .blog-hero h1 { margin:0 0 12px; font-size:clamp(2.2rem,4vw,3.8rem); line-height:1.02; font-weight:900; color:#0f172a; }
    .blog-hero p { margin:0; color:#475569; line-height:1.7; font-size:1rem; max-width:58ch; }
    .blog-hero img { width:100%; height:280px; object-fit:cover; border-radius:24px; }
    .blog-toolbar { display:grid; grid-template-columns: 1fr auto; gap:16px; align-items:center; margin:24px 0 18px; }
    .blog-search { display:flex; gap:12px; }
    .blog-search input { flex:1; padding:12px 14px; border:1px solid #d7dfeb; border-radius:14px; }
    .blog-search button { padding:12px 18px; border:0; border-radius:14px; background:#0f172a; color:#fff; font-weight:700; }
    .blog-cats { display:flex; gap:10px; flex-wrap:wrap; }
    .blog-cats a { padding:10px 16px; border:1px solid #d7dfeb; border-radius:999px; text-decoration:none; color:#334155; font-weight:700; background:#fff; }
    .blog-cats a.is-active { background:#0f172a; color:#fff; border-color:#0f172a; }
    .blog-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:22px; padding-bottom:42px; }
    .blog-card { background:#fff; border:1px solid #e2e8f0; border-radius:22px; overflow:hidden; box-shadow:0 16px 36px rgba(15,23,42,.06); }
    .blog-card img { width:100%; height:220px; object-fit:cover; display:block; }
    .blog-card__body { padding:20px; }
    .blog-meta { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:10px; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#64748b; }
    .blog-card h3 { margin:0 0 10px; font-size:1.25rem; line-height:1.3; }
    .blog-card h3 a { color:#0f172a; text-decoration:none; }
    .blog-card p { margin:0 0 16px; color:#475569; line-height:1.7; }
    .blog-read { color:#c1121f; font-weight:800; text-decoration:none; }
    @media (max-width: 960px) {
        .blog-hero-card { grid-template-columns:1fr; }
        .blog-grid { grid-template-columns: 1fr 1fr; }
        .blog-toolbar { grid-template-columns:1fr; }
    }
    @media (max-width: 640px) {
        .blog-grid { grid-template-columns: 1fr; }
        .blog-search { flex-direction:column; }
        .blog-hero-card { padding:20px; }
    }
</style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
<section class="blog-hero">
    <div class="blog-wrap">
        <div class="blog-hero-card">
            <div>
                <p class="pro-eyebrow" style="margin-bottom:10px;">Fresh Articles</p>
                <h1>Study abroad insights, visa tips, and practical admissions advice.</h1>
                <p>Browse destination guides, counselor strategies, and approved articles published by the GPS team.</p>
            </div>
            <?php if($featuredArticle && $featuredArticle->featured_image_url): ?>
                <img src="<?php echo e($featuredArticle->featured_image_url); ?>" alt="<?php echo e($featuredArticle->title); ?>">
            <?php endif; ?>
        </div>

        <div class="blog-toolbar">
            <form method="GET" class="blog-search">
                <input type="text" name="search" value="<?php echo e(request('search')); ?>" placeholder="Search blog articles...">
                <?php if(request('category')): ?>
                    <input type="hidden" name="category" value="<?php echo e(request('category')); ?>">
                <?php endif; ?>
                <button type="submit">Search</button>
            </form>
            <div class="blog-cats">
                <a href="<?php echo e(route('blogs.index')); ?>" class="<?php echo e(request('category') ? '' : 'is-active'); ?>">All</a>
                <?php $__currentLoopData = $categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <a href="<?php echo e(route('blogs.index', ['category' => $category->slug])); ?>" class="<?php echo e(request('category') === $category->slug ? 'is-active' : ''); ?>"><?php echo e($category->name); ?></a>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
        </div>

        <div class="blog-grid">
            <?php $__empty_1 = true; $__currentLoopData = $articles; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $article): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                <article class="blog-card">
                    <?php if($article->featured_image_url): ?>
                        <a href="<?php echo e(route('blogs.show', $article->slug)); ?>"><img src="<?php echo e($article->featured_image_url); ?>" alt="<?php echo e($article->title); ?>"></a>
                    <?php endif; ?>
                    <div class="blog-card__body">
                        <div class="blog-meta">
                            <span><?php echo e($article->category?->name); ?></span>
                            <span><?php echo e(optional($article->published_at)->format('d M Y')); ?></span>
                        </div>
                        <h3><a href="<?php echo e(route('blogs.show', $article->slug)); ?>"><?php echo e($article->title); ?></a></h3>
                        <p><?php echo e($article->excerpt ?: \Illuminate\Support\Str::limit(strip_tags($article->content), 140)); ?></p>
                        <a class="blog-read" href="<?php echo e(route('blogs.show', $article->slug)); ?>">Read article</a>
                    </div>
                </article>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                <div class="blog-card__body" style="grid-column:1/-1;background:#fff;border:1px solid #e2e8f0;border-radius:22px;padding:28px;">
                    <h3 style="margin:0 0 8px;">No articles found</h3>
                    <p style="margin:0;color:#64748b;">Try a different keyword or category filter.</p>
                </div>
            <?php endif; ?>
        </div>

        <?php echo e($articles->links()); ?>

    </div>
</section>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.public', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /home/gpsmigration/public_html/gpsmigration.com/resources/views/blogs/index.blade.php ENDPATH**/ ?>