@extends('layouts.public')
@section('content')
<x-page-hero kicker="Reading for owners" title="Insights" lede="Systems, admissions, SOPs, KPIs and a 90-day installation. Not a training poster." :crumbs="$crumbs" />
<div class="mx-auto grid max-w-6xl gap-4 px-5 py-16 md:grid-cols-2 lg:py-20">
    @foreach($insights as $post)
        <a href="{{ route('insights.show', $post) }}" class="leak flex h-full flex-col {{ $loop->first ? 'md:col-span-2' : '' }}">
            <p class="text-[11px] uppercase tracking-[0.16em] text-brass">{{ optional($post->published_at)->format('j M Y') ?: 'Insight' }}</p>
            <h2 class="mt-5 text-2xl font-semibold tracking-tight {{ $loop->first ? 'sm:text-3xl' : '' }}">{{ $post->title }}</h2>
            <p class="mt-3 max-w-2xl text-sm leading-6 text-muted">{{ $post->excerpt }}</p>
            <span class="mt-6 inline-flex items-center gap-1 text-sm font-semibold">Read <i data-lucide="arrow-right" class="h-4 w-4"></i></span>
        </a>
    @endforeach
</div>
@endsection