@php($d = $d ?? [])
<section class="vs-section vs-hero" id="home">
    <div class="vs-hero-decor" aria-hidden="true"><span></span><span></span><span></span></div>
    <div class="vs-container vs-hero-inner">
        <div class="vs-hero-copy" data-aos="fade-up">
            @if(!empty($d['eyebrow']))
                <span class="vs-eyebrow vs-eyebrow-pill"><i class="fas fa-stethoscope"></i> {{ $d['eyebrow'] }}</span>
            @endif
            <h1 class="vs-hero-title">{!! nl2br(e($d['heading'] ?? '')) !!}</h1>
            @if(!empty($d['subheading']))
                <p class="vs-hero-sub">{{ $d['subheading'] }}</p>
            @endif
            <div class="vs-hero-actions">
                @if(!empty($d['primary_label']))
                    <a href="{{ $d['primary_url'] ?? '#' }}" class="vs-btn vs-btn-primary"><i class="fas fa-calendar-check"></i> {{ $d['primary_label'] }}</a>
                @endif
                @if(!empty($d['secondary_label']))
                    <a href="{{ $d['secondary_url'] ?? '#' }}" class="vs-btn vs-btn-ghost">{{ $d['secondary_label'] }}</a>
                @endif
            </div>
            <div class="vs-hero-trust">
                <div class="vs-trust-stars"><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i><i class="fas fa-star"></i></div>
                <span>Loved by <strong>15,000+</strong> patients</span>
            </div>
        </div>

        <div class="vs-hero-media" data-aos="fade-left" data-aos-delay="150">
            <div class="vs-hero-card">
                @if(!empty($d['image']))
                    <img src="{{ $d['image'] }}" alt="{{ $d['heading'] ?? '' }}">
                @else
                    <div class="vs-hero-card-ph"><i class="fas fa-stethoscope"></i></div>
                @endif
            </div>
            <div class="vs-hero-badge vs-hero-badge-1"><i class="fas fa-shield-heart"></i><div><strong>24/7</strong><span>Emergency care</span></div></div>
            <div class="vs-hero-badge vs-hero-badge-2"><i class="fas fa-stethoscope"></i><div><strong>Certified</strong><span>Expert doctors</span></div></div>
        </div>
    </div>
    <div class="vs-hero-wave" aria-hidden="true">
        <svg viewBox="0 0 1440 80" preserveAspectRatio="none"><path d="M0,40 C320,90 640,0 960,30 C1200,52 1320,60 1440,40 L1440,80 L0,80 Z"></path></svg>
    </div>
</section>
