{% extends 'App::layout_home.html.twig' %}

{% block title %}Cours particuliers à proximité {% if (location.city ?? location.name)|first|lower in ['a','e','i','o','u','h','é', 'è', 'ê', 'ë'] %}d'{% else %}de {% endif %}{{ location.city ?? location.name }} avec des professeurs qualifiés{% endblock %}

{% block og_title %}Cours particuliers à proximité {% if (location.city ?? location.name)|first|lower in ['a','e','i','o','u','h','é', 'è', 'ê', 'ë'] %}d'{% else %}de {% endif %}{{ location.city ?? location.name }} avec des professeurs qualifiés{% endblock %}

{% block description %}Recherchez les meilleurs Cours particuliers à proximité {% if (location.city ?? location.name)|first|lower in ['a','e','i','o','u','h','é', 'è', 'ê', 'ë'] %}d'{% else %}de {% endif %}{{ location.city ?? location.name }} avec des professeurs qualifiés{% endblock %}

{% block og_description %}Recherchez les meilleurs Cours particuliers à proximité {% if (location.city ?? location.name)|first|lower in ['a','e','i','o','u','h','é', 'è', 'ê', 'ë'] %}d'{% else %}de {% endif %}{{ location.city ?? location.name }} avec des professeurs qualifiés{% endblock %}

{% block og_url %}https://www.rueduprof.com/cours-particuliers/{{ location.citySlug }}{% endblock %}

{% block subtitle 'Homepage' %}

{% block canonical %}https://www.rueduprof.com/cours-particuliers/{{ location.citySlug }}{% endblock %}

{% block snippet_json_breadcrumb %}
{% endblock %}

{% block snippet_json %}

{% if location.slug == 'en-ligne' %}

    {% include 'App::schema/cours_particuliers_online.html.twig' with {
        categoryArray: categoryArray,
        tutors: tutors,
        seo: seo
    } only %}

{% else %}
    {% include 'App::schema/cours_particuliers_city.html.twig' with {
        arrLocs: arrLocs,
        tutors: tutors,
        location: location,
        seo: seo
    } only %}
{% endif %}

{% endblock %}

{% block stylesheet %}
<style>
.section-title-dark {
  color: white;
}
</style>
{% endblock %}

{% block fos_user_content %}

<!-- Hero -->
<section class="hero text-center">
<div class="container">
<h1>Cours particuliers {% if location.slug == 'en-ligne' %}{% else %}à proximité {% if (location.city ?? location.name)|first|lower in ['a','e','i','o','u','h','é', 'è', 'ê', 'ë'] %}d'{% else %}de {% endif %}{% endif %}{{ location.city ?? location.name }} avec des professeurs qualifiés</h1>
<p class="mt-3">RueduProf vous met en relation avec des professeurs expérimentés pour des cours particuliers personnalisés à proximité {% if (location.city ?? location.name)|first|lower in ['a','e','i','o','u','h','é', 'è', 'ê', 'ë'] %}d'{% else %}de {% endif %}{{ location.city ?? location.name }}, du primaire aux études supérieures.</p>
<div class="mt-4">
<a href="/register/" class="btn btn-gradient btn-lg">Commencer maintenant</a>
</div>
</div>
</section>



       
    <div class="container-fluid simple-background-skill-search">
        <div class="container">
            <div class="row">
                <div class="col-md-12 p-15" style="padding-top:15px;padding-bottom:0px;">
                    {{ render(controller('App:Search:search', {'form': form_search})) }}
                </div>
            </div>
        </div>
        <svg class="hero-crop" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 48">
            <path fill="#f4f4f4" fill-rule="evenodd" d="M0 0c194.22 23.31 345.236 37.383 453.045 42.218C539.007 46.073 627.992 48 720 48c265.097 0 505.097-16 720-48v48H0V0z"/>
        </svg>
    </div>

    {% if location.slug == 'en-ligne' %}
        {% include 'App::Home/listing_online.html.twig' with {
            tutors: tutors,
            location: location
        } only %}
    {% else %}
        {% include 'App::Home/listing_location.html.twig' with {
            tutors: tutors,
            location: location
        } only %}
    {% endif %}

<!-- Features -->
<section class="py-5">
<div class="container">
<h2 class="section-title text-center">{{ location.city ?? location.name }} : Cours particuliers efficaces et adaptés à chaque élève</h2>
<div class="row g-4">
<div class="col-md-4">
<div class="card p-4 h-100">
<div class="icon-circle">🎓</div>
<h5>Professeurs qualifiés et expérimentés</h5>
<p>Tous nos professeurs particuliers sont sélectionnés pour leur niveau académique, leur expérience pédagogique et leur capacité à s’adapter à chaque élève.</p>
</div>
</div>
<div class="col-md-4">
<div class="card p-4 h-100">
<div class="icon-circle">📚</div>
<h5>Cours particuliers personnalisés</h5>
<p>Chaque cours est conçu selon le niveau, les objectifs et le rythme de l’élève afin de garantir une progression rapide et durable.</p>
</div>
</div>
<div class="col-md-4">
<div class="card p-4 h-100">
<div class="icon-circle">💻</div>
<h5>Cours en ligne ou à domicile</h5>
<p>Choisissez entre des cours particuliers à domicile ou des cours en ligne interactifs, accessibles partout en France.</p>

</div>
</div>
</div>
</div>
</section>

<!-- Explorer les catégories -->
<section class="container py-5 categories-explorer">
  <h2 class="text-center fw-bold mb-5 ai-title">Explorer les catégories à <strong>{{ location.city ?? location.name }}</strong></h2>

  <div class="row g-4">
    {% for arrLoc in arrLocs %}
    <div class="col-md-4">
      <div class="category-card">
        <div class="icon">
          <i class="bi bi-cpu"></i>
        </div>
        <p>
        {% if arrLoc.type == 'formations' %}

          <a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_formations_show', {'slug': arrLoc.categorySlug, 'location': arrLoc.locationSlug }) }}" class="category-link">
            <span class="badge">{{ arrLoc.count }}</span>
            Formations <b>{{ arrLoc.categoryName }}</b> à <b>{{ arrLoc.cityName ?? arrLoc.locationName }}</b>
          </a>
        {% else %}
          <a href="{{ app.request.schemeAndHttpHost ~ path('app_category_show', { 'slug': arrLoc.categorySlug, 'location': arrLoc.locationSlug }) }}" class="category-link">
            <span class="badge">{{ arrLoc.count }}</span>
            Cours particuliers <b>{{ arrLoc.categoryName }}</b> à <b>{{ arrLoc.cityName ?? arrLoc.locationName }}</b>
          </a>
        {% endif %}
        </p>
      </div>
    </div>
    {% endfor %}
  </div>
</section>



<!-- Mobile Apps -->
<section class="py-5" style="background: linear-gradient(135deg, #0f172a, #020617); color: white;">
<div class="container">
  <div class="row align-items-center g-4">
    <div class="col-lg-12">
      <h2 class="section-title-dark">Apprenez partout avec l’application RueduProf</h2>
      <p class="mb-4" style="opacity:0.9;">Accédez à vos cours particuliers, échangez avec votre professeur et progressez où que vous soyez grâce à notre application mobile.</p>
      <div class="d-flex flex-wrap gap-3">
      <a href="https://itunes.apple.com/us/app/rueduprof-annonces-cours-particuliers/id1152373161?l=fr&ls=1&mt=8" class="d-inline-block">
      <img src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg" alt="Télécharger sur l’App Store" height="54">
      </a>
      <a href="https://play.google.com/store/apps/details?id=com.ionicframework.myapp841929&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1" class="d-inline-block">
      <img src="https://upload.wikimedia.org/wikipedia/commons/7/78/Google_Play_Store_badge_EN.svg" alt="Disponible sur Google Play" height="54">
      </a>
      </div>
    </div>

  </div>
</div>
</section>



<!-- CTA -->
<section class="py-5 bg-white">
<div class="container text-center">
<h2 class="section-title">Trouvez rapidement un professeur particulier</h2>
<p class="mb-4">Indiquez votre niveau, votre matière et vos disponibilités pour être mis en relation avec le professeur idéal.</p>
<a href="/register/" class="btn btn-gradient btn-lg">Trouver mon professeur</a>
</div>
</section>

{% endblock fos_user_content %}

{% block javascripts %}
  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDgIqxWbmTk2jHfOaNYEXC73GsWjal1Osw&signed_in=true&libraries=places&callback=initAutocomplete"></script>  
  <script type="text/javascript">
    jQuery(document).ready(function() {
      jQuery(".timeago").timeago();
    });
  </script>
{% endblock %}