.elementor-3323 .elementor-element.elementor-element-3ce970f{--display:flex;}.elementor-3323 .elementor-element.elementor-element-acaa345{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-2401bff */<style>
  .faq-container {
    max-width: 900px;
    margin: auto;
    padding: 2rem;
    font-family: "Segoe UI", Roboto, sans-serif;
  }

  .faq-container h2 {
    font-size: 2rem;
    margin-bottom: 1.5rem;
    text-align: center;
    color: #2c3e50;
  }

  .faq-item {
    border: 1px solid #e0e0e0;
    border-radius: 1rem;
    margin-bottom: 1rem;
    padding: 1.2rem 1.5rem;
    background: #f9f9f9;
    transition: all 0.3s ease-in-out;
  }

  .faq-item:hover {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07);
    background: #ffffff;
  }

  .faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-weight: 600;
    font-size: 1.1rem;
  }

  .faq-question i {
    margin-right: 0.8rem;
    color: #bfa046;
    font-size: 1.3rem;
  }

  .faq-answer {
    margin-top: 0.8rem;
    display: none;
    font-size: 0.95rem;
    line-height: 2.6;
    color: #555;
  }

  .faq-item.active .faq-answer {
    display: block;
  }

  .faq-item.active .toggle-icon {
    transform: rotate(180deg);
  }

  .toggle-icon {
    transition: transform 0.3s ease;
  }
</style>

<div class="faq-container">
  <h2>❓ FAQ – Tout savoir sur notre conciergerie à Cannes</h2>

  <div class="faq-item">
    <div class="faq-question">
      <span><i class="fas fa-user-tie"></i> Qui sommes-nous ?</span>
      <i class="fas fa-chevron-down toggle-icon"></i>
    </div>
    <div class="faq-answer">
      ConciergeCannes est une conciergerie haut de gamme spécialisée dans la location courte durée à Cannes. Nous gérons les biens de A à Z.
    </div>
  </div>

  <div class="faq-item">
    <div class="faq-question">
      <span><i class="fas fa-cogs"></i> Que comprend la gestion complète ?</span>
      <i class="fas fa-chevron-down toggle-icon"></i>
    </div>
    <div class="faq-answer">
      Gestion des annonces, check-in/out, ménage, linge, support voyageurs, optimisation tarifaire et assistance 7j/7. Vous ne vous occupez de rien.
    </div>
  </div>

  <div class="faq-item">
    <div class="faq-question">
      <span><i class="fas fa-bed"></i> Qui paie le ménage ?</span>
      <i class="fas fa-chevron-down toggle-icon"></i>
    </div>
    <div class="faq-answer">
      Les frais de ménage sont facturés aux voyageurs. Le tarif dépend de la superficie du bien et couvre le ménage complet et le réassort.
    </div>
  </div>

  <div class="faq-item">
    <div class="faq-question">
      <span><i class="fas fa-calendar-check"></i> Puis-je suivre les réservations ?</span>
      <i class="fas fa-chevron-down toggle-icon"></i>
    </div>
    <div class="faq-answer">
      Oui, vous avez un accès propriétaire pour suivre le planning, les revenus générés et les réservations à venir en temps réel.
    </div>
  </div>

  <div class="faq-item">
    <div class="faq-question">
      <span><i class="fas fa-file-signature"></i> Est-ce légal de louer à Cannes ?</span>
      <i class="fas fa-chevron-down toggle-icon"></i>
    </div>
    <div class="faq-answer">
      Oui, si le bien est déclaré. Nous vous accompagnons dans l’obtention du numéro d’enregistrement et le respect de la réglementation locale.
    </div>
  </div>

  <div class="faq-item">
    <div class="faq-question">
      <span><i class="fas fa-euro-sign"></i> Quels sont vos frais de gestion ?</span>
      <i class="fas fa-chevron-down toggle-icon"></i>
    </div>
    <div class="faq-answer">
      Nos honoraires varient entre 18 % et 20 % selon la formule choisie. Aucun frais caché. Notre modèle est transparent et basé sur la performance.
    </div>
  </div>
</div>

<script>
  document.querySelectorAll('.faq-question').forEach(item => {
    item.addEventListener('click', () => {
      const faqItem = item.parentElement;
      faqItem.classList.toggle('active');
    });
  });
</script>

<!-- Font Awesome pour les icônes -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" integrity="sha512-yV+YvOkeV+NsVn+yRxSzWjhf27J4t2+pclxymfBdUeC8Y1VaQEBRQ+BTn9Bxv3Vp91efjOy1I0rR+kKDAZrqNQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />/* End custom CSS */