@extends('layouts.site')

@section('meta_title')
    {{ __('site.nav_about') }} — {{ $brand }}
@endsection

@section('title', __('site.nav_about'))

@section('content')
    <div class="site-container space-y-8 pb-12 pt-6" data-reveal="page">
        <header class="max-w-3xl space-y-3" data-reveal="soft">
            <p class="text-sm font-semibold text-brand-accent">{{ $brand }}</p>
            <h1 class="text-3xl font-bold tracking-tight text-brand-navy">{{ __('site.nav_about') }}</h1>
            @if ($tagline)
                <p class="text-lg text-brand-muted">{{ $tagline }}</p>
            @endif
        </header>

        <section class="max-w-3xl" data-reveal="soft">
            <p class="text-base leading-8 text-brand-muted whitespace-pre-line">{{ __('site.about_fallback', ['brand' => $brand]) }}</p>
        </section>

        <div data-reveal="soft">
            <a href="{{ route('site.contact', ['locale' => app()->getLocale()]) }}" class="inline-flex items-center gap-2 rounded-xl bg-brand-accent px-5 py-3 text-sm font-semibold text-white">
                {{ __('site.nav_contact') }}
            </a>
        </div>
    </div>
@endsection