// Proof.jsx — depoimentos incorporados
const TESTIMONIALS = [
  { id: "M4clJeavT1o", label: "Janieth Costa" },
  { id: "9SrdNWEO4Jw", label: "Sheila Coelho" },
  { id: "H0s-LDJCLCw", label: "Naiara Reis" },
];

function Proof() {
  return (
    <section className="section proof" id="proof" data-reveal>
      <div className="container">
        <h2 className="h2 center">Quem já fez o caminho.</h2>
        <p className="lead center" style={{maxWidth: 620, margin: "16px auto 48px"}}>
          Alunas contando, com as próprias palavras, o que muda depois do Método Destrava Vida.
        </p>
        <div className="proof-grid">
          {TESTIMONIALS.map((t, index) => (
            <div className="proof-video" key={t.id} data-reveal style={{"--reveal-delay": `${160 + index * 90}ms`}}>
              <div className="vid-frame">
                <iframe
                  src={`https://www.youtube-nocookie.com/embed/${t.id}?rel=0&modestbranding=1`}
                  title={`Depoimento — ${t.label}`}
                  frameBorder="0"
                  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                  allowFullScreen
                ></iframe>
              </div>
              <div className="vid-cap">{t.label}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Proof = Proof;