// Burger Summit 2026 — Manifesto da Nação + Onde & quando
function Manifesto({ onBuy }) {
  return (
    <section className="sec surface-paper mani" id="manifesto">
      <div className="wrap mani-grid">
        <div>
          <span className="eyebrow">A Nação do Hambúrgueiro</span>
          <h2>Entre em campo<br/>com os <span className="accent">gigantes.</span></h2>
          <p>
            O maior movimento de <b>donos de hamburgueria</b> do Brasil. Dois dias de imersão,
            brasa e estratégia pra sua marca jogar em outro nível.
          </p>
          <p>
            <span className="hl">1.000 donos. Os maiores do setor. Uma só Nação.</span>
          </p>
          <div className="mani-cta">
            <a className="bs-btn bs-btn-primary bs-btn-lg" onClick={onBuy}>Fazer minha inscrição agora</a>
          </div>
        </div>
        <div className="frame">
          <div className="ring">
            <img src="assets/photo-crowd-q25.jpg" alt="Nação reunida no Quarteiro Experience" style={{objectPosition:'50% 35%'}} />
          </div>
          <span className="tab">A Nação está formada</span>
          <img className="patch" src="assets/patch-nacao-circular-color.png" alt="" aria-hidden="true" />
        </div>
      </div>
    </section>
  );
}

function Venue({ onBuy }) {
  const q = encodeURIComponent('Centro de Convenções de Pernambuco, Recife PE');
  return (
    <section className="surface-field" id="local">
      <div className="venue-grid">
        <div className="venue-map">
          <span className="pinbadge">
            <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C8 2 5 5 5 9c0 5 7 13 7 13s7-8 7-13c0-4-3-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z"/></svg>
            Como chegar
          </span>
          <iframe title="Mapa do local" loading="lazy" src={`https://maps.google.com/maps?q=${q}&z=14&output=embed`}></iframe>
        </div>
        <div className="venue-info surface-asphalt dot-light">
          <span className="eyebrow" style={{color:'var(--bs-gold)'}}>Onde &amp; quando</span>
          <h3 style={{marginTop:'14px'}}><span className="accent-gold">Centro de Convenções</span><br/>de Pernambuco</h3>
          <p className="addr">Av. Prof. Andrade Bezerra, s/n — Salgadinho, Olinda/Recife · PE, Brasil.</p>
          <div className="venue-days">
            <div className="d">
              <div className="dn">1º dia · 17 Ago</div>
              <div className="dt">07h → 20h</div>
            </div>
            <div className="d">
              <div className="dn">2º dia · 18 Ago</div>
              <div className="dt">07h → 20h</div>
            </div>
          </div>
          <a className="bs-btn bs-btn-primary bs-btn-lg" onClick={onBuy}>Garantir minha inscrição</a>
          <p className="venue-note">* Programação sujeita a pequenas alterações nos horários.</p>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Manifesto, Venue });