@extends('layouts.public')

@section('title', 'About Us - ' . ($settings['site_title'] ?? 'BANKING'))

@section('content')
<section class="public-page-hero">
    <div class="container">
        <h1 class="public-page-title">About Us</h1>
        <p class="public-page-subtitle">Learn more about our mission and values</p>
    </div>
</section>

<section class="public-page-body">
    <div class="container">
        <div class="public-content-card">
            <div class="public-prose">
                {!! $settings['about_content'] ?? '<p>BANKING is a modern, secure digital banking platform built to make everyday banking simple, fast and transparent.</p>' !!}
            </div>

            <div class="public-bank-facts">
                <div class="public-fact">
                    <span class="public-fact-value">{{ $general['bank_name'] ?? 'BANKING' }}</span>
                    <span class="public-fact-label">Our Name</span>
                </div>
                <div class="public-fact">
                    <span class="public-fact-value">2M+</span>
                    <span class="public-fact-label">Happy Customers</span>
                </div>
                <div class="public-fact">
                    <span class="public-fact-value">99.9%</span>
                    <span class="public-fact-label">Uptime</span>
                </div>
                <div class="public-fact">
                    <span class="public-fact-value">24/7</span>
                    <span class="public-fact-label">Support</span>
                </div>
            </div>

            <div class="public-cta-inline">
                <h3>Ready to bank smarter?</h3>
                <p>Open your account today — it takes just minutes.</p>
                <div class="public-cta-actions">
                    <a href="{{ route('register') }}" class="btn btn-primary">Create Free Account</a>
                    <a href="{{ route('pages.contact') }}" class="btn btn-outline">Contact Us</a>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection