{{-- ===== HERO SECTION ===== --}}
@php
    $c = $content ?? collect();
    // A key the operator emptied in the content editor hides that line,
    // rather than bringing back the stock wording.
    $val = fn (string $key, ?string $default = null) => $c->has($key) ? trim((string) $c->get($key)->content_value) : $default;

    $heroTitle = $val('title', __('sections.hero.title'));
    $heroSubtitle = $val('subtitle', __('sections.hero.subtitle'));
    $heroDesc = $val('description', __('sections.hero.description'));
    $badgeText = $val('badge_text', __('sections.hero.badge'));
    $ctaText = $val('cta_text', __('sections.hero.cta'));
    $ctaUrl = $val('cta_url', '/client/store') ?: '/client/store';
    $cta2Text = $val('cta_secondary_text', __('sections.hero.cta_secondary'));
    $cta2Url = $val('cta_secondary_url', '/client/domain-search') ?: '/client/domain-search';
    $imageUrl = $val('image_url', '');

    // The picture beside the text: the operator's own image when set,
    // otherwise an animation - the one named in the content editor, or the
    // theme's (theme.json "hero": {"animation": ...}) when that is left empty.
    // "none" leaves the hero as centred text.
    $animations = ['browser', 'servers', 'dns'];
    $animation = strtolower($val('animation', '') ?: ($themeHeroAnimation ?? 'browser'));
    if (! in_array($animation, $animations, true)) {
        $animation = 'none';
    }
    $hasVisual = $imageUrl !== '' || $animation !== 'none';

    // The domain the animations show.
    $demoDomain = __('sections.hero.anim_domain');

    // The short selling points, shown in one line under the text.
    $points = array_values(array_filter([
        $val('stat_1_text', __('sections.hero.stat_1')),
        $val('stat_2_text', __('sections.hero.stat_2')),
        $val('callout_1_text', __('sections.hero.callout_1')),
        $val('callout_2_text', __('sections.hero.callout_2')),
    ], fn ($p) => $p !== null && $p !== ''));
@endphp
<section class="hero {{ $hasVisual ? 'hero--split' : 'hero--text' }}">
    <div class="container">
        <div class="hero__inner">
            <div class="hero__copy">
                @if($badgeText)
                <div class="hero__badge">{{ $badgeText }}</div>
                @endif
                {{-- The headline is the one string on this page allowed to
                     carry markup: the Turkish and English values both wrap
                     their second half in <span> for the accent colour that
                     .hero__title span sets. It reaches here from the site
                     content editor or from sections.hero.title, and both of
                     those are operator-writable, so it goes through the same
                     allow-list the public guide pages use rather than through
                     a raw echo. See App\Support\InlineMarkup. --}}
                <h1 class="hero__title">{{ inline_markup($heroTitle) }}</h1>
                @if($heroSubtitle)
                <p class="hero__title-sub">{{ $heroSubtitle }}</p>
                @endif
                @if($heroDesc)
                <p class="hero__desc">{{ $heroDesc }}</p>
                @endif
                <div class="hero__actions">
                    @if($ctaText)
                    <a href="{{ $ctaUrl }}" class="btn-accent hero__btn">{{ $ctaText }} <i class="ri-arrow-right-line"></i></a>
                    @endif
                    @if($cta2Text)
                    <a href="{{ $cta2Url }}" class="hero__btn hero__btn--ghost">{{ $cta2Text }}</a>
                    @endif
                </div>
                @if($points)
                <ul class="hero__points">
                    @foreach($points as $point)
                    <li><i class="ri-checkbox-circle-fill"></i> {{ $point }}</li>
                    @endforeach
                </ul>
                @endif
            </div>
            @if($hasVisual)
            <div class="hero__visual">
                @if($imageUrl !== '')
                    <img src="{{ $imageUrl }}" alt="" class="hero__image">
                @else
                    @include('partials.hero-animations.'.$animation, ['domain' => $demoDomain])
                @endif
            </div>
            @endif
        </div>
    </div>
</section>