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

{% block title %}Ateliers{% endblock %}

{% block body %}
    <section class="page-title-section bg-img cover-background" data-overlay-dark="7"
             data-background="{{ asset('img/atelier/atelier.jpg') }}"
             style="background-image: url({{ asset('img/atelier/atelier.jpg') }});">

        <div class="container lg-container">

            <div class="row">
                <div class="col-md-12">
                    <h1>Ateliers thématiques</h1>
                </div>
                <div class="col-md-12">
                    <ul>
                        <li><a href="{{ path('index') }}">{{ constant('App\\Constants\\Constants::NAME') }}</a></li>
                    </ul>
                </div>
            </div>

        </div>
    </section>

    <!-- start blog section -->
    <section class="no-padding-bottom">
        <div class="container lg-container">

            <div class="text-center margin-40px-bottom">
                <h3 class="font-weight-900 font-size50 xs-font-size40 xs-margin-10px-bottom">Pourquoi ?</h3>
                <p class="width-50 sm-width-70 xs-width-80 mobile-width-100 center-col">
                    {{ constant('App\\Constants\\Constants::NAME_AU') }}, nous proposons des ateliers pratiques et
                    conviviaux pour accompagner les familles dans différentes situations du quotidien avec leur
                    chien.</p>
            </div>
    </section>
    <!-- end blog section -->

    <!-- start services section -->
    <section>
        <div class="container lg-container">
            <div class="text-center margin-40px-bottom">
                <h3 class="font-weight-900 font-size50 xs-font-size40 xs-margin-10px-bottom">Comment ?</h3>
            </div>
            <div class="row">
                <div class="row align-items-center">
                    <div class="col-lg-6">
                        <h4 class="font-weight-800 font-size36 md-font-size34 xs-font-size30 margin-5px-bottom">En
                            petits groupes</h4>
                        <p class="font-size18 text-secondary-color">Nous abordons des thèmes concrets comme :</p>
                        <ul class="list-style3 margin-30px-bottom">
                            <li>Accueillir un bébé avec un chien.</li>
                            <li>Intégrer un chiot ou un chien dans une famille avec enfants.</li>
                            <li>Faciliter la cohabitation entre chien et chat .</li>
                            <li>… et bien d’autres sujets de la vie quotidienne.</li>
                        </ul>
                        <p>
                            Ces ateliers sont animés par Aurélie Fourgeaud (Osmoze Animale), éducatrice spécialisée, qui
                            partage conseils, astuces et outils pour renforcer la complicité et la sérénité au sein du
                            foyer.
                        </p>
                    </div>
                    <div class="col-lg-6 sm-margin-30px-bottom">
                        <div class="padding-50px-right sm-no-padding-right sm-text-center">
                            <img src="{{ asset('img/atelier/groupes.jpg') }}" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="bg-img cover-background padding-100px-tb" data-overlay-dark="0"
             data-background="{{ asset('img/atelier/decouvrir.jpg') }}">
        <div class="container lg-container">
            <div class="row">
                <div class="col-lg-7">
                    <div class="bg-light-gray padding-60px-lr padding-70px-tb xs-padding-40px-all border-radius-5 mobile-text-center owl-theme owl-carousel"
                         id="testmonials-carousel">
                        <div class="row align-items-center">
                            <div class="col-sm-3 mobile-margin-25px-bottom">
                                <img src="{{ asset('img/atelier/decouvrir-2.jpg') }}" class="border-radius-50" alt=""/>
                            </div>
                            <div class="col-sm-9">
                                <h4>A découvrir</h4>
                                <p>Découvrez nos prochains ateliers et leurs dates sur nos
                                    réseaux sociaux : Facebook et Instagram.</p>
                                <p class="no-margin-bottom font-size20 text-center">
                                    <a class="theme" href="{{ constant('App\\Constants\\Constants::SOCIALS')['facebook'] }}"
                                       target="_blank"><i class="fab fa-facebook-f"></i></a>
                                    <a class="theme" href="{{ constant('App\\Constants\\Constants::SOCIALS')['instagram'] }}"
                                       target="_blank"><i class="fab fa-instagram"></i></a>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section>
        <div class="container lg-container">
            <div class="row">
                <div class="col-lg-6 sm-margin-40px-bottom">
                    <div class="padding-50px-right sm-no-padding-right">
                        <h4 class="font-weight-800 margin-40px-bottom sm-margin-25px-bottom font-size46 sm-font-size42 xs-font-size30">
                            Ateliers PECCRAM</h4>
                        <img src="{{ asset('img/atelier/peccram.jpg') }}" class="border-radius-5" alt="">
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="accordion" id="accordionExample">
                        <div class="accordion-item card">
                            <h2 class="accordion-header card-header" id="headingOne">
                                <button class="accordion-button btn btn-link mb-0 text-dark" type="button"
                                        data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true"
                                        aria-controls="collapseOne">
                                    C'est quoi ?
                                </button>
                            </h2>
                            <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne"
                                 data-bs-parent="#accordionExample">
                                <div class="accordion-body">
                                    {{ constant('App\\Constants\\Constants::NAME') }} propose également le programme
                                    PECCRAM (Programme d’Éducation à la Connaissance du Chien et au Risque d’Accident
                                    par Morsure), destiné aux enfants.
                                </div>
                            </div>
                        </div>
                        <div class="accordion-item card">
                            <h2 class="accordion-header card-header" id="headingTwo">
                                <button class="accordion-button collapsed btn btn-link mb-0 text-dark" type="button"
                                        data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false"
                                        aria-controls="collapseTwo">
                                    Quel est l'objectif ?
                                </button>
                            </h2>
                            <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo"
                                 data-bs-parent="#accordionExample">
                                <div class="accordion-body">
                                    L’objectif : leur apprendre à mieux comprendre le
                                    langage canin, adopter les bons comportements et interagir en toute sécurité avec
                                    les chiens. Ces ateliers ludiques et pédagogiques contribuent à développer le
                                    respect, la prévention et la confiance entre enfants et animaux.
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="bg-theme bg-img theme-overlay" data-overlay-dark="93" data-background="img/bg/pattern.png"
             style="background-image: url(&quot;img/bg/pattern.png&quot;);">
        <div class="container">
            <div class="text-center">
                <p class="text-white font-size20 sm-font-size18 xs-font-size16 margin-30px-bottom sm-margin-20px-bottom xs-margin-10px-bottom line-height-35 xs-line-height-30 width-75 sm-width-100 center-col">
                    L’objectif commun de tous nos ateliers : vous donner les clés pour vivre en harmonie avec votre
                    chien, dans le respect et la compréhension mutuelle 🌿.
                </p>
            </div>
        </div>
    </section>

    <!-- start contact section -->
    <section class="no-padding">
        <div class="row fw-row">
            <div class="v-gmap-widget fullscreen-map col-sm-12">
                <div class="v-wrapper">
                    <!-- Full Width -->
                    <gmp-map center="44.8575603882538, -0.4291596111113203" zoom="14" map-id="MAP">
                        <gmp-advanced-marker position="44.8575603882538, -0.4291596111113203" title="{{ constant('App\\Constants\\Constants::NAME') }}"></gmp-advanced-marker>
                    </gmp-map>
                </div>
            </div>
        </div>
    </section>
    <!-- end contact sectioon -->

{% endblock %}

{% block javascripts %}
    <script type="text/javascript">
        jQuery(document).ready(function () {
        })
    </script>
{% endblock %}