@php
    $messages = [
        ['title' => 'Message from the Chief Minister', 'designation' => 'Content pending', 'message' => 'Official message content is not yet available in the current static frontend.', 'url' => null],
        ['title' => 'Message from the Vice Chairman', 'designation' => 'Content pending', 'message' => 'Official message content is not yet available in the current static frontend.', 'url' => null],
        ['title' => 'Secretary, Srimanta Sankaradeva Kalakshetra Society', 'designation' => 'Institutional Message', 'message' => 'Kalakshetra continues to serve as a living cultural space where research, performance, museums and public learning come together for the people of Assam and visitors from across the world.', 'url' => url('/about/organisation')],
    ];
@endphp

<section class="content-container my-space-xl py-space-md" id="home-v2-messages">
    @include('frontend.partials.section-heading', [
        'eyebrow' => 'Message',
        'title' => 'Institutional Messages',
        'summary' => 'Confirmed message content is reused where available. Pending content is shown only as structure.',
    ])

    <div class="grid grid-cols-1 md:grid-cols-3 gap-space-lg">
        @foreach ($messages as $message)
            <article class="bg-surface-container-lowest rounded-xl border border-surface-container shadow-md p-space-md h-full">
                <span class="font-label-sm text-label-sm text-primary uppercase block mb-space-xs">{{ $message['designation'] }}</span>
                <h3 class="font-headline-sm text-headline-sm text-on-surface font-bold">{{ $message['title'] }}</h3>
                <p class="font-body-sm text-body-sm text-on-surface-variant leading-relaxed">{{ $message['message'] }}</p>
                @if ($message['url'])
                    <a class="font-title-md text-title-md text-primary font-bold inline-flex items-center gap-1"
                        href="{{ $message['url'] }}">Read More <span class="material-symbols-outlined text-sm">east</span></a>
                @else
                    <span class="font-label-md text-label-md text-outline">Details pending</span>
                @endif
            </article>
        @endforeach
    </div>
</section>