@extends('site.layouts.app')

@php
    use Illuminate\Support\Facades\Storage;

    $rp = app()->getLocale() === 'ar' ? 'site.ar.' : 'site.';

    $hero = $page->sectionContent('hero');
    $intro = $page->sectionContent('intro');
    $about = $page->sectionContent('about');
    $approche = $page->sectionContent('approche');

    // Hero background media. Priority: a CMS image (page_sections « hero.media_image »);
    // otherwise the cinematic video shipped in public/media (hero.webm/mp4 + poster).
    // The navy gradient of .hero always sits behind as the ultimate fallback.
    $heroCmsImage = ! empty($hero['media_image']) ? Storage::disk('public')->url($hero['media_image']) : null;
    $heroWebm = file_exists(public_path('media/hero.webm')) ? asset('media/hero.webm') : null;
    $heroMp4 = file_exists(public_path('media/hero.mp4')) ? asset('media/hero.mp4') : null;
    $heroPoster = file_exists(public_path('media/hero-poster.jpg')) ? asset('media/hero-poster.jpg') : null;
    $heroVideo = ! $heroCmsImage && ($heroWebm || $heroMp4); // video only when no CMS image overrides it
    $heroBgImage = $heroCmsImage ?: ($heroVideo ? $heroPoster : null); // also the mobile / reduced-motion fallback
    $hasHeroMedia = (bool) ($heroCmsImage || $heroVideo);

    // Hero trust badges — CMS-overridable, faithful defaults.
    $heroTrust = $hero['trust'] ?? [
        ['num' => '360°', 'lab' => 'Accompagnement'],
        ['num' => '6', 'lab' => 'Expertises'],
        ['num' => '2026', 'lab' => 'Nouvelle cohorte'],
    ];
@endphp

@section('title', $page->localized('meta_title') ?: \App\Support\Identite::marque())
@section('description', $page->localized('meta_description') ?: 'Incubation, accélération, formation, branding, marketing digital et production audiovisuelle pour entrepreneurs et institutions au Maroc. Basé à Fès.')

@section('content')
    {{-- ============================ HERO ============================ --}}
    <section @class(['hero', 'has-media' => $hasHeroMedia]) id="hero" aria-label="{{ \App\Support\Identite::marque() }}">
        @if ($heroBgImage)<div class="hero-bg-poster" aria-hidden="true" style="background-image:url('{{ $heroBgImage }}')"></div>@endif
        @if ($heroVideo)
            {{-- Vidéo de fond injectée par main.js (desktop hors reduced-motion) : jamais chargée sur mobile / RM. --}}
            <div data-hero-video
                 @if ($heroPoster) data-poster="{{ $heroPoster }}" @endif
                 @if ($heroWebm) data-webm="{{ $heroWebm }}" @endif
                 @if ($heroMp4) data-mp4="{{ $heroMp4 }}" @endif
                 aria-hidden="true"></div>
        @endif
        <div class="hero-orbs" aria-hidden="true">
            <div class="hero-orb-wrap" data-depth="18"><span class="hero-orb orb-1"></span></div>
            <div class="hero-orb-wrap" data-depth="-26"><span class="hero-orb orb-2"></span></div>
            <div class="hero-orb-wrap" data-depth="34"><span class="hero-orb orb-3"></span></div>
        </div>

        <div class="container hero-grid">
            <div class="hero-copy">
                <span class="eyebrow on-dark hero-anim" style="--ha:0">{{ $hero['eyebrow'] ?? 'Incubateur · Accélérateur · Studio digital' }}</span>
                <h1 data-split-words>{{ \App\Support\HtmlSanitizer::html($hero['heading'] ?? 'Accélérez votre projet,<br><span class="accent">amplifiez votre impact.</span>') }}</h1>
                <p class="hero-anim" style="--ha:5">{{ $hero['subheading'] ?? '' }}</p>

                <div class="hero-actions hero-anim" style="--ha:6">
                    <a href="{{ route($rp.'services.index') }}" class="btn btn-accent" data-magnetic>
                        {{ $hero['primary_cta']['label'] ?? __('site.cta.discover') }}
                        <svg class="btn-arrow" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 5l7 7-7 7"/></svg>
                    </a>
                    <a href="{{ route($rp.'contact') }}" class="btn btn-ghost" data-magnetic>{{ $hero['secondary_cta']['label'] ?? __('site.cta.contact') }}</a>
                </div>

                <div class="hero-trust hero-anim" style="--ha:7" aria-label="Quelques chiffres">
                    @foreach ($heroTrust as $badge)
                        <div class="stat"><div class="num">{{ $badge['num'] }}</div><div class="lab">{{ $badge['lab'] }}</div></div>
                    @endforeach
                </div>
            </div>

            <div class="hero-visual">
                <div class="hero-frame ph-frame" data-ph="hero-portrait.webp">
                    @if ($heroImg = \App\Support\Site\MediaVitrine::url('hero-portrait.webp'))
                        <img src="{{ $heroImg }}" alt="" width="1200" height="1500" fetchpriority="high" decoding="async">
                    @endif
                </div>

                <div class="glass g1" aria-hidden="true">
                    <span class="dot"></span>
                    <div><strong>Programme actif</strong><span>Cohorte d’incubation 2026</span></div>
                </div>
                <div class="glass g2" aria-hidden="true">
                    <span class="dot dot-alt"></span>
                    <div><strong>Approche 360°</strong><span>de l’idée à la mise à l’échelle</span></div>
                </div>
            </div>
        </div>

        <a href="#presentation" class="scroll-cue" aria-label="Faire défiler"></a>
    </section>

    {{-- ========================= PRÉSENTATION / INTRO ========================= --}}
    @if ($intro)
    <section class="section-light" id="presentation" aria-labelledby="presentation-title">
        <div class="container intro-grid">
            <div class="intro-text reveal">
                @if (! empty($intro['eyebrow']))<span class="eyebrow">{{ $intro['eyebrow'] }}</span>@endif
                <h2 id="presentation-title">{{ $intro['heading'] ?? '' }}</h2>
                @if (! empty($intro['body']))<p>{{ \App\Support\HtmlSanitizer::html($intro['body']) }}</p>@endif
                @if (! empty($intro['body_2']))<p>{{ \App\Support\HtmlSanitizer::html($intro['body_2']) }}</p>@endif

                @if (! empty($intro['pillars']))
                    <div class="intro-pillars" data-stagger>
                        @foreach ($intro['pillars'] as $pillar)
                            <div class="intro-pillar reveal">
                                <span class="ico" aria-hidden="true">
                                    @switch($loop->index)
                                        @case(0)<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 3h7v7H3zM14 3h7v7h-7zM14 14h7v7h-7zM3 14h7v7H3z"/></svg>@break
                                        @case(1)<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 10L12 5 2 10l10 5 10-5zM6 12v5c0 1.1 2.7 3 6 3s6-1.9 6-3v-5"/></svg>@break
                                        @case(2)<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 2L3 14h7l-1 8 10-12h-7z"/></svg>@break
                                        @default<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M2 12h20M12 2a15 15 0 010 20M12 2a15 15 0 000 20"/></svg>
                                    @endswitch
                                </span>
                                <h4>{{ $pillar['title'] ?? '' }}</h4>
                                <p>{{ $pillar['text'] ?? '' }}</p>
                            </div>
                        @endforeach
                    </div>
                @endif
            </div>

            <div class="intro-visual reveal reveal-delay-2">
                <div class="frame">
                    <div class="ph-frame ph-ratio-45" data-ph="intro-team.webp">
                        @if ($introImg = \App\Support\Site\MediaVitrine::url('intro-team.webp'))
                            <img src="{{ $introImg }}" alt="" width="1000" height="1250" loading="lazy" decoding="async" data-parallax="0.05">
                        @endif
                    </div>
                </div>
                <div class="badge"><div><div class="num">360°</div><div class="lab">Accompagnement sur-mesure</div></div></div>
            </div>
        </div>
    </section>
    @endif

    {{-- ============================ ABOUT ============================ --}}
    @if ($about)
    <section class="section-soft" id="about" aria-labelledby="about-title">
        <div class="container about-grid">
            <div class="about-visual reveal">
                <div class="ph-frame ph-ratio-45" data-ph="about-mentor.webp">
                    @if ($aboutImg = \App\Support\Site\MediaVitrine::url('about-mentor.webp'))
                        <img src="{{ $aboutImg }}" alt="" width="1200" height="1500" loading="lazy" decoding="async" data-parallax="0.06">
                    @endif
                </div>
            </div>
            <div class="about-text reveal reveal-delay-1">
                @if (! empty($about['eyebrow']))<span class="eyebrow">{{ $about['eyebrow'] }}</span>@endif
                <h2 id="about-title">{{ $about['heading'] ?? '' }}</h2>
                @if (! empty($about['body']))<p>{{ \App\Support\HtmlSanitizer::html($about['body']) }}</p>@endif
                @if (! empty($about['body_2']))<p>{{ \App\Support\HtmlSanitizer::html($about['body_2']) }}</p>@endif

                @if (! empty($about['values']))
                    <div class="about-values" data-stagger>
                        @foreach ($about['values'] as $value)
                            <div class="about-value reveal">
                                <span class="ico" aria-hidden="true">
                                    @switch($loop->index)
                                        @case(0)<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>@break
                                        @case(1)<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>@break
                                        @case(2)<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 11H5a2 2 0 00-2 2v7h6v-9zM15 5h4a2 2 0 012 2v13h-6V7a2 2 0 012-2zM9 5H7a2 2 0 00-2 2v4h6V7a2 2 0 00-2-2z"/></svg>@break
                                        @default<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15 8.5 22 9.3 17 14.1 18.2 21 12 17.8 5.8 21 7 14.1 2 9.3 9 8.5 12 2"/></svg>
                                    @endswitch
                                </span>
                                <div><strong>{{ $value['title'] ?? '' }}</strong><span>{{ $value['text'] ?? '' }}</span></div>
                            </div>
                        @endforeach
                    </div>
                @endif
            </div>
        </div>
    </section>
    @endif

    {{-- ============================ SERVICES ============================ --}}
    @if ($services->isNotEmpty())
    <section class="section-light" id="services" aria-labelledby="services-title">
        <div class="container">
            <div class="section-title reveal">
                <span class="eyebrow">{{ __('site.nav.services') }}</span>
                <h2 id="services-title">{{ __('site.home.services_title') }}</h2>
                <p>{{ __('site.home.services_intro') }}</p>
            </div>

            <div class="services-grid" data-stagger>
                @foreach ($services as $service)
                    <article class="service-card reveal" data-tilt>
                        <div class="service-icon" aria-hidden="true">@include('site.partials.service-icon', ['icon' => $service->icon])</div>
                        <h3>{{ $service->localized('title') }}</h3>
                        <p>{{ $service->localized('excerpt') }}</p>
                        <a href="{{ route($rp.'services.show', $service->slug) }}" class="service-link">{{ __('site.cta.read_more') }}
                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 5l7 7-7 7"/></svg>
                        </a>
                    </article>
                @endforeach
            </div>
        </div>
    </section>
    @endif

    {{-- ============================ MÉTHODE 360° ============================ --}}
    @if ($approche)
    <section class="section-dark section-process" id="approche" aria-labelledby="approche-title">
        <div class="container">
            <div class="section-title reveal">
                <span class="eyebrow on-dark">{{ $approche['eyebrow'] ?? __('site.nav.method') }}</span>
                <h2 id="approche-title">{{ $approche['heading'] ?? '' }}</h2>
                @if (! empty($approche['intro']))<p>{{ $approche['intro'] }}</p>@endif
            </div>

            @if (! empty($approche['steps']))
                <ol class="process" data-process>
                    <span class="process-line" aria-hidden="true"><span class="process-line-fill"></span></span>
                    @foreach ($approche['steps'] as $step)
                        <li class="process-step">
                            <span class="process-marker" aria-hidden="true">
                                @switch($loop->index)
                                    @case(0)<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18h6"/><path d="M10 22h4"/><path d="M12 2a7 7 0 00-4 12.7c.6.5 1 1.3 1 2.1V17h6v-.2c0-.8.4-1.6 1-2.1A7 7 0 0012 2z"/></svg>@break
                                    @case(1)<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2L2 7l10 5 10-5-10-5z"/><path d="M2 17l10 5 10-5"/><path d="M2 12l10 5 10-5"/></svg>@break
                                    @case(2)<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 6 13.5 15.5 8.5 10.5 1 18"/><polyline points="17 6 23 6 23 12"/></svg>@break
                                    @default<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 00-2.91-.09z"/><path d="M12 15l-3-3a22 22 0 012-3.95A12.88 12.88 0 0122 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 01-4 2z"/></svg>
                                @endswitch
                            </span>
                            <span class="process-num" aria-hidden="true">{{ str_pad($loop->iteration, 2, '0', STR_PAD_LEFT) }}</span>
                            <h3>{{ $step['title'] ?? '' }}</h3>
                            <p>{{ $step['text'] ?? '' }}</p>
                        </li>
                    @endforeach
                </ol>
            @endif

            @if ($keyFigures->isNotEmpty())
                <div class="stats-grid" data-stagger>
                    @foreach ($keyFigures as $figure)
                        @php $digits = (int) filter_var($figure->value, FILTER_SANITIZE_NUMBER_INT); @endphp
                        <div class="stat-card reveal">
                            <div class="value">
                                @if (\Illuminate\Support\Str::startsWith($figure->value, '+'))<span class="plus">+</span>@endif
                                <span data-counter="{{ $digits }}">0</span>
                                @if ($figure->suffix)<span class="plus">{{ $figure->suffix }}</span>@endif
                            </div>
                            <span class="label">{{ $figure->localized('label') }}</span>
                        </div>
                    @endforeach
                </div>
            @endif
        </div>
    </section>
    @endif

    {{-- ============================ PARTENAIRES ============================ --}}
    <section class="section-light section-refs" id="partenaires" aria-labelledby="partenaires-title">
        <div class="container">
            <div class="section-title reveal">
                <span class="eyebrow">Ils nous font confiance</span>
                <h2 id="partenaires-title">{{ __('site.home.partners_title') }}</h2>
                <p>Un écosystème d’institutions, d’entreprises et d’acteurs engagés à nos côtés.</p>
            </div>
        </div>

        <div class="marquee reveal" aria-label="Logos de nos partenaires">
            <div class="marquee-track">
                @forelse ($partners as $partner)
                    <div class="partner-card ph-frame ph-logo">
                        @if ($partner->logo_path)
                            <img src="{{ Storage::disk('public')->url($partner->logo_path) }}" alt="{{ $partner->name }}" width="400" height="200" loading="lazy" decoding="async">
                        @else
                            <span>{{ $partner->name }}</span>
                        @endif
                    </div>
                @empty
                    @for ($i = 1; $i <= 9; $i++)
                        <div class="partner-card ph-frame ph-logo" data-ph="partner-{{ $i }}.png">
                            @if ($partnerImg = \App\Support\Site\MediaVitrine::url('partner-'.$i.'.png'))
                                <img src="{{ $partnerImg }}" alt="Logo partenaire {{ $i }}" width="400" height="200" loading="lazy" decoding="async">
                            @endif
                        </div>
                    @endfor
                @endforelse
            </div>
        </div>
    </section>

    {{-- ============================ TÉMOIGNAGES ============================ --}}
    @if ($testimonials->isNotEmpty())
    <section class="section-soft" id="temoignages" aria-labelledby="temoignages-title">
        <div class="container">
            <div class="section-title reveal">
                <span class="eyebrow">{{ __('site.home.testimonials_title') }}</span>
                <h2 id="temoignages-title">Ils ont franchi le cap avec nous</h2>
                @if ($testimonials->contains(fn ($t) => $t->is_illustrative))
                    <p class="testi-note">Exemples illustratifs — témoignages réels en cours de collecte.</p>
                @endif
            </div>

            <div class="testi-slider reveal" data-testi>
                <div class="testi-viewport">
                    <ul class="testi-track">
                        @foreach ($testimonials as $t)
                            <li class="testi-card">
                                <svg class="testi-quote" width="32" height="32" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M9.6 5C6 7 4 10 4 13.6c0 2.8 1.8 4.7 4.2 4.7 2.2 0 3.8-1.6 3.8-3.8 0-2-1.4-3.5-3.3-3.5-.3 0-.7 0-.8.1.3-1.8 1.9-3.9 3.7-4.9L9.6 5zm9 0c-3.5 2-5.6 5-5.6 8.6 0 2.8 1.9 4.7 4.2 4.7 2.2 0 3.8-1.6 3.8-3.8 0-2-1.4-3.5-3.3-3.5-.3 0-.6 0-.8.1.3-1.8 1.9-3.9 3.7-4.9L18.6 5z"/></svg>
                                <blockquote><p>« {{ $t->localized('quote') }} »</p></blockquote>
                                @php
                                    $initials = \Illuminate\Support\Str::of($t->author_name)->trim()->explode(' ')
                                        ->filter()->take(2)
                                        ->map(fn ($w) => \Illuminate\Support\Str::upper(\Illuminate\Support\Str::substr($w, 0, 1)))
                                        ->implode('');
                                @endphp
                                <footer>
                                    <span class="testi-avatar ph-frame">
                                        @if ($t->avatar_path)
                                            <img src="{{ Storage::disk('public')->url($t->avatar_path) }}" alt="Portrait de {{ $t->author_name }}" width="200" height="200" loading="lazy" decoding="async">
                                        @else
                                            <span class="avatar-initials" aria-hidden="true">{{ $initials }}</span>
                                        @endif
                                    </span>
                                    <div>
                                        <cite>{{ $t->author_name }}</cite>
                                        <span>{{ $t->localized('role') }}</span>
                                    </div>
                                </footer>
                            </li>
                        @endforeach
                    </ul>
                </div>

                <div class="testi-nav">
                    <button type="button" class="testi-btn testi-prev" aria-label="Témoignage précédent">
                        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M19 12H5M11 19l-7-7 7-7"/></svg>
                    </button>
                    <div class="testi-dots" aria-label="Choisir un témoignage"></div>
                    <button type="button" class="testi-btn testi-next" aria-label="Témoignage suivant">
                        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 5l7 7-7 7"/></svg>
                    </button>
                </div>
            </div>
        </div>
    </section>
    @endif

    {{-- ============================ FAQ ============================ --}}
    @if ($faqs->isNotEmpty())
    <section class="section-light" id="faq" aria-labelledby="faq-title">
        <div class="container faq-wrap">
            <div class="section-title reveal">
                <span class="eyebrow">FAQ</span>
                <h2 id="faq-title">{{ __('site.faq.title') }}</h2>
                <p>Tout ce qu’il faut savoir avant de candidater ou de nous confier un projet.</p>
            </div>

            <div class="faq-list" data-stagger>
                @foreach ($faqs as $faq)
                    <div class="faq-item reveal">
                        <h3>
                            <button type="button" class="faq-q" id="faq-q{{ $loop->iteration }}" aria-expanded="false" aria-controls="faq-a{{ $loop->iteration }}">
                                {{ $faq->localized('question') }}
                                <svg class="faq-chevron" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.25" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
                            </button>
                        </h3>
                        <div class="faq-a" id="faq-a{{ $loop->iteration }}" role="region" aria-labelledby="faq-q{{ $loop->iteration }}">
                            <div class="faq-a-inner"><p>{{ $faq->localized('answer') }}</p></div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </section>
    @endif

    {{-- ============================ CONTACT ============================ --}}
    @include('site.partials.contact-section')
@endsection

@push('jsonld')
    @if ($faqs->isNotEmpty())
        @php
            $faqSchema = [
                '@context' => 'https://schema.org',
                '@type' => 'FAQPage',
                'mainEntity' => $faqs->map(fn ($f) => [
                    '@type' => 'Question',
                    'name' => $f->localized('question'),
                    'acceptedAnswer' => ['@type' => 'Answer', 'text' => strip_tags((string) $f->localized('answer'))],
                ])->all(),
            ];
        @endphp
        <script type="application/ld+json">@json($faqSchema, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE)</script>
    @endif
@endpush