@php
    $c = (array) ($site->contact ?? []);
    $social = (array) ($site->social ?? []);
    $navPages = $navPages ?? collect();
@endphp
<footer class="pf-footer">
    <div class="vs-container pf-footer-cta" data-aos="zoom-in">
        <span class="pf-shape" aria-hidden="true">🐾</span>
        <h2>Let’s give your buddy a happy, healthy life!</h2>
        <a href="#contact" class="pf-btn pf-btn-light">Book an appointment</a>
    </div>
    <div class="vs-container pf-footer-grid">
        <div>
            <a href="/" class="pf-logo" style="color:#fff">
                @if($site->logoUrl())<img src="{{ $site->logoUrl() }}" alt="">@else<span class="pf-logo-mark"><i class="fas fa-paw"></i></span>@endif
                <span>{{ $site->name }}</span>
            </a>
            @if($site->tagline)<p class="pf-footer-about">{{ $site->tagline }}</p>@endif
            <div class="pf-social">
                @foreach(['facebook','instagram','twitter','youtube','tiktok'] as $net)
                    @if(!empty($social[$net]))<a href="{{ $social[$net] }}" target="_blank" rel="noopener"><i class="fab fa-{{ $net }}"></i></a>@endif
                @endforeach
            </div>
        </div>
        <div><h4>Menu</h4><ul>@foreach($navPages as $p)<li><a href="{{ $p->is_home ? '/' : '/'.$p->slug }}">{{ $p->title }}</a></li>@endforeach<li><a href="/portal">Client Portal</a></li></ul></div>
        <div><h4>Say hello</h4><ul class="pf-footer-contact">
            @if(!empty($c['phone']))<li><i class="fas fa-phone"></i> {{ $c['phone'] }}</li>@endif
            @if(!empty($c['email']))<li><i class="fas fa-envelope"></i> {{ $c['email'] }}</li>@endif
            @if(!empty($c['address']))<li><i class="fas fa-location-dot"></i> {{ $c['address'] }}</li>@endif
        </ul></div>
    </div>
    <div class="pf-footer-bar"><div class="vs-container">
        <span>© {{ now()->year }} {{ $site->name }} · Made with <i class="fas fa-heart" style="color:#ff6b6b"></i></span>
        <span style="opacity:.7">Powered by VET One</span>
    </div></div>
</footer>
