@php($pageSections = $page->sections ?? collect())
@if($pageSections->isNotEmpty())
    <div class="mt-8 grid gap-2">
        @foreach($pageSections as $section)
            @continue(!$section->is_enabled)
            @php($data = is_array($section->data) ? $section->data : [])

            @switch($section->type)
                @case('Hero')
                    @php($heroTone = $data['tone'] ?? 'forest')
                    @php($heroDark = $heroTone === 'forest')
                    <section class="my-5 rounded-3xl px-6 py-12 md:px-10 md:py-16 {{ $heroDark ? 'bg-[var(--hms-forest-deep)] text-white' : ($heroTone === 'cream' ? 'bg-[var(--hms-cream)] text-[var(--hms-forest-deep)]' : 'border border-black/10 bg-white text-[var(--hms-forest-deep)]') }} {{ ($data['alignment'] ?? 'left') === 'center' ? 'text-center' : '' }}">
                        @if(!empty($data['eyebrow']))<p class="hms-kicker {{ $heroDark ? 'text-white/65' : '' }}">{{ $data['eyebrow'] }}</p>@endif
                        @if(!empty($data['heading']))<h2 class="mt-3 font-serif text-4xl leading-tight md:text-5xl">{{ $data['heading'] }}</h2>@endif
                        @if(!empty($data['body']))<p class="mt-5 text-lg leading-relaxed {{ ($data['alignment'] ?? 'left') === 'center' ? 'mx-auto max-w-3xl' : 'max-w-3xl' }} {{ $heroDark ? 'text-white/75' : 'text-black/65' }}">{{ $data['body'] }}</p>@endif
                        @php($heroLinks = [['label'=>$data['primaryLabel']??'','url'=>$data['primaryUrl']??'','primary'=>true],['label'=>$data['secondaryLabel']??'','url'=>$data['secondaryUrl']??'','primary'=>false]])
                        @if(collect($heroLinks)->contains(fn($link)=>filled($link['label']) && filled($link['url'])))
                            <div class="mt-7 flex flex-wrap gap-3 {{ ($data['alignment'] ?? 'left') === 'center' ? 'justify-center' : '' }}">
                                @foreach($heroLinks as $link)
                                    @php($heroExternal = str_starts_with(strtolower((string)$link['url']), 'https://') && filter_var($link['url'], FILTER_VALIDATE_URL))
                                    @php($heroInternal = str_starts_with((string)$link['url'], '/') && !str_starts_with((string)$link['url'], '//'))
                                    @if(filled($link['label']) && ($heroExternal || $heroInternal))
                                        <a href="{{ $link['url'] }}" class="hms-button {{ $link['primary'] ? ($heroDark ? 'bg-white text-[var(--hms-forest-deep)]' : 'hms-button-primary') : ($heroDark ? 'border border-white/50 text-white' : 'border border-[var(--hms-forest)] text-[var(--hms-forest)]') }}" @if($heroExternal) target="_blank" rel="noopener noreferrer" @endif>{{ $link['label'] }}</a>
                                    @endif
                                @endforeach
                            </div>
                        @endif
                    </section>
                    @break

                @case('Heading')
                    @php($level = in_array($data['level'] ?? 'h2', ['h2','h3','h4'], true) ? $data['level'] : 'h2')
                    <div class="pt-8">
                        @if(!empty($data['eyebrow']))<p class="hms-kicker">{{ $data['eyebrow'] }}</p>@endif
                        @if(!empty($data['heading']))
                            @if($level === 'h2')<h2 class="mt-2 font-serif text-3xl md:text-4xl">{{ $data['heading'] }}</h2>
                            @elseif($level === 'h3')<h3 class="mt-2 font-serif text-2xl md:text-3xl">{{ $data['heading'] }}</h3>
                            @else<h4 class="mt-2 font-serif text-xl md:text-2xl">{{ $data['heading'] }}</h4>@endif
                        @endif
                    </div>
                    @break

                @case('RichText')
                    @php($safeBody = app(\App\Services\PageBuilderService::class)->sanitizeRichText($data['body'] ?? ''))
                    <div class="py-3 text-lg leading-relaxed text-black/70 [&_blockquote]:border-l-4 [&_blockquote]:border-[var(--hms-sage)] [&_blockquote]:pl-5 [&_h2]:mt-8 [&_h2]:font-serif [&_h2]:text-3xl [&_h3]:mt-7 [&_h3]:font-serif [&_h3]:text-2xl [&_h4]:mt-6 [&_h4]:font-serif [&_h4]:text-xl [&_ol]:list-decimal [&_ol]:pl-6 [&_p+p]:mt-4 [&_pre]:overflow-x-auto [&_pre]:rounded-xl [&_pre]:bg-black/[.04] [&_pre]:p-4 [&_ul]:list-disc [&_ul]:pl-6">{!! $safeBody !!}</div>
                    @break

                @case('Image')
                    @php($imageSrc = trim((string)($data['src'] ?? '')))
                    @php($imageSafe = (str_starts_with($imageSrc, '/') && !str_starts_with($imageSrc, '//')) || (str_starts_with(strtolower($imageSrc), 'https://') && filter_var($imageSrc, FILTER_VALIDATE_URL)))
                    @if($imageSafe && !empty($data['alt']))
                        @php($imageWidth = $data['width'] ?? 'full')
                        @php($imageAspect = $data['aspect'] ?? 'landscape')
                        <figure class="my-6 {{ $imageWidth === 'narrow' ? 'mx-auto max-w-2xl' : ($imageWidth === 'medium' ? 'mx-auto max-w-4xl' : '') }}">
                            <img class="w-full rounded-2xl object-cover {{ $imageAspect === 'wide' ? 'aspect-video' : ($imageAspect === 'square' ? 'aspect-square' : ($imageAspect === 'landscape' ? 'aspect-[4/3]' : '')) }}" src="{{ $imageSrc }}" alt="{{ $data['alt'] }}" loading="lazy">
                            @if(!empty($data['caption']))<figcaption class="mt-2 text-sm text-black/50">{{ $data['caption'] }}</figcaption>@endif
                        </figure>
                    @endif
                    @break

                @case('ImageText')
                    @php($itSrc = trim((string)($data['src'] ?? '')))
                    @php($itSafe = (str_starts_with($itSrc, '/') && !str_starts_with($itSrc, '//')) || (str_starts_with(strtolower($itSrc), 'https://') && filter_var($itSrc, FILTER_VALIDATE_URL)))
                    @php($itBody = app(\App\Services\PageBuilderService::class)->sanitizeRichText($data['body'] ?? ''))
                    <section class="my-8 grid items-center gap-8 lg:grid-cols-2">
                        @if(($data['imageSide'] ?? 'left') === 'left' && $itSafe && !empty($data['alt']))<img class="w-full rounded-3xl object-cover" src="{{ $itSrc }}" alt="{{ $data['alt'] }}" loading="lazy">@endif
                        <div>
                            @if(!empty($data['eyebrow']))<p class="hms-kicker">{{ $data['eyebrow'] }}</p>@endif
                            @if(!empty($data['heading']))<h2 class="mt-2 font-serif text-3xl md:text-4xl">{{ $data['heading'] }}</h2>@endif
                            @if($itBody !== '')<div class="mt-4 leading-relaxed text-black/65 [&_ol]:list-decimal [&_ol]:pl-6 [&_p+p]:mt-3 [&_ul]:list-disc [&_ul]:pl-6">{!! $itBody !!}</div>@endif
                            @php($itUrl = trim((string)($data['buttonUrl'] ?? '')))
                            @php($itExternal = str_starts_with(strtolower($itUrl), 'https://') && filter_var($itUrl, FILTER_VALIDATE_URL))
                            @php($itInternal = str_starts_with($itUrl, '/') && !str_starts_with($itUrl, '//'))
                            @if(!empty($data['buttonLabel']) && ($itExternal || $itInternal))<a class="hms-button hms-button-primary mt-5" href="{{ $itUrl }}" @if($itExternal) target="_blank" rel="noopener noreferrer" @endif>{{ $data['buttonLabel'] }}</a>@endif
                        </div>
                        @if(($data['imageSide'] ?? 'left') === 'right' && $itSafe && !empty($data['alt']))<img class="w-full rounded-3xl object-cover" src="{{ $itSrc }}" alt="{{ $data['alt'] }}" loading="lazy">@endif
                    </section>
                    @break

                @case('Columns')
                    @php($leftBody = app(\App\Services\PageBuilderService::class)->sanitizeRichText($data['leftBody'] ?? ''))
                    @php($rightBody = app(\App\Services\PageBuilderService::class)->sanitizeRichText($data['rightBody'] ?? ''))
                    <section class="my-6 grid gap-8 md:grid-cols-2">
                        <div>@if(!empty($data['leftHeading']))<h3 class="font-serif text-2xl">{{ $data['leftHeading'] }}</h3>@endif<div class="{{ !empty($data['leftHeading']) ? 'mt-3' : '' }} leading-relaxed text-black/65 [&_p+p]:mt-3">{!! $leftBody !!}</div></div>
                        <div>@if(!empty($data['rightHeading']))<h3 class="font-serif text-2xl">{{ $data['rightHeading'] }}</h3>@endif<div class="{{ !empty($data['rightHeading']) ? 'mt-3' : '' }} leading-relaxed text-black/65 [&_p+p]:mt-3">{!! $rightBody !!}</div></div>
                    </section>
                    @break

                @case('Cards')
                    @php($cardColumns = in_array((string)($data['columns'] ?? '3'), ['2','3','4'], true) ? (string)$data['columns'] : '3')
                    <section class="my-8">
                        @if(!empty($data['heading']))<h2 class="font-serif text-3xl md:text-4xl">{{ $data['heading'] }}</h2>@endif
                        @if(!empty($data['intro']))<p class="mt-3 max-w-3xl leading-relaxed text-black/60">{{ $data['intro'] }}</p>@endif
                        <div class="mt-6 grid gap-4 {{ $cardColumns === '2' ? 'md:grid-cols-2' : ($cardColumns === '4' ? 'sm:grid-cols-2 lg:grid-cols-4' : 'md:grid-cols-3') }}">
                            @foreach(($data['items'] ?? []) as $card)
                                <article class="rounded-2xl border border-black/10 bg-white p-6">
                                    @if(!empty($card['title']))<h3 class="font-serif text-2xl">{{ $card['title'] }}</h3>@endif
                                    @if(!empty($card['body']))<p class="mt-3 leading-relaxed text-black/60">{{ $card['body'] }}</p>@endif
                                    @php($cardUrl = trim((string)($card['url'] ?? '')))
                                    @php($cardExternal = str_starts_with(strtolower($cardUrl), 'https://') && filter_var($cardUrl, FILTER_VALIDATE_URL))
                                    @php($cardInternal = str_starts_with($cardUrl, '/') && !str_starts_with($cardUrl, '//'))
                                    @if(!empty($card['linkLabel']) && ($cardExternal || $cardInternal))<a class="mt-4 inline-block text-sm font-bold" href="{{ $cardUrl }}" @if($cardExternal) target="_blank" rel="noopener noreferrer" @endif>{{ $card['linkLabel'] }} →</a>@endif
                                </article>
                            @endforeach
                        </div>
                    </section>
                    @break

                @case('Stats')
                    @php($statTone = $data['tone'] ?? 'cream')
                    @php($statItems = collect($data['items'] ?? [])->take(4))
                    @if($statItems->isNotEmpty())
                        <section class="my-8 grid gap-px overflow-hidden rounded-2xl {{ $statTone === 'forest' ? 'bg-white/10 text-white' : 'bg-black/5' }} {{ $statItems->count() === 1 ? 'grid-cols-1' : ($statItems->count() === 2 ? 'sm:grid-cols-2' : 'sm:grid-cols-2 lg:grid-cols-'.$statItems->count()) }} {{ $statTone === 'forest' ? 'bg-[var(--hms-forest-deep)]' : ($statTone === 'cream' ? 'bg-[var(--hms-cream)]' : 'border border-black/10 bg-white') }}">
                            @foreach($statItems as $stat)<div class="p-6 text-center"><strong class="block font-serif text-3xl">{{ $stat['value'] ?? '' }}</strong><span class="mt-2 block text-sm opacity-60">{{ $stat['label'] ?? '' }}</span></div>@endforeach
                        </section>
                    @endif
                    @break

                @case('Quote')
                    @if(!empty($data['quote']))
                        <blockquote class="my-8 border-l-4 border-[var(--hms-sage)] bg-[var(--hms-cream)] px-7 py-6 font-serif text-2xl leading-relaxed">
                            “{{ $data['quote'] }}”
                            @if(!empty($data['attribution']) || !empty($data['source']))<footer class="mt-4 font-sans text-sm text-black/55">— {{ $data['attribution'] ?? '' }}@if(!empty($data['attribution']) && !empty($data['source'])), @endif{{ $data['source'] ?? '' }}</footer>@endif
                        </blockquote>
                    @endif
                    @break

                @case('FaqList')
                    <section class="my-8">
                        @if(!empty($data['heading']))<h2 class="font-serif text-3xl md:text-4xl">{{ $data['heading'] }}</h2>@endif
                        <div class="mt-5 divide-y divide-black/10 border-y border-black/10">
                            @foreach(($data['items'] ?? []) as $faq)
                                <details class="group py-4">
                                    <summary class="flex cursor-pointer list-none items-center justify-between gap-4 font-semibold [&::-webkit-details-marker]:hidden"><span>{{ $faq['question'] ?? '' }}</span><span aria-hidden="true" class="text-xl transition group-open:rotate-45">+</span></summary>
                                    @if(!empty($faq['answer']))<p class="mt-3 max-w-3xl whitespace-pre-line leading-relaxed text-black/60">{{ $faq['answer'] }}</p>@endif
                                </details>
                            @endforeach
                        </div>
                    </section>
                    @break

                @case('Video')
                    @php($embedUrl = trim((string)($data['embedUrl'] ?? '')))
                    @php($safeEmbed = str_starts_with($embedUrl, 'https://www.youtube-nocookie.com/embed/') || str_starts_with($embedUrl, 'https://player.vimeo.com/video/'))
                    @if($safeEmbed)
                        <figure class="my-8">
                            <div class="aspect-video overflow-hidden rounded-2xl bg-black"><iframe class="h-full w-full" src="{{ $embedUrl }}" title="{{ $data['title'] ?: 'Embedded video' }}" loading="lazy" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe></div>
                            @if(!empty($data['caption']))<figcaption class="mt-2 text-sm text-black/50">{{ $data['caption'] }}</figcaption>@endif
                        </figure>
                    @endif
                    @break

                @case('Callout')
                    @php($safeBody = app(\App\Services\PageBuilderService::class)->sanitizeRichText($data['body'] ?? ''))
                    <aside class="my-4 rounded-2xl border border-black/10 p-6 {{ ($data['tone'] ?? 'neutral') === 'highlight' ? 'bg-[var(--hms-cream)]' : 'bg-white' }}">
                        @if(!empty($data['heading']))<h3 class="font-serif text-2xl">{{ $data['heading'] }}</h3>@endif
                        @if($safeBody !== '')<div class="{{ !empty($data['heading']) ? 'mt-3' : '' }} leading-relaxed text-black/65 [&_ol]:list-decimal [&_ol]:pl-6 [&_p+p]:mt-3 [&_ul]:list-disc [&_ul]:pl-6">{!! $safeBody !!}</div>@endif
                    </aside>
                    @break

                @case('Action')
                    @php($actionUrl = trim((string) ($data['url'] ?? '')))
                    @php($external = str_starts_with(strtolower($actionUrl), 'https://') && filter_var($actionUrl, FILTER_VALIDATE_URL))
                    @php($internal = str_starts_with($actionUrl, '/') && !str_starts_with($actionUrl, '//'))
                    @if(!empty($data['label']) && ($internal || $external))
                        <div class="py-3"><a class="hms-button {{ ($data['style'] ?? 'primary') === 'secondary' ? 'border border-[var(--hms-forest)] text-[var(--hms-forest)]' : 'hms-button-primary' }}" href="{{ $actionUrl }}" @if($external) target="_blank" rel="noopener noreferrer" @endif>{{ $data['label'] }}@if($external) ↗@endif</a></div>
                    @endif
                    @break

                @case('Divider')
                    @php($spacing = $data['spacing'] ?? 'normal')
                    <hr class="border-black/10 {{ $spacing === 'compact' ? 'my-4' : ($spacing === 'spacious' ? 'my-12' : 'my-8') }}">
                    @break
            @endswitch
        @endforeach
    </div>
@endif