// sections-bottom.jsx — Objections, Guarantee, Urgency, FAQ, FinalCTA, PS, Footer

const OBJECTIONS = [
  {
    quote: "Já tenho advogado.",
    answer: "Ótimo. Mas ele atua de forma preventiva em compliance trabalhista? Elabora GRO e PGR? Conhece os critérios exatos que o auditor do MTE usa na fiscalização da NR-1? Se a resposta for incerta, vale a conversa.",
  },
  {
    quote: "Minha empresa é pequena, não tem risco.",
    answer: "A NR-1 não faz distinção de porte. Uma empresa com 3 colaboradores está sujeita às mesmas obrigações — e à mesma fiscalização — que uma com 300. O que muda é a complexidade do programa, não a obrigação de tê-lo.",
  },
  {
    quote: "Não tem risco no meu setor.",
    answer: "Riscos psicossociais — pressão, sobrecarga, clima organizacional — existem em qualquer ambiente de trabalho. A atualização da NR-1 foi justamente para estender esse olhar a todos os setores, não apenas aos de alto risco físico.",
  },
];

const Objections = () => (
  <section className="section objections reveal">
    <div className="container">
      <div className="objections__header">
        <p className="eyebrow-lg on-dark">Quebra de objeções</p>
        <span className="gold-rule center" style={{ marginTop: 16, background: 'var(--gold-light)' }} />
        <h2 className="display-2" style={{ color: 'var(--off-white)' }}>
          O que costumamos ouvir antes da primeira conversa.
        </h2>
      </div>
      <div className="objections__grid">
        {OBJECTIONS.map((o, i) => (
          <article key={i} className="objection">
            <p className="objection__quote">{o.quote}</p>
            <p className="objection__answer">{o.answer}</p>
          </article>
        ))}
      </div>
    </div>
  </section>
);

const Guarantee = () => (
  <section className="section guarantee reveal">
    <div className="container">
      <div className="guarantee__inner">
        <div className="guarantee__seal">
          <div className="guarantee__seal-ring" />
          <div className="guarantee__seal-ring inner" />
          <div className="guarantee__seal-content">
            <span className="top-text">Garantia De Paiva</span>
            <div className="divider" />
            <div className="big-num">100%</div>
            <span className="sub-text">Contestação<br/>sem custo adicional</span>
          </div>
        </div>
        <div className="guarantee__body">
          <p className="eyebrow-lg on-dark">Nossa garantia</p>
          <h2 className="display-2" style={{ marginTop: 16 }}>
            Não vendemos documentos. Entregamos proteção jurídica real.
          </h2>
          <p style={{ marginTop: 28 }}>
            A De Paiva Advocacia entrega um programa de conformidade que <strong>resiste à fiscalização</strong>.
          </p>
          <p>
            Se durante a vigência da assessoria sua empresa for autuada por item coberto pelo escopo do serviço prestado, <strong>analisamos e contestamos a autuação sem custo adicional</strong>.
          </p>
        </div>
      </div>
    </div>
  </section>
);

const Urgency = () => (
  <section className="section urgency reveal">
    <div className="container">
      <div className="urgency__inner">
        <div className="urgency__date-strip">
          <span className="pulse" />
          <span>Em vigor desde Maio de 2026</span>
        </div>
        <h2 className="display-2">
          O período de “ainda vou me adequar” acabou.
        </h2>
        <p style={{ marginTop: 28 }}>
          As novas exigências da NR-1 estão em vigor desde maio de 2026. A fiscalização do Ministério do Trabalho não opera com calendário de avisos. Opera com o cronograma dela.
        </p>
        <p>
          <strong>Cada semana sem conformidade é uma semana de exposição desnecessária.</strong>
        </p>
        <p>
          E há mais um fator: a De Paiva Advocacia trabalha com atendimento personalizado, com dedicação real a cada cliente. Não abrimos vagas para mais empresas do que conseguimos atender com qualidade. Se você está lendo isso agora, há espaço. Mas isso pode mudar.
        </p>
        <a className="btn-cta" href={WHATSAPP_URL} target="_blank" rel="noopener noreferrer" style={{ marginTop: 16 }}>
          Quero garantir minha vaga
          <span className="arrow"><ArrowIcon size={18} /></span>
        </a>
      </div>
    </div>
  </section>
);

const FAQ_ITEMS = [
  {
    q: "A NR-1 se aplica à minha empresa mesmo sendo do setor de serviços?",
    a: "Sim. A NR-1 é uma norma regulamentadora federal que se aplica a todos os empregadores e trabalhadores com vínculo celetista, independente do setor ou atividade.",
  },
  {
    q: "O que acontece se minha empresa for fiscalizada e não tiver o PGR?",
    a: "A ausência ou inadequação do PGR é motivo de autuação. O valor da multa varia conforme a gravidade e o número de itens em desconformidade — podendo ultrapassar R$ 20.000 em uma única visita.",
  },
  {
    q: "Quanto tempo leva para minha empresa estar adequada?",
    a: "Depende do porte e da situação atual. Na consultoria inicial, fazemos esse diagnóstico e apresentamos o prazo realista para a sua realidade.",
  },
  {
    q: "Meu departamento de RH pode cuidar disso internamente?",
    a: "Pode executar parte do processo, mas o GRO e o PGR precisam de orientação jurídica e técnica para serem válidos na fiscalização. O treinamento que oferecemos capacita seu time para manter a conformidade — mas a elaboração inicial precisa de assessoria especializada.",
  },
  {
    q: "Vocês atendem empresas de qual porte?",
    a: "Atendemos desde microempresas até empresas de médio porte. O escopo e o investimento são definidos conforme a complexidade da operação.",
  },
  {
    q: "Como funciona a consultoria inicial?",
    a: "É uma reunião — presencial ou remota — onde entendemos a situação da sua empresa, identificamos os principais pontos de risco e apresentamos como a assessoria funcionaria no seu caso. Sem compromisso de contratação.",
  },
];

const FAQ = () => {
  const [open, setOpen] = React.useState(0);
  return (
    <section className="section faq reveal">
      <div className="container">
        <div className="faq__header">
          <p className="eyebrow-lg">Perguntas frequentes</p>
          <span className="gold-rule center" style={{ marginTop: 16 }} />
          <h2 className="display-2">Dúvidas que sempre aparecem.</h2>
        </div>
        <div className="faq__list">
          {FAQ_ITEMS.map((it, i) => (
            <div key={i} className={`faq__item ${open === i ? 'open' : ''}`}>
              <button className="faq__q" onClick={() => setOpen(open === i ? -1 : i)} aria-expanded={open === i}>
                <span>{it.q}</span>
                <span className="faq__icon" aria-hidden="true">
                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
                    <line x1="12" y1="5" x2="12" y2="19" />
                    <line x1="5" y1="12" x2="19" y2="12" />
                  </svg>
                </span>
              </button>
              <div className="faq__a">
                <div className="faq__a-inner">{it.a}</div>
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
};

const FinalCTA = () => (
  <section className="section final-cta reveal">
    <div className="final-cta__bg" aria-hidden="true" />
    <div className="final-cta__overlay" aria-hidden="true" />
    <div className="final-cta__inner container">
      <p className="eyebrow-lg on-dark">O próximo passo</p>
      <span className="gold-rule center" style={{ marginTop: 16, background: 'var(--gold-light)' }} />
      <h2 style={{ marginTop: 16 }}>
        Sua empresa está operando <span className="accent">sob risco real agora</span>.
      </h2>
      <p>
        Não porque você fez algo errado — mas porque a norma mudou e adequação não acontece sozinha.
        Entendemos sua operação, mostramos exatamente onde está o risco e o que é necessário para eliminar. Sem pressão. Sem proposta genérica.
      </p>
      <div className="final-cta__buttons">
        <a className="btn-cta btn-cta-lg" href={WHATSAPP_URL} target="_blank" rel="noopener noreferrer">
          <WhatsAppIcon size={18} />
          Agendar minha consultoria agora
          <span className="arrow"><ArrowIcon size={18} /></span>
        </a>
      </div>
      <div className="final-cta__meta">
        <span><span className="bullet" />Sem compromisso</span>
        <span><span className="bullet" />Respondemos em até 24h</span>
        <span><span className="bullet" />Atendimento personalizado</span>
      </div>
    </div>
  </section>
);

const PSection = () => (
  <section className="section-tight ps reveal">
    <div className="container">
      <div className="ps__inner">
        <p className="ps__label">P.S.</p>
        <div className="ps__body">
          <p>
            Daqui a seis meses, você vai estar em um desses dois cenários: <strong>com o programa implementado</strong>, a documentação em ordem e a operação protegida — ou vai estar lidando com uma autuação que custará mais do que o valor da assessoria inteira.
          </p>
          <p>
            A diferença entre os dois cenários é uma decisão tomada hoje.
          </p>
          <a className="btn-cta" href={WHATSAPP_URL} target="_blank" rel="noopener noreferrer">
            Quero proteger minha empresa
            <span className="arrow"><ArrowIcon size={18} /></span>
          </a>
        </div>
      </div>
    </div>
  </section>
);

const Footer = () => (
  <footer className="lp-footer">
    <div className="container lp-footer__inner">
      <a className="lp-footer__logo" href="#top" aria-label="De Paiva Advocacia">
        <img src={LOGO_DARK_SRC} alt="De Paiva Advocacia" />
      </a>
      <div className="lp-footer__meta">
        © {new Date().getFullYear()} De Paiva Advocacia · Direito Empresarial &amp; Trabalhista<br/>
        <a href={WHATSAPP_URL} target="_blank" rel="noopener noreferrer">WhatsApp · +55 41 98784-5964</a>
      </div>
    </div>
  </footer>
);

Object.assign(window, { Objections, Guarantee, Urgency, FAQ, FinalCTA, PSection, Footer });