@props([
    'settings',
])

@php
    $summary = $settings->about_summary ?: 'Assessoria para eventos em que cada escolha precisa fazer sentido para quem celebra e para quem recebe.';
    $principles = filled($settings->principles) ? $settings->principles : \App\Models\SiteSetting::defaultPrinciples();
@endphp

<section aria-labelledby="positioning-heading" class="border-b border-amare-border py-20" data-chapter="positioning">
    <div class="container-amare grid gap-10 md:grid-cols-[minmax(0,0.8fr)_minmax(0,1.2fr)]">
        <div class="space-y-3" data-reveal>
            <p class="text-sm font-medium uppercase tracking-[0.18em] text-amare-accent">A Amare</p>
            <h2 id="positioning-heading" class="text-3xl font-medium text-amare-text">Presença que organiza o essencial.</h2>
        </div>
        <div class="space-y-8" data-reveal>
            <p class="max-w-2xl text-xl leading-relaxed text-amare-text">{{ $summary }}</p>
            <ul class="grid gap-3 border-t border-amare-border">
                @foreach ($principles as $principle)
                    <li class="border-b border-amare-border py-3 text-amare-text-muted">{{ $principle }}</li>
                @endforeach
            </ul>
            <p>
                <a href="{{ route('about') }}" class="border-b border-amare-accent pb-1 text-sm font-semibold text-amare-accent transition-colors hover:text-amare-accent-deep">
                    Conhecer a Amare
                </a>
            </p>
        </div>
    </div>
</section>