function Testimonials() {
  const items = [
    {
      quote: "En 3 semaines, j'ai signé 2 mandats exclusifs grâce à des leads que je n'aurais jamais trouvés sur les portails. L'IA fait le tri, je gère juste les rendez-vous.",
      name: 'Marc Delacroix',
      role: 'Courtier indépendant · Genève',
    },
    {
      quote: "Mon agenda se remplit tout seul. Je reçois uniquement des acheteurs pré-qualifiés, souvent des investisseurs étrangers. Le ROI est là en moins d'un mois.",
      name: 'Sophie Rüegg',
      role: 'Directrice d\'agence · Zurich',
    },
    {
      quote: "J'étais sceptique sur l'IA. Après 14 jours, je ne reviendrai plus en arrière. Mes équipes passent 80% de temps en moins sur la prospection.",
      name: 'Laurent Meier',
      role: 'Co-fondateur · Lausanne Properties',
    },
  ];

  const logos = [
    'CUISINISTES', 'RÉNOVATIONS IMMOBILIÈRES', "ARCHITECTES / DÉCORATEURS D'INTÉRIEURS",
    'PAYSAGISTES', 'PISCINISTES', 'ÉLECTRICIENS & PLOMBIERS',
  ];

  return (
    <section className="section" data-screen-label="06 Témoignages">
      <div className="reveal">
        <div className="eyebrow"><span className="num">/04</span><span className="bar"></span>Ils nous font confiance</div>
        <h2 className="section-title">Des courtiers qui ne reviendraient <span className="italic">jamais</span> en arrière.</h2>
      </div>

      <div className="testimonials">
        {items.map((t, i) => (
          <div key={i} className="testimonial-card reveal" style={{transitionDelay:`${i*100}ms`}}>
            <svg className="quote-mark" width="32" height="24" viewBox="0 0 32 24" fill="none">
              <path d="M0 24V14C0 6 4 1 12 0V5C8 6 6 9 6 14H12V24H0ZM20 24V14C20 6 24 1 32 0V5C28 6 26 9 26 14H32V24H20Z" fill="var(--accent)" fillOpacity="0.4"/>
            </svg>
            <p className="testimonial-quote">{t.quote}</p>
            <div className="testimonial-author">
              <div className="testimonial-avatar">{t.name.split(' ').map(n=>n[0]).join('')}</div>
              <div>
                <div className="testimonial-name">{t.name}</div>
                <div className="testimonial-role">{t.role}</div>
              </div>
            </div>
          </div>
        ))}
      </div>

      <div className="logos-strip reveal">
        <div className="logos-label">Déployé dans tous les métiers du bâtiment et de l'habitat</div>
        <div className="logos-track">
          {logos.concat(logos).map((l, i) => (
            <span key={i} className="logo-item">{l}</span>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Testimonials = Testimonials;
