@extends('layouts.app')
@section('content')
<div class="px-4 lg:px-10 py-10">
<p class="pulso-label">Diary</p>
<h1 class="text-4xl font-display mt-2">Health talks & stories.</h1>
<div class="mt-8 grid md:grid-cols-3 gap-4">
@foreach($posts as $p)
<a href="{{ route('blog.show', $p) }}" class="pulso-card overflow-hidden group">
<img src="{{ asset('images/pulso/bistro-charlo.avif') }}" class="h-[200px] w-full object-cover">
<div class="p-5">
<p class="text-[11px] tracking-[0.2em] uppercase text-ink-400">{{ $p->published_at?->format('d M Y') ?? '' }}</p>
<h3 class="font-semibold mt-1 group-hover:underline">{{ $p->title }}</h3>
<p class="text-[13px] text-ink-500 line-clamp-2 mt-1">{{ $p->excerpt }}</p>
</div>
</a>
@endforeach
</div>
<div class="mt-8">{{ $posts->links() }}</div>
</div>
@endsection