// Hero.jsx — Pai Bruno LP hero
function Hero() {
  const navItems = [
    { href: "#historia", label: "História" },
    { href: "#mechanism", label: "Método" },
    { href: "#bundle", label: "Pacote" },
    { href: "#proof", label: "Prova" },
    { href: "#offer", label: "Oferta" },
  ];

  return (
    <section className="section hero">
      <div className="smoke" />
      <div className="container">
        <div className="hero-topline" data-reveal>
          <div className="hero-kicker">Método Destrava Vida · Tarot Terapêutico · Magia Aplicada</div>
          <nav className="hero-nav" aria-label="Seções principais">
            {navItems.map((item) => (
              <a key={item.href} href={item.href}>{item.label}</a>
            ))}
          </nav>
        </div>
        <img className="hero-logo" src="../../assets/logo-curso-cropped.png" alt="Curso de Tarot & Magia com Pai Bruno" />
        <h1 className="hero-h1">
          Quem lê carta, dá resposta.<br />
          <em>Quem lê energia, transforma vida.</em>
        </h1>
        <p className="hero-sub">
          Formação em Tarot Terapêutico e Magia Aplicada conduzida pelo <strong><span className="no-break">Método Destrava Vida</span></strong> — o mesmo protocolo que eu uso nos mais de 15 mil atendimentos já realizados no Terreiro São Miguel.
        </p>
        <p className="hero-filter">
          Não é pra você se quer só decorar significado de carta. É pra você se quer parar de dar resposta e começar a conduzir transformação com método.
        </p>
        <div className="vsl-wrap">
          <div className="vsl-frame">
            <iframe
              src="https://www.youtube-nocookie.com/embed/8JIr3XQJ9yQ?rel=0&modestbranding=1"
              title="Vídeo de apresentação — Método Destrava Vida"
              frameBorder="0"
              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
              allowFullScreen
            ></iframe>
          </div>
          <div className="vsl-cap">Assista antes de decidir · 6 min</div>
        </div>
        <a className="btn btn-primary" href="#offer" onClick={(e)=>{e.preventDefault();document.getElementById('offer').scrollIntoView({behavior:'smooth',block:'start'});}}>[ Quero aprender o Método Destrava Vida ]</a>
        <div className="micro">Acesso imediato · 7 dias de garantia · Suporte direto comigo no WhatsApp</div>
      </div>
    </section>
  );
}
window.Hero = Hero;