@extends('layouts.public')
@section('title', 'About | Kenya Diaspora Alliance')
@section('content')
    <section class="py-5 position-relative" style="background: url('{{ asset('assets/img/about/about.jpeg') }}') no-repeat center/cover;">
        <div class="position-absolute top-0 start-0 w-100 h-100" style="background: rgba(0, 0, 0, 0.45);"></div>
        <div class="container py-5 position-relative">
            <div class="row justify-content-center">
                <div class="col-lg-10 text-center text-white">
                    <h1 class="display-5 fw-bold">About KDHC 2026</h1>
                    <p class="lead mb-0">The 13th Annual Kenya Diaspora Homecoming Convention</p>
                </div>
            </div>
        </div>
    </section>

    <section class="section-padding">
        <div class="container">
            <div class="row g-4 align-items-start">
                <div class="col-lg-7">
                    <div class="bg-white p-4 p-md-5 rounded-2 shadow-sm">
                        <h3 class="mb-3">The 13th Annual Kenya Diaspora Homecoming Convention (KDHC 2026)</h3>
                        <ul class="list-unstyled mb-4">
                            <li class="mb-2"><span class="badge bg-warning text-dark me-2">Theme</span> Investments &amp; Innovation for Inclusive Growth and Sustainable Development</li>
                            <li class="mb-2"><span class="badge bg-warning text-dark me-2">Dates</span> December 9–11, 2026</li>
                            <li class="mb-2"><span class="badge bg-warning text-dark me-2">Location</span> Jacaranda Hotel, Westlands, Nairobi (Hybrid)</li>
                        </ul>
                        <p>
                            KDHC is the premier annual platform that connects Kenyan and African diasporas globally with government,
                            private sector, development partners, academia, and civil society. The 2026 convention focuses on investment and innovation, connecting 500+ physical delegates and 1,000+ virtual participants across 60+ countries.
                        </p>

                        <h4 class="mt-4">Background</h4>
                        <p>Hosted by Kenya Diaspora Alliance (KDA), in partnership with African Diaspora Alliance (AfDA), KDHC connects 67+ diaspora organizations. Its 13th edition brings investors, government officials and business leaders together around capital, policy and opportunity.</p>

                        <h4 class="mt-4">Objectives</h4>
                        <ul><li>Connect diaspora investors and businesses through structured networking.</li><br><li>Create space for investment pitches and introductions.</li><br><li>Advance conversations on innovation and sustainable development.</li><br><li>Support women’s economic leadership and youth innovation.</li><br><li>Engage government and diaspora leaders on policy.</li><br></ul>

                        <h4 class="mt-4">Intended Outcomes</h4>
                        <ul><li>Investment connections through the Investment Deal Room.</li><br><li>New partnerships among diaspora business leaders, investors and institutions.</li><br><li>A published Joint Communiqué.</li><br></ul>
                    </div>
                </div>
                <div class="col-lg-5">
                    <div class="bg-white p-4 rounded-2 shadow-sm mb-4">
                        <h5 class="mb-3">Key Focus Areas</h5>
                        <div class="accordion" id="aboutAcc">
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="accOneH">
                                    <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#accOne" aria-expanded="true" aria-controls="accOne">Investment Deal Room</button>
                                </h2>
                                <div id="accOne" class="accordion-collapse collapse show" aria-labelledby="accOneH" data-bs-parent="#aboutAcc">
                                    <div class="accordion-body">
                                        <ul class="mb-0"><li>Investor pitches and introductions to diaspora business leaders.</li></ul>
                                    </div>
                                </div>
                            </div>
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="accTwoH">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accTwo" aria-expanded="false" aria-controls="accTwo">AI, Digital Economy & Blockchain</button>
                                </h2>
                                <div id="accTwo" class="accordion-collapse collapse" aria-labelledby="accTwoH" data-bs-parent="#aboutAcc">
                                    <div class="accordion-body">
                                        <ul class="mb-0"><li>Technology, innovation and investment in the digital economy.</li></ul>
                                    </div>
                                </div>
                            </div>
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="accThreeH">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accThree" aria-expanded="false" aria-controls="accThree">Agri-Business & Food Security</button>
                                </h2>
                                <div id="accThree" class="accordion-collapse collapse" aria-labelledby="accThreeH" data-bs-parent="#aboutAcc">
                                    <div class="accordion-body">
                                        <ul class="mb-0"><li>Agribusiness investment, food security and sustainable development.</li></ul>
                                    </div>
                                </div>
                            </div>
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="accFourH">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accFour" aria-expanded="false" aria-controls="accFour">Banking, FinTechs & SACCOs</button>
                                </h2>
                                <div id="accFour" class="accordion-collapse collapse" aria-labelledby="accFourH" data-bs-parent="#aboutAcc">
                                    <div class="accordion-body">
                                        <ul class="mb-0"><li>Financial services and investment conversations.</li></ul>
                                    </div>
                                </div>
                            </div>
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="accFiveH">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accFive" aria-expanded="false" aria-controls="accFive">Women’s Leadership & Youth Innovation</button>
                                </h2>
                                <div id="accFive" class="accordion-collapse collapse" aria-labelledby="accFiveH" data-bs-parent="#aboutAcc">
                                    <div class="accordion-body">
                                        <ul class="mb-0"><li>Women’s Economic Leadership Forum and Youth Innovation Track.</li></ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="bg-white p-4 rounded-2 shadow-sm mb-4">
                        <h5 class="mb-3">Featured Topics & Sessions</h5>
                        <ul class="mb-0">@foreach(config('convention.sessions') as $session)<li>{{ $session['name'] }}</li><br>@endforeach</ul>
                    </div>

                    <div class="bg-white p-4 rounded-2 shadow-sm">
                        <h5 class="mb-3">Partners & Stakeholders</h5>
                        <p class="mb-3">Diaspora, Government and Regulators, Financial Institutions, Private Sector & Real Estate, Remittance Platforms, Tech & Innovation, Academia & Training, Development Partners, etc.</p>
                        <h5 class="mb-3">Expected Benefits</h5>
                        <ul class="mb-0"><li>Access to 500+ physical delegates and 1,000+ virtual participants.</li><br><li>Connections across 60+ countries and 67+ diaspora organizations.</li><br><li>Investment Deal Room introductions and structured networking.</li><br><li>Opportunities for speaking, exhibition, branding and catalogue advertising.</li><br></ul>
                    </div>
                </div>
            </div>

            <div class="row mt-4">
                <div class="col-lg-12">
                    <div class="border-0 bg-success text-white d-flex flex-column flex-md-row align-items-md-center justify-content-between rounded-2 shadow-sm p-4">
                        <div class="mb-3 mb-md-0">
                            <h5 class="mb-1">Contact</h5>
                            <p class="mb-0">For partnership or participation inquiries:</p>
                        </div>
                        <div class="">
                            <ul class="list-unstyled mb-0">
                                <li>Email: <a class="text-white" href="mailto:info@kdhc.co.ke">info@kdhc.co.ke</a> or <a class="text-white" href="mailto:kdhc@kda.global">kdhc@kda.global</a></li>
                                <li>Website: <a class="text-white" href="https://www.kdhc.co.ke" target="_blank" rel="noopener">www.kdhc.co.ke</a></li>
                                <li>Phone: <a class="text-white" href="tel:+254757903452">+254 757 903 452</a></li>
                            </ul>
                        </div>
                        <div class="mt-3 mt-md-0">
                            <a href="{{ route('contacts') }}" class="btn btn-outline-light">Get in touch</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection