{{-- Networks marquee. The track is rendered TWICE for a seamless loop, so each
     node addresses its ORIGINAL row (index modulo the real count) — that way
     both copies carry the same data-lp and both patch live. Colour is
     structural (reloads); name/desc patch as text. --}}
<section id="networks" class="lp-section lp-section-alt">
    <div class="lp-wrap">
        <div class="lp-head" data-reveal>
            <div class="lp-eyebrow" data-lp="networks_heading.eyebrow">{{ data_get($c, 'networks_heading.eyebrow') }}</div>
            <h2 class="lp-h2" data-lp="networks_heading.title">{{ data_get($c, 'networks_heading.title') }}</h2>
            <p class="lp-lead" data-lp="networks_heading.subtitle">{{ data_get($c, 'networks_heading.subtitle') }}</p>
        </div>
    </div>
    @php $nets = (array) data_get($c, 'networks', []); $netCount = max(count($nets), 1); @endphp
    @if (! empty($nets))
        @foreach ([1, 2] as $row)
            <div class="lp-marquee {{ $row === 2 ? 'lp-marquee-2' : '' }}" data-reveal>
                <div class="lp-marquee-track">
                    @foreach (array_merge($nets, $nets) as $k => $net)
                        @php $oi = $k % $netCount; @endphp
                        <div class="lp-mnet">
                            <span class="lp-mnet-badge" style="background:{{ \App\Support\Css::color($net['color'] ?? null, 'var(--lp-brand)') }};">{{ mb_substr($net['name'] ?? '?', 0, 1) }}</span>
                            <div>
                                <div class="lp-mnet-name" data-lp="networks.{{ $oi }}.name">{{ $net['name'] ?? '' }}</div>
                                <div class="lp-mnet-desc" data-lp="networks.{{ $oi }}.desc">{{ $net['desc'] ?? '' }}</div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        @endforeach
    @endif
</section>