<?php $__env->startSection('title', $page->meta_title ?: 'Home'); ?>
<?php $__env->startSection('meta_description', $page->meta_description ?? 'Home page for Hillcrest Living, a supported living provider for older adults aged 65+.'); ?>

<?php
    use Illuminate\Support\Facades\Storage;

    $activeSections = $page->sections
        ->where('is_active', true)
        ->sortBy('sort_order')
        ->values();

    $heroFallbackImages = [
        asset('assets/images/hillcrest-hero-ai-1.png'),
        asset('assets/images/hillcrest-hero-ai-2.png'),
        asset('assets/images/hillcrest-hero-ai-3.png'),
    ];

    $heroSection = $activeSections->firstWhere('section_key', 'hero');
    $supportServicesSection = $activeSections->firstWhere('section_key', 'home_services');
    $approachSection = $activeSections->firstWhere('section_key', 'home_approach');
    $referralsSection = $activeSections->firstWhere('section_key', 'home_referrals');
    $whyChooseSection = $activeSections->firstWhere('section_key', 'home_why_choose');
    $testimonialSection = $activeSections->firstWhere('section_key', 'home_testimonials');
    $faqSection = $activeSections->firstWhere('section_key', 'home_faqs');
    $approachImage = $approachSection?->media
        ? Storage::disk($approachSection->media->disk)->url($approachSection->media->path)
        : asset('assets/images/hillcrest-about-story.png');
    $approachImageAlt = $approachSection?->media?->alt_text ?: 'A calm supported living environment at Hillcrest';
    $heroSlides = $activeSections
        ->filter(fn ($section) => in_array($section->section_key, ['hero', 'hero_slide']))
        ->values()
        ->map(function ($section, int $index) use ($heroFallbackImages) {
            return [
                'title' => $section->heading ?: 'Helping older adults live independently, safely, and with dignity',
                'description' => strip_tags((string) $section->body) ?: 'Supported living for older adults (65+) who value independence with day-to-day support.',
                'image' => $section->media
                    ? Storage::disk($section->media->disk)->url($section->media->path)
                    : $heroFallbackImages[$index % count($heroFallbackImages)],
                'alt' => $section->media?->alt_text ?: 'Supported living at Hillcrest',
                'cta_primary_label' => $section->cta_primary_label ?: 'Make a Referral',
                'cta_primary_url' => $section->cta_primary_url ?: route('referral.show'),
                'cta_secondary_label' => $section->cta_secondary_label ?: 'Speak to Our Team',
                'cta_secondary_url' => $section->cta_secondary_url ?: route('contact.show'),
            ];
        })
        ->values();

    if ($heroSlides->count() < 3) {
        $heroSlides = collect([
            [
                'title' => 'Helping older adults live independently, safely, and with dignity',
                'description' => 'At Hillcrest Living, we provide supported living for older adults aged 65+ who want to maintain their independence while receiving the right level of day-to-day support. We focus on low to moderate support needs, creating a safe, comfortable, and empowering environment—without intrusive care.',
                'image' => asset('assets/images/hillcrest-hero-ai-1.png'),
                'alt' => 'Supported living visual for older adults',
                'cta_primary_label' => 'Make a Referral',
                'cta_primary_url' => route('referral.show'),
                'cta_secondary_label' => 'Speak to Our Team',
                'cta_secondary_url' => route('contact.show'),
            ],
            [
                'title' => 'Supported Living That Promotes Independence',
                'description' => 'Supported living is about having your own space, your own routine, and your own life, with the reassurance that support is available when needed. We help individuals stay in control, build confidence, and remain part of their community.',
                'image' => asset('assets/images/hillcrest-hero-ai-2.png'),
                'alt' => 'Comfortable supported living accommodation',
                'cta_primary_label' => 'Make a Referral',
                'cta_primary_url' => route('referral.show'),
                'cta_secondary_label' => 'Speak to Our Team',
                'cta_secondary_url' => route('contact.show'),
            ],
            [
                'title' => 'Practical, non-intrusive support',
                'description' => 'We provide practical support including daily routine, medication prompting, shopping, errands, and social engagement. Our focus is helping individuals build confidence, routine, and independence.',
                'image' => asset('assets/images/hillcrest-hero-ai-3.png'),
                'alt' => 'Safe and comfortable community garden',
                'cta_primary_label' => 'Make a Referral',
                'cta_primary_url' => route('referral.show'),
                'cta_secondary_label' => 'Speak to Our Team',
                'cta_secondary_url' => route('contact.show'),
            ],
        ]);
    }

    $heroRotationMs = (int) ($heroSection?->rotation_interval_ms
        ?: $activeSections->firstWhere('section_key', 'hero_slide')?->rotation_interval_ms
        ?: 6000);
    if ($heroRotationMs < 2000) {
        $heroRotationMs = 2000;
    }

    $serviceIconMap = [
        'daily-routine-support' => 'calendar',
        'medication-prompting' => 'clock-3',
        'shopping-and-errands-support' => 'shopping-bag',
        'appointment-support' => 'clipboard-list',
        'light-domestic-support-and-organisation' => 'house',
        'social-engagement-and-companionship' => 'users',
        'community-access-and-activities' => 'map-pinned',
        'budgeting-and-basic-life-admin-support' => 'wallet',
    ];

    $featuredServiceSlugs = [
        'daily-routine-support',
        'medication-prompting',
        'social-engagement-and-companionship',
        'community-access-and-activities',
    ];

    $featuredServices = collect($featuredServiceSlugs)
        ->map(fn ($slug) => $services->firstWhere('slug', $slug))
        ->filter()
        ->values();

    if ($featuredServices->isEmpty()) {
        $featuredServices = $services->take(4)->values();
    }

    $galleryFallbackImages = collect([
        [
            'src' => asset('assets/images/hillcrest-gallery-photo-1.png'),
            'alt' => 'Comfortable supported living accommodation at Hillcrest',
            'label' => 'Comfortable spaces',
        ],
        [
            'src' => asset('assets/images/hillcrest-gallery-photo-2.png'),
            'alt' => 'Supported living service environment for older adults',
            'label' => 'Daily living support',
        ],
        [
            'src' => asset('assets/images/hillcrest-gallery-photo-3.png'),
            'alt' => 'Calm Hillcrest living space close to local community',
            'label' => 'Calm environments',
        ],
        [
            'src' => asset('assets/images/hillcrest-community-photo.png'),
            'alt' => 'Older adults supported to stay connected with the community',
            'label' => 'Community connection',
        ],
        [
            'src' => asset('assets/images/hillcrest-about-story.png'),
            'alt' => 'Hillcrest person-centred support in a homely setting',
            'label' => 'Person-centred care',
        ],
        [
            'src' => asset('assets/images/hillcrest-referral-photo.png'),
            'alt' => 'Friendly referral conversation for supported living',
            'label' => 'Clear referral pathway',
        ],
        [
            'src' => asset('assets/images/faq-support-conversation.png'),
            'alt' => 'Support coordinator answering questions with an older adult',
            'label' => 'Reassuring guidance',
        ],
        [
            'src' => asset('assets/images/faq-accommodation-support.png'),
            'alt' => 'Safe and comfortable supported living accommodation',
            'label' => 'Safe accommodation',
        ],
    ]);

    $cmsGalleryImages = $homeMedia
        ->map(fn ($media) => [
            'src' => Storage::disk($media->disk)->url($media->path),
            'alt' => $media->alt_text ?: 'Life at Hillcrest Living',
            'label' => $media->caption ?: 'Life at Hillcrest',
        ])
        ->values();

    $galleryImages = $cmsGalleryImages->isNotEmpty()
        ? $cmsGalleryImages
        : $galleryFallbackImages;
?>

<?php $__env->startPush('meta'); ?>
    <?php
        $org = [
            '@context' => 'https://schema.org',
            '@type' => 'Organization',
            'name' => $siteSettings->site_name,
            'url' => url('/'),
        ];
        if (filled($siteSettings->contact_email)) {
            $org['email'] = $siteSettings->contact_email;
        }
        if (filled($siteSettings->contact_phone)) {
            $org['telephone'] = $siteSettings->contact_phone;
        }
        if (filled($siteSettings->contact_address)) {
            $org['address'] = [
                '@type' => 'PostalAddress',
                'streetAddress' => $siteSettings->contact_address,
                'addressCountry' => 'GB',
            ];
        }
    ?>
    <script type="application/ld+json"><?php echo json_encode($org, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE); ?></script>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
    <section
        class="floral-panel relative overflow-hidden"
        x-data="{
            active: 0,
            total: <?php echo e($heroSlides->count()); ?>,
            slides: <?php echo \Illuminate\Support\Js::from($heroSlides)->toHtml() ?>,
            intervalMs: <?php echo e($heroRotationMs); ?>,
            timer: null,
            startTimer() {
                if (this.total <= 1) return;
                this.stopTimer();
                this.timer = setInterval(() => { this.active = (this.active + 1) % this.total }, this.intervalMs);
            },
            stopTimer() {
                clearInterval(this.timer);
                this.timer = null;
            }
        }"
        x-init="startTimer()"
        @mouseenter="stopTimer()"
        @mouseleave="startTimer()"
        @focusin="stopTimer()"
        @focusout="startTimer()"
    >
        <div class="ambient-blob ambient-blob-one"></div>
        <div class="ambient-blob ambient-blob-two"></div>
        <div class="section-shell relative section-gap grid gap-10 lg:grid-cols-2 lg:items-center">
            <div data-aos="fade-up" class="order-2 flex flex-col justify-center lg:order-1">
                <p class="text-sm font-semibold uppercase tracking-[0.16em] text-[var(--color-accent)]"><?php echo e($siteSettings->site_tagline ?? 'Supported living for older adults (65+)'); ?></p>
                <div class="relative min-h-[340px] mt-4">
                    <div
                        x-transition:enter="transition ease-out duration-700"
                        x-transition:enter-start="opacity-0 translate-y-4"
                        x-transition:enter-end="opacity-100 translate-y-0"
                    >
                        <h1 class="font-display text-4xl font-bold leading-tight text-[var(--color-heading)] md:text-5xl" style="font-family: var(--font-heading);" x-text="slides[active]?.title"></h1>
                        <p class="mt-6 max-w-2xl text-lg text-neutral-700" x-text="slides[active]?.description"></p>
                        <p class="mt-4 text-base font-semibold text-[var(--color-heading)]">Live independently. Stay supported. Feel at home.</p>
                        <div class="mt-8 flex flex-col gap-3 sm:flex-row">
                            <a :href="slides[active]?.cta_primary_url" class="hc-btn-primary" x-text="slides[active]?.cta_primary_label"></a>
                            <a :href="slides[active]?.cta_secondary_url" class="hc-btn-secondary" x-text="slides[active]?.cta_secondary_label"></a>
                        </div>
                    </div>
                </div>
                <div class="mt-6 flex gap-2" x-show="total > 1">
                    <template x-for="(_, idx) in Array.from({ length: total })" :key="idx">
                        <button
                            type="button"
                            @click="active = idx"
                            :aria-label="`Go to slide ${idx + 1}`"
                            :aria-current="active === idx ? 'true' : 'false'"
                            class="h-2.5 w-8 rounded-full transition-all duration-300"
                            :class="active === idx ? 'bg-[var(--color-accent)] w-10' : 'bg-neutral-300 hover:bg-neutral-400'"
                        ></button>
                    </template>
                </div>
            </div>
            <div class="micro-float relative order-1 min-h-[360px] overflow-hidden rounded-[2rem] border border-neutral-200 bg-white shadow-2xl shadow-neutral-900/10 lg:order-2 lg:min-h-[560px]" data-aos="fade-left">
                <img
                    x-transition:enter="transition ease-out duration-1000"
                    x-transition:enter-start="opacity-0 scale-105"
                    x-transition:enter-end="opacity-100 scale-100"
                    :src="slides[active]?.image"
                    :alt="slides[active]?.alt"
                    class="absolute inset-0 h-full w-full object-cover"
                >
                <div class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-[var(--color-primary)]/90 via-[var(--color-primary)]/50 to-transparent p-6 pt-16 text-white">
                    <p class="max-w-sm text-sm font-medium drop-shadow-md">Low to moderate support that feels calm, respectful, and close to home.</p>
                </div>
            </div>
        </div>
    </section>

    <section class="section-contrast-sage section-gap border-t border-neutral-100">
        <div class="section-shell grid gap-8 lg:grid-cols-2 lg:gap-14">
            <div data-aos="fade-up">
                <h2 class="font-display text-3xl font-bold text-[var(--color-heading)]" style="font-family: var(--font-heading);">Supported Living That Promotes Independence</h2>
                <p class="mt-4 text-neutral-700">
                    Supported living is about having your own space, your own routine, and your own life, with the reassurance that support is available when needed.
                </p>
                <p class="mt-4 text-neutral-700">
                    Unlike traditional care settings, our service helps individuals stay in control of daily life, build confidence and routine, and remain part of their community.
                </p>
            </div>
            <div class="hc-card floral-soft bg-[var(--color-surface-alt)]" data-aos="fade-up">
                <h3 class="font-display text-xl font-semibold text-[var(--color-heading)]" style="font-family: var(--font-heading);">Who We Support</h3>
                <ul class="mt-4 space-y-3 text-sm text-neutral-700">
                    <li class="leaf-accent">Older adults (65+) who are mostly independent but need some support.</li>
                    <li class="leaf-accent">People who may feel isolated or need regular companionship.</li>
                    <li class="leaf-accent">Individuals finding daily tasks and routines more challenging.</li>
                    <li class="leaf-accent">People stepping down from hospital or residential care settings.</li>
                    <li class="leaf-accent">Those wanting to avoid moving into a care home.</li>
                </ul>
                <p class="mt-4 text-sm font-medium text-[var(--color-primary)]">Ideal for individuals who do not require personal care, but benefit from structured support.</p>
            </div>
        </div>
    </section>

    <section class="section-contrast-gold section-gap border-t border-neutral-100">
        <div class="section-shell">
            <div class="rounded-3xl border border-[var(--color-primary)]/15 bg-[var(--color-surface)] p-6 shadow-sm md:p-8 xl:p-10">
                <div class="flex flex-wrap items-end justify-between gap-4">
                    <div class="max-w-3xl" data-aos="fade-up">
                        <p class="text-xs font-semibold uppercase tracking-[0.16em] text-[var(--color-accent)]">
                            <?php echo e($supportServicesSection?->subheading ?: 'Person-Centred Support'); ?>

                        </p>
                        <h2 class="mt-3 font-display text-3xl font-bold text-[var(--color-heading)] md:text-4xl" style="font-family: var(--font-heading);">
                            <?php echo e($supportServicesSection?->heading ?: 'Our Support Services'); ?>

                        </h2>
                        <p class="mt-4 text-[var(--color-body)]/90">
                            <?php echo e($supportServicesSection?->body ? strip_tags($supportServicesSection->body) : 'We provide practical, non-intrusive support, including:'); ?>

                        </p>
                    </div>
                    <a class="hc-btn-secondary" href="<?php echo e(route('services.index')); ?>">View All Services</a>
                </div>

                <div class="mt-8 grid gap-4 md:grid-cols-2">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $featuredServices; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $service): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <?php $icon = $serviceIconMap[$service->slug] ?? 'circle-check'; ?>
                        <article class="group relative overflow-hidden rounded-2xl border border-[var(--color-primary)]/15 bg-[var(--color-surface-alt)] p-5 shadow-sm transition-all duration-300 hover:-translate-y-0.5 hover:border-[#B99147] hover:bg-[#B99147] hover:shadow-md" data-aos="fade-up">
                            <span class="pointer-events-none absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-transparent transition duration-300 group-hover:from-white/5 group-hover:to-transparent"></span>
                            <div class="flex items-start gap-3">
                                <span class="relative inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-[var(--color-accent)]/12 text-[var(--color-primary)] transition-colors duration-300 group-hover:bg-white/20 group-hover:text-white">
                                    <i data-lucide="<?php echo e($icon); ?>" class="h-5 w-5"></i>
                                </span>
                                <div class="relative">
                                    <h3 class="font-semibold text-[var(--color-heading)] transition-colors duration-300 group-hover:text-white"><?php echo e($service->title); ?></h3>
                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($service->summary): ?>
                                        <p class="mt-2 text-sm leading-relaxed text-[var(--color-body)]/85 transition-colors duration-300 group-hover:text-white/95"><?php echo e($service->summary); ?></p>
                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                </div>
                            </div>
                        </article>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </div>

                <div class="mt-7 overflow-hidden rounded-3xl bg-[var(--color-primary)] text-white shadow-xl shadow-neutral-900/10">
                    <div class="relative p-6 md:p-8">
                        <div class="absolute -right-12 -top-16 h-40 w-40 rounded-full bg-[var(--color-accent)]/30 blur-2xl"></div>
                        <div class="absolute -bottom-20 left-10 h-44 w-44 rounded-full bg-white/10 blur-3xl"></div>

                        <div class="relative grid gap-6 lg:grid-cols-[1fr_auto] lg:items-center">
                            <div>
                                <p class="text-xs font-semibold uppercase tracking-[0.18em] text-white/70">Ready to discuss support?</p>
                                <h3 class="mt-3 font-display text-2xl font-bold leading-tight md:text-3xl" style="font-family: var(--font-heading);">
                                    Helping older adults stay independent, safe, and confident.
                                </h3>
                                <p class="mt-3 max-w-3xl text-sm leading-relaxed text-white/85 md:text-base">
                                    Hillcrest provides supported living for older adults who value their independence but need some level of day-to-day support to live safely and confidently.
                                </p>
                                <p class="mt-2 text-sm font-medium text-white/90">
                                    Our focus is helping individuals build confidence, routine, and independence.
                                </p>
                            </div>

                            <div class="flex flex-col gap-3 sm:flex-row lg:flex-col">
                                <a href="<?php echo e(route('referral.show')); ?>" class="inline-flex min-h-[44px] items-center justify-center rounded-full bg-[var(--color-accent)] px-5 py-2.5 text-sm font-semibold text-white transition hover:bg-white hover:text-[var(--color-primary)]">
                                    Make a Referral
                                </a>
                                <a href="<?php echo e(route('services.index')); ?>" class="inline-flex min-h-[44px] items-center justify-center rounded-full border border-white/35 px-5 py-2.5 text-sm font-semibold text-white transition hover:bg-white hover:text-[var(--color-primary)]">
                                    Explore Services
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section-contrast-gold section-gap">
        <div class="section-shell">
            <div class="grid gap-8 lg:grid-cols-[0.9fr_1.1fr] lg:items-stretch">
                <div class="relative overflow-hidden rounded-3xl border border-neutral-200 bg-white shadow-lg shadow-neutral-900/10" data-aos="fade-up">
                    <img src="<?php echo e($approachImage); ?>" alt="<?php echo e($approachImageAlt); ?>" class="h-full min-h-[420px] w-full object-cover">
                    <div class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-[var(--color-primary)]/95 via-[var(--color-primary)]/50 to-transparent p-6 pt-20 text-white">
                        <p class="text-xs font-semibold uppercase tracking-[0.18em] text-white/70">Accommodation</p>
                        <h3 class="mt-2 font-display text-2xl font-bold" style="font-family: var(--font-heading);">Safe, homely spaces that support independence.</h3>
                    </div>
                </div>

                <div class="rounded-3xl border border-[var(--color-primary)]/15 bg-[var(--color-surface)] p-6 shadow-sm md:p-8" data-aos="fade-up" x-data="{ activeTab: 'approach' }">
                    <p class="text-xs font-semibold uppercase tracking-[0.18em] text-[var(--color-accent)]">
                        <?php echo e($approachSection?->subheading ?: 'Person-Centred. Respectful. Empowering.'); ?>

                    </p>
                    <h2 class="mt-3 font-display text-3xl font-bold text-[var(--color-heading)] md:text-4xl" style="font-family: var(--font-heading);">
                        <?php echo e($approachSection?->heading ?: 'Our Approach'); ?>

                    </h2>

                    <div class="mt-6 inline-flex rounded-full border border-[var(--color-primary)]/15 bg-[var(--color-surface-alt)] p-1">
                        <button type="button" @click="activeTab = 'approach'" class="rounded-full px-4 py-2 text-sm font-semibold transition" :class="activeTab === 'approach' ? 'bg-[var(--color-primary)] text-white shadow-sm' : 'text-[var(--color-body)] hover:bg-white'">
                            Our Approach
                        </button>
                        <button type="button" @click="activeTab = 'accommodation'" class="rounded-full px-4 py-2 text-sm font-semibold transition" :class="activeTab === 'accommodation' ? 'bg-[var(--color-primary)] text-white shadow-sm' : 'text-[var(--color-body)] hover:bg-white'">
                            Accommodation
                        </button>
                    </div>

                    <div class="mt-6">
                        <div x-show="activeTab === 'approach'" x-transition>
                            <p class="text-[var(--color-body)]">
                                At Hillcrest, no two individuals are the same. We build support around each person so they can remain in control of daily life.
                            </p>
                            <div class="mt-5 grid gap-3 sm:grid-cols-2">
                                <div class="rounded-2xl border border-[var(--color-accent)]/20 bg-[var(--color-accent)]/8 p-4">
                                    <i data-lucide="user-check" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Personal support plans</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">Support is built around each person, not a fixed routine.</p>
                                </div>
                                <div class="rounded-2xl border border-[var(--color-accent)]/20 bg-[var(--color-accent)]/8 p-4">
                                    <i data-lucide="heart-handshake" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Respect and choice</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">We respect independence, preferences, and personal decisions.</p>
                                </div>
                                <div class="rounded-2xl border border-[var(--color-accent)]/20 bg-[var(--color-accent)]/8 p-4">
                                    <i data-lucide="sparkles" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Confidence building</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">We encourage skills, routine, and confidence over time.</p>
                                </div>
                                <div class="rounded-2xl border border-[var(--color-accent)]/20 bg-[var(--color-accent)]/8 p-4">
                                    <i data-lucide="sofa" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Calm environment</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">We create calm, homely environments that feel reassuring.</p>
                                </div>
                            </div>
                            <div class="mt-6 rounded-2xl bg-[var(--color-primary)] p-5 text-white">
                                <p class="text-sm font-medium leading-relaxed">
                                    Supported living works best when people feel in control of their lives, not managed. That is exactly how we operate.
                                </p>
                            </div>
                        </div>

                        <div x-show="activeTab === 'accommodation'" x-transition x-cloak>
                            <p class="text-[var(--color-body)]">
                                Our supported living environments are designed to feel safe, comfortable, well-located, and connected to the local community.
                            </p>
                            <div class="mt-5 grid gap-3 sm:grid-cols-2">
                                <div class="rounded-2xl border border-[var(--color-primary)]/15 bg-[var(--color-surface-alt)] p-4">
                                    <i data-lucide="shield-check" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Safe and comfortable</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">Spaces that help residents feel settled and reassured.</p>
                                </div>
                                <div class="rounded-2xl border border-[var(--color-primary)]/15 bg-[var(--color-surface-alt)] p-4">
                                    <i data-lucide="map-pinned" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Well-located</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">Close to community links, amenities, and transport.</p>
                                </div>
                                <div class="rounded-2xl border border-[var(--color-primary)]/15 bg-[var(--color-surface-alt)] p-4">
                                    <i data-lucide="key-round" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Private space</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">Residents have their own private space and daily rhythm.</p>
                                </div>
                                <div class="rounded-2xl border border-[var(--color-primary)]/15 bg-[var(--color-surface-alt)] p-4">
                                    <i data-lucide="home" class="h-5 w-5 text-[var(--color-accent)]"></i>
                                    <p class="mt-3 text-sm font-semibold text-[var(--color-heading)]">Living options</p>
                                    <p class="mt-1 text-sm text-[var(--color-body)]/80">Shared or self-contained living options that promote independence.</p>
                                </div>
                            </div>
                            <div class="mt-6 rounded-2xl bg-[var(--color-primary)] p-5 text-white">
                                <p class="text-sm font-medium leading-relaxed">
                                    Supported living typically allows individuals to live in their own tenancy while receiving the right level of day-to-day support.
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section-contrast-sage section-gap border-t border-neutral-100">
        <div class="section-shell">
            <div class="grid gap-6 lg:grid-cols-2">
                <article class="group relative overflow-hidden rounded-3xl bg-[var(--color-primary)] p-6 text-white shadow-xl shadow-neutral-900/10 md:p-8" data-aos="fade-up">
                    <div class="absolute -right-12 -top-16 h-44 w-44 rounded-full bg-[var(--color-accent)]/35 blur-3xl"></div>
                    <div class="relative">
                        <span class="inline-flex h-11 w-11 items-center justify-center rounded-2xl bg-white/12 text-white">
                            <i data-lucide="file-heart" class="h-5 w-5"></i>
                        </span>
                        <p class="mt-5 text-xs font-semibold uppercase tracking-[0.18em] text-white/65">
                            <?php echo e($referralsSection?->subheading ?: 'Referrals made simple'); ?>

                        </p>
                        <h2 class="mt-2 font-display text-2xl font-bold md:text-3xl" style="font-family: var(--font-heading);">
                            <?php echo e($referralsSection?->heading ?: 'Referrals'); ?>

                        </h2>
                        <div class="prose prose-invert mt-4 max-w-none prose-p:text-white/85">
                            <?php echo $referralsSection?->body ?: '<p>We accept referrals from Local Authorities, Social Workers, Healthcare Professionals, and Families/private clients.</p><p>Our process is designed for fast response times, clear assessment steps, and smooth onboarding.</p>'; ?>

                        </div>
                        <a href="<?php echo e($referralsSection?->cta_primary_url ?: route('referral.show')); ?>" class="mt-6 inline-flex min-h-[44px] items-center justify-center rounded-full bg-[var(--color-accent)] px-5 py-2.5 text-sm font-semibold text-white transition hover:bg-white hover:text-[var(--color-primary)]">
                            <?php echo e($referralsSection?->cta_primary_label ?: 'Submit a Referral'); ?>

                        </a>
                    </div>
                </article>

                <article class="relative overflow-hidden rounded-3xl border border-[var(--color-primary)]/15 bg-[var(--color-surface)] p-6 shadow-sm transition hover:-translate-y-0.5 hover:shadow-xl md:p-8" data-aos="fade-up">
                    <div class="absolute right-0 top-0 h-28 w-28 rounded-bl-full bg-[var(--color-accent)]/10"></div>
                    <div class="relative">
                        <span class="inline-flex h-11 w-11 items-center justify-center rounded-2xl bg-[var(--color-accent)]/12 text-[var(--color-primary)]">
                            <i data-lucide="shield-check" class="h-5 w-5"></i>
                        </span>
                        <p class="mt-5 text-xs font-semibold uppercase tracking-[0.18em] text-[var(--color-accent)]">
                            <?php echo e($whyChooseSection?->subheading ?: 'Why families choose us'); ?>

                        </p>
                        <h2 class="mt-2 font-display text-2xl font-bold text-[var(--color-heading)] md:text-3xl" style="font-family: var(--font-heading);">
                            <?php echo e($whyChooseSection?->heading ?: 'Why Choose Hillcrest'); ?>

                        </h2>
                        <div class="prose prose-neutral mt-4 max-w-none prose-p:text-[var(--color-body)] prose-li:text-[var(--color-body)] marker:text-[var(--color-accent)]">
                            <?php echo $whyChooseSection?->body ?: '<ul><li>Focused on older adults aged 65+.</li><li>Clear model for low to moderate support needs.</li><li>Independence-first and culturally aware approach.</li><li>Flexible support designed for both families and professionals.</li></ul>'; ?>

                        </div>
                        <a href="<?php echo e($whyChooseSection?->cta_primary_url ?: route('contact.show')); ?>" class="mt-6 inline-flex min-h-[44px] items-center justify-center rounded-full border border-[var(--color-primary)]/20 px-5 py-2.5 text-sm font-semibold text-[var(--color-primary)] transition hover:border-[var(--color-accent)] hover:bg-[var(--color-accent)] hover:text-white">
                            <?php echo e($whyChooseSection?->cta_primary_label ?: 'Get in Touch Today'); ?>

                        </a>
                    </div>
                </article>
            </div>
        </div>
    </section>

    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($testimonials->isNotEmpty()): ?>
        <section class="section-gap border-t border-neutral-100 bg-white/90">
            <div
                class="section-shell"
                x-data="{ idx: 0, max: <?php echo e($testimonials->count()); ?>, items: <?php echo \Illuminate\Support\Js::from($testimonials->values()->map(fn ($t) => ['quote' => $t->quote, 'author' => $t->author_name ?: 'Family member', 'source' => ucfirst($t->source_type), 'rating' => $t->star_rating ?: 5]))->toHtml() ?> }"
                x-init="setInterval(() => { idx = (idx + 1) % max }, 6500)"
            >
                <div class="grid gap-8 lg:grid-cols-[0.9fr_1.1fr] lg:items-center">
                    <div data-aos="fade-up">
                        <p class="text-xs font-semibold uppercase tracking-[0.18em] text-[var(--color-accent)]">
                            <?php echo e($testimonialSection?->subheading ?: 'Real experiences'); ?>

                        </p>
                        <h2 class="mt-3 font-display text-3xl font-bold text-[var(--color-heading)] md:text-4xl" style="font-family: var(--font-heading);">
                            <?php echo e($testimonialSection?->heading ?: 'Trusted by families and professionals'); ?>

                        </h2>
                        <div class="prose prose-neutral mt-4 max-w-none prose-p:text-[var(--color-body)]">
                            <?php echo $testimonialSection?->body ?: '<p>Kind words from residents, families, and referral partners who value calm, respectful support.</p>'; ?>

                        </div>
                        <div class="mt-6 rounded-2xl border border-[var(--color-accent)]/25 bg-[var(--color-accent)]/10 p-5">
                            <div class="flex items-start gap-4">
                                <span class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-[var(--color-accent)] text-white">
                                    <i data-lucide="messages-square" class="h-5 w-5"></i>
                                </span>
                                <div>
                                    <p class="text-base font-bold text-[var(--color-heading)]">Ready to feel confident about the next step?</p>
                                    <p class="mt-1 text-sm leading-relaxed text-[var(--color-body)]/85">Speak with our team and discover how calm, respectful support can help your loved one feel safe, independent, and at home.</p>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="relative overflow-hidden rounded-3xl bg-[var(--color-primary)] p-6 text-white shadow-xl shadow-neutral-900/10 md:p-8" data-aos="fade-up">
                        <div class="absolute -right-12 -top-16 h-44 w-44 rounded-full bg-[var(--color-accent)]/35 blur-3xl"></div>
                        <template x-for="(item, i) in items" :key="i">
                            <figure x-show="idx === i" x-transition class="relative">
                                <div class="flex gap-1 text-[var(--color-accent)]">
                                    <template x-for="star in item.rating" :key="star">
                                        <i data-lucide="star" class="h-4 w-4 fill-current"></i>
                                    </template>
                                </div>
                                <blockquote class="mt-5 text-xl font-semibold leading-relaxed md:text-2xl" x-text="`“${item.quote}”`"></blockquote>
                                <figcaption class="mt-6">
                                    <p class="text-sm font-semibold uppercase tracking-[0.16em] text-white/70" x-text="item.source"></p>
                                    <p class="mt-1 text-base font-semibold" x-text="item.author"></p>
                                </figcaption>
                            </figure>
                        </template>
                        <div class="relative mt-8 flex gap-2">
                            <template x-for="(_, dotIndex) in Array.from({ length: max })" :key="dotIndex">
                                <button type="button" @click="idx = dotIndex" class="h-2.5 rounded-full transition-all" :class="idx === dotIndex ? 'w-10 bg-[var(--color-accent)]' : 'w-6 bg-white/35 hover:bg-white/60'"></button>
                            </template>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($faqs->isNotEmpty()): ?>
        <section class="section-contrast-sage section-gap border-t border-neutral-100">
            <div class="section-shell">
                <div class="mx-auto max-w-3xl text-center" data-aos="fade-up">
                    <p class="text-xs font-semibold uppercase tracking-[0.18em] text-[var(--color-accent)]">
                        <?php echo e($faqSection?->subheading ?: 'Frequently asked questions'); ?>

                    </p>
                    <h2 class="mt-3 font-display text-3xl font-bold text-[var(--color-heading)] md:text-4xl" style="font-family: var(--font-heading);">
                        <?php echo e($faqSection?->heading ?: 'Questions families often ask'); ?>

                    </h2>
                    <div class="prose prose-neutral mx-auto mt-4 max-w-none prose-p:text-[var(--color-body)]">
                        <?php echo $faqSection?->body ?: '<p>Helpful answers about referrals, accommodation, and how supported living works at Hillcrest.</p>'; ?>

                    </div>
                </div>

                <div class="mx-auto mt-10 max-w-6xl" x-data="{ open: <?php echo e($faqs->first()?->id ?? 'null'); ?> }" data-aos="fade-up">
                    <div class="grid gap-6 lg:grid-cols-2">
                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $faqs->values()->split(2); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $columnIndex => $faqColumn): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <div class="space-y-3">
                                <figure class="overflow-hidden rounded-3xl border border-[var(--color-primary)]/15 bg-white shadow-lg shadow-neutral-900/10">
                                    <img
                                        src="<?php echo e($columnIndex === 0 ? asset('assets/images/faq-support-conversation.png') : asset('assets/images/faq-accommodation-support.png')); ?>"
                                        alt="<?php echo e($columnIndex === 0 ? 'Support coordinator answering questions with an older adult' : 'Comfortable supported living accommodation and lounge'); ?>"
                                        class="h-64 w-full object-cover transition duration-500 hover:scale-[1.03]"
                                        loading="lazy"
                                    >
                                </figure>

                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $faqColumn; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $faq): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <article class="overflow-hidden rounded-2xl border border-[var(--color-primary)]/15 bg-[var(--color-surface)] shadow-sm transition hover:border-[var(--color-accent)]/35 hover:shadow-md">
                                        <button type="button" class="flex w-full items-center justify-between gap-4 px-5 py-4 text-left" @click="open = open === <?php echo e($faq->id); ?> ? null : <?php echo e($faq->id); ?>">
                                            <span>
                                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($faq->category): ?>
                                                    <span class="text-xs font-semibold uppercase tracking-[0.12em] text-[var(--color-accent)]"><?php echo e($faq->category); ?></span>
                                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                                <span class="block font-semibold text-[var(--color-heading)]"><?php echo e($faq->question); ?></span>
                                            </span>
                                            <i data-lucide="chevron-down" class="h-5 w-5 shrink-0 text-[var(--color-primary)] transition" :class="open === <?php echo e($faq->id); ?> ? 'rotate-180' : ''"></i>
                                        </button>
                                        <div x-show="open === <?php echo e($faq->id); ?>" x-transition x-cloak class="border-t border-[var(--color-primary)]/10 px-5 py-4">
                                            <div class="prose prose-neutral max-w-none prose-sm prose-p:text-[var(--color-body)]"><?php echo $faq->answer; ?></div>
                                        </div>
                                    </article>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </div>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                    </div>
                </div>
            </div>
        </section>
    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

    <section class="floral-panel section-gap border-t border-neutral-100">
        <div class="section-shell">
            <div class="flex flex-wrap items-end justify-between gap-4">
                <div class="max-w-2xl" data-aos="fade-up">
                    <p class="text-xs font-semibold uppercase tracking-[0.18em] text-[var(--color-accent)]">Gallery</p>
                    <h2 class="mt-3 font-display text-3xl font-bold text-[var(--color-heading)] md:text-4xl" style="font-family: var(--font-heading);">Life at Hillcrest Living</h2>
                    <p class="mt-3 text-[var(--color-body)]/85">A glimpse of calm spaces, supportive conversations, and community-focused living for older adults in the UK.</p>
                </div>
                <a class="hc-btn-secondary" href="<?php echo e(route('gallery')); ?>">Open Gallery</a>
            </div>

            <div class="auto-gallery mt-8 rounded-[2rem] border border-[var(--color-primary)]/10 bg-white/70 py-4 shadow-sm" data-aos="fade-up">
                <div class="auto-gallery-track">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = [0, 1]; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $loopSet): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <div class="auto-gallery-set" aria-hidden="<?php echo e($loopSet === 1 ? 'true' : 'false'); ?>">
                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $galleryImages; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $image): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <figure class="auto-gallery-card group relative">
                                    <img
                                        src="<?php echo e($image['src']); ?>"
                                        alt="<?php echo e($image['alt']); ?>"
                                        class="transition duration-700 group-hover:scale-105"
                                        loading="lazy"
                                    >
                                    <figcaption class="absolute inset-x-4 bottom-4 rounded-2xl bg-[var(--color-primary)]/85 px-4 py-3 text-white backdrop-blur-sm">
                                        <p class="text-xs font-semibold uppercase tracking-[0.14em] text-white/70">Hillcrest Living</p>
                                        <p class="mt-1 text-sm font-semibold"><?php echo e($image['label']); ?></p>
                                    </figcaption>
                                </figure>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                        </div>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </div>
            </div>

            <div class="mt-6 overflow-hidden rounded-3xl bg-[var(--color-primary)] p-5 text-white shadow-xl shadow-neutral-900/10">
                <div class="relative flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
                    <div class="absolute -right-10 -top-14 h-32 w-32 rounded-full bg-[var(--color-accent)]/35 blur-2xl"></div>
                    <div class="relative max-w-2xl">
                        <p class="text-xs font-semibold uppercase tracking-[0.18em] text-white/65">Want to see more?</p>
                        <p class="mt-2 text-lg font-bold leading-snug">Explore our supportive environments, accommodation, and everyday life at Hillcrest Living.</p>
                    </div>
                    <a href="<?php echo e(route('contact.show')); ?>" class="relative inline-flex min-h-[44px] items-center justify-center rounded-full bg-[var(--color-accent)] px-5 py-2.5 text-sm font-semibold text-white transition hover:bg-white hover:text-[var(--color-primary)]">
                        Arrange a conversation
                    </a>
                </div>
            </div>
        </div>
    </section>

    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($posts->isNotEmpty()): ?>
        <section class="section-contrast-gold section-gap border-t border-neutral-100">
            <div class="section-shell relative overflow-hidden">
                <div class="section-orb section-orb-accent -top-20 -left-16 h-52 w-52"></div>
                <div class="section-orb section-orb-primary -bottom-24 right-0 h-56 w-56"></div>
                <div class="flex flex-wrap items-end justify-between gap-4">
                    <div class="max-w-2xl">
                        <p class="text-xs font-semibold uppercase tracking-[0.18em] text-[var(--color-accent)]">Insights and updates</p>
                        <h2 class="mt-3 font-display text-3xl font-bold text-[var(--color-heading)] md:text-4xl" style="font-family: var(--font-heading);">News and updates</h2>
                        <p class="mt-3 text-[var(--color-body)]/85">Helpful updates on supported living, referrals, and accommodation in the UK.</p>
                    </div>
                    <a href="<?php echo e(route('news.index')); ?>" class="hc-btn-secondary">All News</a>
                </div>

                <?php
                    $featuredPost = $posts->first();
                    $supportingPosts = $posts->skip(1);
                ?>

                <div class="mt-9 grid gap-6 xl:grid-cols-[1.25fr_0.95fr]">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($featuredPost): ?>
                        <article class="group relative overflow-hidden rounded-[2rem] bg-[var(--color-primary)] text-white shadow-2xl shadow-neutral-900/15 ring-1 ring-white/10">
                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($featuredPost->cover): ?>
                                <img src="<?php echo e(Storage::disk($featuredPost->cover->disk)->url($featuredPost->cover->path)); ?>" alt="<?php echo e($featuredPost->cover->alt_text ?: $featuredPost->title); ?>" class="absolute inset-0 h-full w-full object-cover opacity-45 transition duration-700 group-hover:scale-105" loading="lazy">
                                <div class="absolute inset-0 bg-gradient-to-r from-[var(--color-primary)] via-[var(--color-primary)]/85 to-[var(--color-primary)]/35"></div>
                            <?php else: ?>
                                <div class="absolute inset-0 bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-accent)]/70"></div>
                            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            <div class="relative flex min-h-[420px] flex-col justify-end p-6 md:p-8">
                                <span class="w-fit rounded-full bg-white/14 px-3 py-1 text-xs font-semibold uppercase tracking-[0.14em] text-white/80">Featured insight</span>
                                <div class="mt-4 flex flex-wrap items-center gap-2 text-xs font-semibold uppercase tracking-wide text-[var(--color-accent)]">
                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($featuredPost->category): ?>
                                        <span><?php echo e($featuredPost->category->name); ?></span>
                                        <span class="text-white/40" aria-hidden="true">•</span>
                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                    <time datetime="<?php echo e($featuredPost->published_at?->toIso8601String()); ?>"><?php echo e(optional($featuredPost->published_at)->format('j M Y')); ?></time>
                                </div>
                                <h3 class="mt-3 max-w-2xl font-display text-3xl font-bold leading-tight md:text-4xl" style="font-family: var(--font-heading);">
                                    <a href="<?php echo e(route('news.show', $featuredPost)); ?>"><?php echo e($featuredPost->title); ?></a>
                                </h3>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($featuredPost->excerpt): ?>
                                    <p class="mt-4 max-w-2xl text-sm leading-relaxed text-white/85 md:text-base"><?php echo e($featuredPost->excerpt); ?></p>
                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                <a href="<?php echo e(route('news.show', $featuredPost)); ?>" class="mt-6 inline-flex w-fit min-h-[44px] items-center justify-center rounded-full bg-[var(--color-accent)] px-5 py-2.5 text-sm font-semibold text-white transition hover:bg-white hover:text-[var(--color-primary)]">Read featured article</a>
                            </div>
                        </article>
                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

                    <div class="relative z-[1] grid gap-4">
                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $supportingPosts; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $post): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <article class="group grid gap-4 overflow-hidden rounded-3xl border border-[var(--color-primary)]/15 bg-white/95 p-4 shadow-sm backdrop-blur-sm transition duration-300 hover:-translate-y-1 hover:border-[var(--color-accent)]/40 hover:shadow-xl sm:grid-cols-[10rem_1fr]">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($post->cover): ?>
                                    <div class="h-40 overflow-hidden rounded-2xl sm:h-full">
                                        <img src="<?php echo e(Storage::disk($post->cover->disk)->url($post->cover->path)); ?>" alt="<?php echo e($post->cover->alt_text ?: $post->title); ?>" class="h-full w-full object-cover transition duration-700 group-hover:scale-105" loading="lazy">
                                    </div>
                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                <div class="py-1">
                                    <div class="flex flex-wrap items-center gap-2 text-xs font-semibold uppercase tracking-wide text-[var(--color-accent)]">
                                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($post->category): ?>
                                            <span><?php echo e($post->category->name); ?></span>
                                            <span aria-hidden="true">•</span>
                                        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                        <time datetime="<?php echo e($post->published_at?->toIso8601String()); ?>"><?php echo e(optional($post->published_at)->format('j M Y')); ?></time>
                                    </div>
                                    <h3 class="mt-2 font-display text-lg font-semibold leading-tight text-[var(--color-heading)]" style="font-family: var(--font-heading);">
                                        <a href="<?php echo e(route('news.show', $post)); ?>" class="hover:text-[var(--color-accent)]"><?php echo e($post->title); ?></a>
                                    </h3>
                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($post->excerpt): ?>
                                        <p class="mt-2 text-sm leading-relaxed text-[var(--color-body)]/75"><?php echo e(\Illuminate\Support\Str::limit($post->excerpt, 105)); ?></p>
                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                </div>
                            </article>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                    </div>
                </div>
            </div>
        </section>
    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.site', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\Users\MrKennyJava\Herd\hillcrest-web\resources\views/site/home.blade.php ENDPATH**/ ?>