{% extends 'main_base.html.twig' %}
{% block styles %}{% endblock %}
{% block content %}
    <section class="position-relative" id="banner">
        <img src="{{ asset('assets/main/img/banner-kurumsal.png') }}" alt="Banner" class="img-fluid">
        <div class="position-absolute start-0 bottom-0 w-100">
            <div class="container-90 px-20">
                <ol class="breadcrumb pb-2">
                    <li class="breadcrumb-item"><a href="#" class="text-white">ANASAYFA</a></li>
                    <li class="breadcrumb-item text-dark">SIKÇA SORULAN SORULAR</li>
                </ol>
            </div>
        </div>
    </section>
    <section class="py-20" id="filter">
        <div class="container-80">
            <div class="card shadow-sm">
                <div class="card-header align-items-center">
                    <div class="d-flex align-items-center">
                        <label class="me-5 fw-bolder" for="filterSector">FİLTRELE</label>
                        <select class="form-select border-success rounded-pill" id="filterSector">
                            <option value="">Konuları Sırala</option>
                        </select>
                    </div>
                    <div class="d-flex align-items-center p-1 bg-gray-200 rounded-pill">
                        <button class="w-150px form-control form-control-transparent rounded-pill bg-white">Genel</button>
                        <button class="w-150px form-control form-control-transparent rounded-pill">Girişimci</button>
                        <button class="w-150px form-control form-control-transparent rounded-pill">Yatırımcı</button>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section id="sss">
        <div class="container-80">
            <div class="row align-items-center">
                <div class="col-lg-4 animate__animated" data-animate="animate__fadeInLeft">
                    <img src="{{ asset('assets/main/img/kurumsal.png') }}" alt="" class="img-fluid">
                </div>
                <div class="col-lg-6 animate__animated" data-animate="animate__fadeInRight">
                    <p class="fs-3">
                        Aşağıdaki Yönetim Kurulu’nun oluşumu, üyelerin FONUNIQ’deki görev yapıları
                        Yönetim Kurulu’na ilk seçildikleri yıl hakkında bilgiler yer almaktadır.
                    </p>
                    <p class="fs-3">
                        Ayrıca, mesleki kariyer ve eğitim, doğum yılı, önemli şirketlerdeki, kuruluşlardaki
                        ve vakıflardaki yetkiler, önemli çıkar gruplarındaki kalıcı işlevler ve resmi işlevler
                        gibi diğer faaliyetler ve ilgi alanları hakkında bilgiler içerir.
                    </p>
                </div>
            </div>
        </div>
    </section>

    <section class="py-20 bg-white mt-20" id="dokumanlar">
        <div class="container-80">
            <h5 class="mb-10">DÖKÜMANLAR HAKKINDA</h5>
            <div class="row">
                <div class="col-lg-10">
                    <div class="row">
                        {% for i in 1..9 %}
                            <div class="col-lg-4 animate__animated" data-animate="animate__fadeInUp">
                                <div class="d-flex align-items-start mb-10">
                                    <span class="py-7 px-2 bg-success fw-bolder text-white">SWOT</span>
                                    <div class="px-5">
                                        <h5>SWOT DÖKÜMANLARIN ÖNEMİ</h5>
                                        <p>
                                            Bu alana hazırladığınız; Swot Analizi, İş Planı ve Ya tırımcı Sunumu
                                            dokümanlarını eklemelisiniz. Yardıma ihtiyacınız varsa Swot analizi için, İş
                                            Planı için <a href="">burayı</a> ve Yatırımcı Sunumu için <a href="">burayı</a>
                                            tıklayarak yardım alabilirsiniz.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        {% endfor %}
                    </div>
                </div>
                <div class="col-lg-2 animate__animated" data-animate="animate__fadeInLeft">
                    <div class="card bg-success bg-hover-dark text-dark text-hover-light">
                        <div class="card-body py-20">
                            <h5 class="fw-normal text-white">FONUNIQ</h5>
                            <p class="fs-3">
                                Bize ulaşmak için e-posta adresimizi kullanabilirsiniz. Mesajınıza en geç 1 iş günü
                                içerisinde dönüş sağlıyoruz.
                                <a href="" class="d-block mt-5 text-white">destek@fonuniq.com</a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section id="yetkiBelgelerimiz">
        <div class="container-80 py-20">
            <div class="row">
                <div class="col-lg-8">
                    <h2>Sertifika ve Belgeler</h2>
                    <p>Sistemimize ait yetki belgeleri ve uzmanlık alanlarımızı görmek istermisiniz ?</p>
                </div>
                <div class="col-lg-4 text-end">
                    <a href="" class="btn btn-lg btn-bg-dark btn-active-success btn-text-success btn-active-text-dark rounded-pill">Yetki Belgelerimiz</a>
                </div>
            </div>
        </div>
    </section>
{% endblock %}