{% extends 'main_base.html.twig' %}
{% block styles %}{% endblock %}
{% block content %}
    <section class="position-relative" id="banner">
        <img src="{{ asset('assets/main/img/iletisim-banner.png') }}" alt="Banner" class="img-fluid w-100">
        <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">İLETİŞİM MERKEZİ</li>
                </ol>
            </div>
        </div>
    </section>
    <section class="bg-white py-20" id="form">
        <div class="container-90 px-20">
            <div class="row">
                <div class="col-lg-6">
                    <div class="mb-10 row-adres animate__animated" data-animate="animate__fadeInUp">
                        <h5>Merkez / İstanbul</h5>
                        <address>
                            WEIMA Maschinenbau GmbH (Genel Merkez) <br>
                            Bustadt 6-10 74360 Ilsfeld <br>
                            Almanya
                        </address>
                    </div>
                    <div class="mb-10 row-adres animate__animated" data-animate="animate__fadeInUp">
                        <h5>Merkez / İstanbul</h5>
                        <address>
                            WEIMA Maschinenbau GmbH (Genel Merkez) <br>
                            Bustadt 6-10 74360 Ilsfeld <br>
                            Almanya
                        </address>
                    </div>
                    <div class="mb-10 row-adres animate__animated" data-animate="animate__fadeInUp">
                        <h5>Merkez / İstanbul</h5>
                        <address>
                            WEIMA Maschinenbau GmbH (Genel Merkez) <br>
                            Bustadt 6-10 74360 Ilsfeld <br>
                            Almanya
                        </address>
                    </div>
                </div>
                <div class="col-lg-6 animate__animated" data-animate="animate__fadeInRight">
                    <h4 class="mb-10">Lütfen doğrudan bizimle iletişime geçin</h4>
                    <form action="">
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-floating mb-7">
                                    <input type="text" class="form-control rounded-0 bg-transparent border-left-0 border-right-0 border-top-0" id="form_Ad" placeholder="Adınız">
                                    <label class="required" for="form_Ad">Adınız</label>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-floating mb-7">
                                    <input type="text" class="form-control rounded-0 bg-transparent border-left-0 border-right-0 border-top-0" id="form_Soyad" placeholder="Soyadınız">
                                    <label class="required" for="form_Soyad">Soyadınız</label>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-floating mb-7">
                                    <input type="email" class="form-control rounded-0 bg-transparent border-left-0 border-right-0 border-top-0" id="form_Eposta" placeholder="E-Posta">
                                    <label class="required" for="form_Eposta">E-Posta</label>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-floating mb-7">
                                    <input type="text" class="form-control rounded-0 bg-transparent border-left-0 border-right-0 border-top-0" id="form_Telefon" placeholder="Telefon">
                                    <label class="required" for="form_Telefon">Telefon</label>
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="form-floating mb-7">
                                    <textarea class="form-control rounded-0 bg-transparent h-100px" id="form_Mesaj" placeholder="Mesajınız"></textarea>
                                    <label for="form_Mesaj">Mesajınız</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-check form-check-custom form-check-solid">
                            <input class="form-check-input w-30px h-30px rounded-0" type="checkbox" value="" id="form_Confirm">
                            <label class="form-check-label" for="form_Confirm">
                                Verilerimin bu kayıt amacıyla Fonuniq tarafından saklanmasını ve işlenmesini kabul ediyorum. Aksi takdirde, bu
                                web sitesinin veri koruma hükümleri geçerli olacaktır. Fonuniq, verilerimin üçüncü şahıslara verilmemesini sağlar.
                            </label>
                        </div>
                        <div class="text-end">
                            <button type="submit" class="btn btn-success btn-active-dark rounded-0 text-center mt-10">GÖNDER</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
    <section id="yetkiBelgelerimiz">
        <div class="container-80 py-20">
            <div class="row">
                <div class="col-lg-8">
                    <h2>Ekibimiz</h2>
                    <p>Alanında uzman kadromuzu İNCELEMEK 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">Uzman Kadromuz</a>
                </div>
            </div>
        </div>
    </section>
{% endblock %}