{{-- About Team — Who We Are / Company Identity Section --}}
<x-atoms.section-wrapper>
    <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-16 items-center">
        {{-- Left: Text content --}}
        <div>
            <x-atoms.subject>{{ __('about.team.who_we_are.subject') }}</x-atoms.subject>
            <h2 class="w-fit text-3xl md:text-4xl lg:text-5xl font-regular text-foreground mb-8 leading-[--gold] text-pretty">
                {{ __('about.team.who_we_are.title') }}
            </h2>
            @foreach(__('about.team.who_we_are.descriptions') as $paragraph)
            <p class="text-foreground max-w-[600px] leading-[--gold] lg:text-xl mb-4">
                {{ $paragraph }}
            </p>
            @endforeach
        </div>

        {{-- Right: Image --}}
        <div class="relative overflow-hidden rounded-lg">
            <img
                src="{{ asset('images/our_team.webp') }}"
                alt="{{ __('about.team.who_we_are.title') }}"
                class="w-full h-full object-cover rounded-lg"
                loading="lazy">
        </div>
    </div>
</x-atoms.section-wrapper>