{% extends 'base.html.twig' %}

{% block title %}Patrimoine Roses | À propos{% endblock %}

{% block body %}
    <!--who-we-are-area start-->
    <section class="intro-area pt-5 pb-50">
        <div class="container">
            <div class="row">
                <div class="col-xl-6 col-lg-6 col-md-12">
                    <div class="profesional pl-25 pr-20 mb-30">
                        <div class="section-title text-left mb-25">
                            <span class="left-line mb-15 pl-20">{{ 'association'|trans }}</span>
                            <h2 class="mb-35" style="font-size: 38px;">{{ 'about_association_title'|trans }}</h2>

                            <p class="mb-30">
                                {{ 'about_association_desc'|trans | nl2br }}
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-xl-6 col-lg-6">
                    <div class="intro row align-items-center">
                        <div class="col-md-5">
                            <div class="intro__experience text-center pt-15 pb-25 mb-30 ml-45">
                                <span>12</span>
                                <h5>Ans</h5>
                            </div>
                        </div>
                        <div class="col-md-7">
                            <div class="intro__img mb-30 mr-65">
                                <img class="img-fluid" src="{{ asset('images/about_01.jpg') }}" alt="" style="object-fit: cover; height: 255px; width: 100%;">
                            </div>
                        </div>
                        <div class="col-md-11">
                            <div class="intro__img ml-35 mb-30">
                                <img class="img-fluid" src="{{ asset('images/about_02.jpg') }}" alt="" style="object-fit: cover" width="577" height="280">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="accordion mb-50 mt-50" id="accordionExample">
                <div class="card">
                    <div class="card-header" id="headingOne">
                        <h2 class="mb-0">
                            <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                {{ 'faq_title_1'|trans }}
                            </button>
                        </h2>
                    </div>

                    <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
                        <div class="card-body d-md-flex">
                            <p>
                                {{ 'about_text_01'|trans | nl2br }}
                            </p>
                        </div>
                    </div>
                </div>
                <div class="card">
                    <div class="card-header" id="headingTwo">
                        <h2 class="mb-0">
                            <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
                                {{ 'faq_title_2'|trans }}
                            </button>
                        </h2>
                    </div>

                    <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
                        <div class="card-body d-md-flex">
                            <div class="col-12 col-md-6 pl-md-0 pr-md-4">
                                <p>
                                    {{ 'about_text_02'|trans | nl2br }}
                                </p>
                            </div>
                            <div class="col-12 col-md-6 pr-md-0 pl-md-4">
                                <p>
                                    {{ 'about_text_03'|trans | nl2br }}
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card">
                    <div class="card-header" id="headingThree">
                        <h2 class="mb-0">
                            <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="true" aria-controls="collapseThree">
                                {{ 'faq_title_3'|trans }}
                            </button>
                        </h2>
                    </div>

                    <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
                        <div class="card-body d-md-flex">
                            <p>
                                {{ 'about_text_04'|trans | nl2br }}
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--who-we-are-area start-->


    <!--about-landco start-->
    <section class="about-landco pb-45">
        <div class="container">
            <h2 class="mb-30" style="font-size: 38px;">{{ 'the_history_of_the_asbl'|trans }}</h2>

            <div class="row">
                <div class="col-xl-6 col-lg-6 col-md-12">
                    <div class="about__text mb-30">
                        <p>
                            {{ 'about_text_05'|trans | nl2br }}
                        </p>
                    </div>
                </div>
                <div class="col-xl-6 col-lg-6 col-md-12">
                    <div class="intro__img">
                        <img class="img-fluid" src="{{ asset('images/about_03.jpg') }}" alt="organic" loading="lazy" style="object-fit: cover; max-height: 380px; width: 570px;">
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xl-6 col-lg-6 col-md-12">
                    <div class="intro__img mb-30">
                        <img class="img-fluid" src="{{ asset('images/about_04.jpg') }}" alt="organic" loading="lazy" style="object-fit: cover; max-height: 380px; width: 570px;">
                    </div>
                </div>
                <div class="col-xl-6 col-lg-6 col-md-12">
                    <div class="about__text mb-30">
                        <p>
                            {{ 'about_text_06'|trans | nl2br }}
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--about-landco end-->

    <!--our-team-area start-->
    <section class="our-team-two pos-rel pt-125 pb-100" style="background-image: url({{ asset('images/bg_members.png') }});">
        <div class="container">
            <div class="row">
                <div class="col-xl-6 offset-xl-3">
                    <div class="section-title text-center mb-75">
                        <h2 class="mb-30" style="font-size: 38px;">{{ 'board_of_directors'|trans }}</h2>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams pos-rel text-center mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Nicole Trossen</h6>
                                <p>Présidente</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                            <div class="teams__contents pos-abl">
                                <div class="team__name teams__names text-left">
                                    <h6>Adrienne Lentz</h6>
                                    <p>Vice-Présidente</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Danièle Fonck</h6>
                                <p>Vice-Président</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Patrick Comes</h6>
                                <p>Trésorier</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Guy Müller</h6>
                                <p>Administrateur</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Marc Stein</h6>
                                <p>Administrateur</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Monette Weis</h6>
                                <p>Administrateur</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Laurence Becker</h6>
                                <p>Administrateur</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-3 col-md-6">
                    <div class="teams text-center pos-rel mb-30">
                        <div class="teams__imgs pos-rel mb-30">
                            <img src="{{ asset('images/member.png') }}" alt="">
                        </div>
                        <div class="teams__contents pos-abl">
                            <div class="team__name teams__names text-left">
                                <h6>Elvira Kayser</h6>
                                <p>Administrateur</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--our-team-area end-->

    <section class="blog-area blog-area-two pt-120 pb-100">
        <div class="container">
            <div class="row">
                <div class="col-xl-7 m-auto">
                    <div class="section-title text-center">
                        <span class="left-line mb-15 pl-20">{{ 'contact_and_membership'|trans }}</span>
                        <h2 class="mb-35" style="font-size: 38px;">{{ 'join_the_association'|trans }}</h2>
                        <p class="mb-30">
                            {{ 'join_the_association_text'|trans | nl2br  }}
                        </p>
                        <a href="{{ path('contact') }}" class="theme_btn mt-2">{{ 'join'|trans }}</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="blog-area blog-area-two pt-70 pb-100">
        <div class="container">
            <div class="row">
                <div class="col-xl-7 m-auto">
                    <div class="section-title text-center">
                        <h2 class="mb-35" style="font-size: 38px;">Nos Partenaires</h2>

                        <a href="https://luga.lu/fr" target="_blank" class="theme-color font-weight-bold">LUGA 2025, Luxembourg Urban Garden 2025</a>
                        <br><br>
                        <a href="https://jardinsluxembourg.lu/fr" target="_blank" class="theme-color font-weight-bold">Rendez-vous aux jardins</a><br>
                        Ministère de la Culture
                        <br><br>
                        <a href="https://ctf.lu/fr" target="_blank" class="theme-color font-weight-bold">Gaart an Heem</a>
                        <br><br>
                        <a href="https://worldrose.org" target="_blank" class="theme-color font-weight-bold">World federation or Rose Societies</a>
                        <br><br>
                        <a href="https://luxembourghouse.lu" target="_blank" class="theme-color font-weight-bold">Luxembourg House</a>

                        <a href="https://luxembourghouse.lu" target="_blank"><img src="{{ asset('images/luxembourg_house.png') }}" style="max-width: 100vw"></a><br>
                        <h4>Découvrez l'authenticité luxembourgeoise avec la LuXembourg House !</h4>
                        <p>Nous sommes heureux de pouvoir présenter nos produits dans la LuXembourg House, vitrine
                        du savoir-faire et de l'artisanat luxembourgeois.<br>
                        Rejoignez-nous dans cette aventure gustative et artistique en visitant cette boutique unique.<br>
                        #LuXembourgHouse #ArtisanatLocal #ProduitsLuxembourgeois</p>

                        <br><br>
                        <a href="https://mnhn.lu" target="_blank" class="theme-color font-weight-bold">Musée national d'histoire naturelle - Naturmusée</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

{% endblock %}