{{--
    The public landing body — ONE partial that renders every section from the
    resolved content array ($c) for ALL skins. Structural choices come from the
    template flags ($flags); colour/tone come from the CSS variables the wrapper
    stamped. Adding a skin never touches this file — only config/landing_templates.
    Each section honours its $c['sections'][key] visibility toggle.

    LANDING STUDIO CONTRACT (all inert to visitors):
      • every editable text node carries data-lp="<dotted path>" matching the
        content model, so the Studio patches it live over postMessage;
      • every section carries the DOM id the Studio uses as its anchor, so a
        click in the preview selects that section;
      • the reorderable body sections (compare … cta) render from $c['order'],
        so the Studio can move them without touching code. Header, hero, stats,
        mockup and footer keep their fixed positions.
--}}
@php
    $heroLayout = $flags['hero_layout'] ?? 'center';
    $showMockup = (bool) ($flags['show_mockup'] ?? true);
    $on = fn ($key) => (bool) data_get($c, "sections.$key", true);
    $studioPreview = $studioPreview ?? false;

    // Reorderable body sections between the hero/stats/mockup and the footer.
    // Sanitise the saved order: keep only known keys, then append any default
    // the saved list is missing — a stale or malformed order can never drop a
    // block or render an unknown partial.
    // Pricing is owner-only: resellers don't sell sub-panels, so it is always
    // excluded from their landing regardless of the saved order or visibility toggle.
    $bodyDefault = ['compare', 'features', 'networks', 'steps', 'pricing', 'testimonials', 'faq', 'cta'];
    if (! ($isOwnerPanel ?? true)) {
        $bodyDefault = array_values(array_diff($bodyDefault, ['pricing']));
    }
    $saved = (array) data_get($c, 'order', []);
    $bodyOrder = array_values(array_filter($saved, fn ($k) => in_array($k, $bodyDefault, true)));
    foreach ($bodyDefault as $k) {
        if (! in_array($k, $bodyOrder, true)) {
            $bodyOrder[] = $k;
        }
    }
@endphp

{{-- ============================ HEADER ============================ --}}
<header id="site-nav" class="lp-header">
    <div class="lp-wrap lp-headrow">
        <a href="#top" class="lp-brand">
            @if (!empty($logoUrl))
                <img src="{{ $logoUrl }}" alt="{{ $appName }}" class="lp-brand-logo">
            @else
                <span class="lp-brand-mark">{{ mb_substr($appName, 0, 1) }}</span>
                <span class="lp-brand-name">{{ $appName }}</span>
            @endif
        </a>
        <nav class="lp-nav">
            @foreach ((array) data_get($c, 'nav', []) as $i => $link)
                @php $linkUrl = $link['url'] ?? '#'; @endphp
                @if (($isOwnerPanel ?? true) || $linkUrl !== '#pricing')
                    <a href="{{ $linkUrl }}" data-lp="nav.{{ $i }}.label">{{ $link['label'] ?? '' }}</a>
                @endif
            @endforeach
            @if ($serviceListPublic ?? false)
                <a href="{{ route('public.services') }}">{{ __('Services') }}</a>
            @endif
        </nav>
        <div class="lp-headcta">
            @if (auth()->check() && ! $studioPreview)
                {{-- Already signed in: a real dashboard link, not Sign in / Get
                     started (the guest guard would bounce those back here). In
                     Studio preview we render the visitor header regardless, so
                     the editor sees (and can edit) what a visitor sees. --}}
                <a href="{{ user_home_url() }}" class="lp-btn lp-btn-primary">
                    @include('frontend.partials.icon', ['name' => 'gauge', 'size' => 16])
                    {{ __('Go to dashboard') }}
                </a>
            @elseif ($disableSignup ?? false)
                {{-- Signup disabled: show only login. --}}
                <a href="{{ route('login') }}" class="lp-btn lp-btn-primary" data-lp="sign_in_label">{{ data_get($c, 'sign_in_label', __('Sign in')) }}</a>
            @else
                <a href="{{ route('login') }}" class="lp-link-muted" data-lp="sign_in_label">{{ data_get($c, 'sign_in_label', __('Sign in')) }}</a>
                <a href="{{ route('register') }}" class="lp-btn lp-btn-primary" data-lp="get_started_label">{{ data_get($c, 'get_started_label', __('Get started')) }}</a>
            @endif
        </div>
    </div>
</header>

{{-- ============================ HERO ============================ --}}
@php $heroClass = ($flags['hero_dark'] ?? true) ? 'lp-hero-dark' : 'lp-hero-light'; @endphp
<section id="top" class="lp-hero {{ $heroClass }}">
    {{-- Floating likes/hearts — pure CSS delight, decorative (aria-hidden). --}}
    @php
        $hearts = [
            ['e' => '❤️', 'l' => 6,  'd' => 0.0, 't' => 9],  ['e' => '👍', 'l' => 16, 'd' => 2.4, 't' => 11],
            ['e' => '⭐', 'l' => 27, 'd' => 5.1, 't' => 10], ['e' => '🔥', 'l' => 38, 'd' => 1.2, 't' => 12],
            ['e' => '💜', 'l' => 49, 'd' => 6.3, 't' => 9],  ['e' => '❤️', 'l' => 60, 'd' => 3.0, 't' => 11],
            ['e' => '👍', 'l' => 71, 'd' => 7.5, 't' => 10], ['e' => '⭐', 'l' => 82, 'd' => 0.8, 't' => 12],
            ['e' => '🔥', 'l' => 91, 'd' => 4.2, 't' => 9],  ['e' => '💜', 'l' => 12, 'd' => 8.0, 't' => 13],
            ['e' => '❤️', 'l' => 44, 'd' => 9.4, 't' => 11], ['e' => '👍', 'l' => 66, 'd' => 10.2, 't' => 10],
            ['e' => '⭐', 'l' => 86, 'd' => 6.8, 't' => 12], ['e' => '🔥', 'l' => 33, 'd' => 3.7, 't' => 13],
        ];
    @endphp
    <div class="lp-hearts" aria-hidden="true">
        @foreach ($hearts as $h)
            <span class="lp-heart" style="left:{{ $h['l'] }}%;animation-delay:{{ $h['d'] }}s;animation-duration:{{ $h['t'] }}s;">{{ $h['e'] }}</span>
        @endforeach
    </div>
    @if ($heroLayout === 'split')
        <div class="lp-hero-inner lp-hero-split">
            <div data-reveal>
                @include('frontend.partials._hero-copy')
            </div>
            @if ($showMockup)
                <div data-reveal>@include('frontend.partials.mockup')</div>
            @endif
        </div>
    @else
        <div class="lp-hero-inner lp-hero-center" data-reveal>
            @include('frontend.partials._hero-copy')
            @if ($on('stats'))
                <div id="stats" class="lp-statgrid lp-statrow" style="max-width:860px;margin-left:auto;margin-right:auto;">
                    @foreach ((array) data_get($c, 'stats', []) as $i => $s)
                        <div>
                            <div class="lp-stat-value" data-lp="stats.{{ $i }}.value">{{ $s['value'] ?? '' }}</div>
                            <div class="lp-stat-label" data-lp="stats.{{ $i }}.label">{{ $s['label'] ?? '' }}</div>
                        </div>
                    @endforeach
                </div>
            @endif
        </div>
    @endif
</section>

{{-- Mockup straddling the fold for the centred layouts --}}
@if ($showMockup && $heroLayout !== 'split')
    <div style="background:{{ ($flags['page_dark'] ?? false) ? 'var(--lp-paper)' : 'linear-gradient(180deg,var(--lp-ink) 0,var(--lp-ink) 46%,var(--lp-paper) 46%,var(--lp-paper) 100%)' }};">
        <div class="lp-mockwrap" data-reveal>@include('frontend.partials.mockup')</div>
    </div>
@endif

{{-- Stats strip for the split layout (centred layout puts them in the hero) --}}
@if ($on('stats') && $heroLayout === 'split')
    <section id="stats" class="lp-section" style="padding-top:56px;padding-bottom:56px;">
        <div class="lp-wrap lp-statgrid" data-reveal>
            @foreach ((array) data_get($c, 'stats', []) as $i => $s)
                <div style="text-align:center;">
                    <div class="lp-stat-value" data-lp="stats.{{ $i }}.value">{{ $s['value'] ?? '' }}</div>
                    <div class="lp-stat-label" data-lp="stats.{{ $i }}.label">{{ $s['label'] ?? '' }}</div>
                </div>
            @endforeach
        </div>
    </section>
@endif

{{-- ==================== REORDERABLE BODY SECTIONS ====================
     compare · features · networks · steps · pricing · testimonials · faq · cta,
     in the admin's chosen order, each honouring its own visibility toggle. --}}
@foreach ($bodyOrder as $sk)
    @if ($on($sk))
        @include('frontend.partials.sections.' . $sk)
    @endif
@endforeach

{{-- ========================== SUBSCRIBE ========================== --}}
@if ($on('subscribe'))
    @include('frontend.partials.sections.subscribe')
@endif

{{-- ============================ FOOTER ============================
     Extracted so the public content pages (layouts/public) close with the SAME
     footer as the landing — same brand, same social links, same legal pages. --}}
@include('frontend.partials.footer', ['footerHome' => '#top'])

{{-- ============================ VIDEO MODAL ============================ --}}
@if (data_get($c, 'hero.video_url'))
    @php
        $videoUrl = (string) data_get($c, 'hero.video_url');
        $isFile = (bool) preg_match('/\.(mp4|webm|ogg)(\?.*)?$/i', $videoUrl);
    @endphp
    <div id="lp-video-modal" class="lp-modal" hidden
         data-url="{{ $videoUrl }}" data-file="{{ $isFile ? '1' : '0' }}"
         onclick="if (event.target === this) lpCloseVideo()">
        <div class="lp-modal-box">
            <button type="button" class="lp-modal-close" onclick="lpCloseVideo()" aria-label="{{ __('Close') }}">
                @include('frontend.partials.icon', ['name' => 'x', 'size' => 18, 'sw' => 2.4])
            </button>
            <div id="lp-video-slot"></div>
        </div>
    </div>
@endif