// Tools.jsx — Free tools lead-magnet section
function Tools() {
  const tools = [
    {
      href: 'https://cnpj.rostcontadores.com.br',
      label: 'Consulta CNPJ',
      lede: 'Consulte situação cadastral, atividade principal, quadro societário e regime tributário de qualquer empresa em segundos.',
      cta: 'Consultar um CNPJ',
      icon: <path d="M11 4a7 7 0 1 0 4.2 12.6l4.1 4.1a1 1 0 0 0 1.4-1.4l-4.1-4.1A7 7 0 0 0 11 4zm0 2a5 5 0 1 1 0 10 5 5 0 0 1 0-10z"/>
    },
    {
      href: 'https://simulador.rostcontadores.com.br',
      label: 'Simulador da Reforma',
      lede: 'Descubra o impacto da reforma tributária no seu negócio: compare a carga atual com o modelo de IBS e CBS.',
      cta: 'Simular meu cenário',
      icon: <path d="M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm2 4v3h10V7H7zm0 5v2h3v-2H7zm5 0v2h3v-2h-3zm-5 4v2h3v-2H7zm5 0v2h3v-2h-3z"/>
    }
  ];
  return (
    <section className="rs-section rs-tools-section" id="ferramentas">
      <div className="rs-container">
        <header className="rs-section-head">
          <span className="rs-eyebrow">Ferramentas gratuitas</span>
          <h2 className="rs-section-title">Use agora, sem cadastro.</h2>
        </header>
        <div className="rs-tools-grid">
          {tools.map(t => (
            <a key={t.href} className="rs-tool-card" href={t.href} target="_blank" rel="noopener noreferrer">
              <span className="rs-tool-icon"><svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">{t.icon}</svg></span>
              <h3 className="rs-tool-title">{t.label}</h3>
              <p className="rs-tool-lede">{t.lede}</p>
              <span className="rs-tool-cta">{t.cta}<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3 8h9M8.5 4.5 12 8l-3.5 3.5" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round"/></svg></span>
            </a>
          ))}
        </div>
      </div>
    </section>
  );
}

window.Tools = Tools;