@extends('client.raffles.layouts.app')
@section('content')
    <section class="career">

        <div class="container-fluid">
            <section class="section ">
                <div class="blog-hero">
                    <img src="{{ $page->banner }}" alt="Students studying abroad">
                    <div class="blog-hero-overlay">
                        <span class="blog-category">Study Abroad</span>
                        <h1 class="blog-title text-white">{{ $page->title }}
                        </h1>
                        <div class="blog-meta">
                            <span>{{ $page->created_by }}</span>
                            <span class="blog-meta-divider">|</span>
                            <span>{{ $page->created_at }}</span>
                            <span class="blog-meta-divider">|</span>
                            <span>12 min read</span>
                        </div>
                    </div>
                </div>
            </section>
            <section>
                <div class="container">
                    <div class="row">
                        <div class="col col-md-8">
                            <div class="blog-detail-box">
                                {!! $page->description !!}

                            </div>

                        </div>
                        <div class="col col-md-4">
                            <div class="blog-detail-box">
                                <!-- Popular Posts Widget -->
                                <div class="sidebar-widget">
                                    <h3 class="widget-title">Popular Posts</h3>
                                    <ul class="popular-posts-list">
                                        @foreach ($blogs->take(3) as $value)
                                            <li>
                                                <a href="{{ route('blog.single', $value->slug) }}"
                                                    class="popular-post-item">
                                                    <div class="popular-post-image">
                                                        <img src="{{ asset($value->image) }}" alt="Scholarship post">
                                                    </div>
                                                    <div>
                                                        <div class="popular-post-title">{{ $value->short_description }}
                                                        </div>
                                                        <div class="popular-post-date">{{ $value->created_at }}</div>
                                                    </div>
                                                </a>
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>
                                <div class="sidebar-widget cta-widget">
                                    <h3 class="cta-title">Need Personalized Guidance?</h3>
                                    <p class="cta-text">Our education consultants are here to help you find the perfect
                                        university match.</p>
                                    <a href="/contact-us" class="cta-button">Book a Free Consultation</a>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>

            </section>


        </div>











    </section>
@endsection