/* ========== Shared ========== */
const WA_LINK = "https://wa.me/5519983447071?text=Ol%C3%A1!%20Gostaria%20de%20fazer%20a%20consulta%20amorosa.";
const WA_DISPLAY = "(19) 98344-7071";

const WhatsIcon = ({ className }) => (
  <svg className={className} viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
    <path d="M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.148-.669-1.611-.916-2.206-.242-.579-.487-.501-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.709.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413z"/>
  </svg>
);

const ArrowRight = () => (
  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" aria-hidden="true">
    <path d="M5 12h14M13 6l6 6-6 6"/>
  </svg>
);

const ArrowLeft = () => (
  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" aria-hidden="true">
    <path d="M19 12H5M11 6l-6 6 6 6"/>
  </svg>
);

const Star = () => (
  <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
);

/* Oxum mark — original geometric symbol: a sun with a teardrop (river/water) */
const OxumMark = ({ size = 24, className }) => (
  <svg className={className} width={size} height={size} viewBox="0 0 48 48" fill="none" stroke="currentColor" strokeWidth="1" aria-hidden="true">
    <circle cx="24" cy="24" r="10" />
    <g strokeLinecap="round">
      <line x1="24" y1="4" x2="24" y2="10" />
      <line x1="24" y1="38" x2="24" y2="44" />
      <line x1="4" y1="24" x2="10" y2="24" />
      <line x1="38" y1="24" x2="44" y2="24" />
      <line x1="10" y1="10" x2="14" y2="14" />
      <line x1="34" y1="34" x2="38" y2="38" />
      <line x1="10" y1="38" x2="14" y2="34" />
      <line x1="34" y1="14" x2="38" y2="10" />
    </g>
    <path d="M24 18 C 20 22, 20 26, 24 28 C 28 26, 28 22, 24 18 Z" fill="currentColor" opacity="0.5" />
  </svg>
);

/* Tarot card logo — rounded card outline with mystical center: star + crescent */
const TarotCard = ({ size = 22, className }) => (
  <svg className={className} width={size} height={size * 1.5} viewBox="0 0 28 42" fill="none" stroke="currentColor" strokeWidth="1.2" aria-hidden="true">
    <rect x="2" y="2" width="24" height="38" rx="2.5" />
    <rect x="4.5" y="4.5" width="19" height="33" rx="1.5" opacity="0.45" />
    {/* eight-point star */}
    <g transform="translate(14 18)" strokeLinecap="round">
      <line x1="0" y1="-7" x2="0" y2="7" />
      <line x1="-7" y1="0" x2="7" y2="0" />
      <line x1="-5" y1="-5" x2="5" y2="5" />
      <line x1="-5" y1="5" x2="5" y2="-5" />
    </g>
    <circle cx="14" cy="18" r="2" fill="currentColor" />
    {/* crescent below */}
    <path d="M10 30 A 4 4 0 0 0 18 30 A 3 3 0 0 1 10 30 Z" fill="currentColor" opacity="0.85" />
  </svg>
);

const Diamond = ({ size = 16 }) => (
  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1" aria-hidden="true">
    <path d="M8 1L15 8L8 15L1 8Z" />
  </svg>
);

const waLink = (text) => {
  const t = text || "Olá! Gostaria de fazer a consulta amorosa.";
  return `https://wa.me/5519983447071?text=${encodeURIComponent(t)}`;
};

/* ========== Reveal hook ========== */
function useReveal() {
  React.useEffect(() => {
    const els = document.querySelectorAll(".reveal");
    const io = new IntersectionObserver(
      (entries) => {
        entries.forEach((e) => {
          if (e.isIntersecting) {
            e.target.classList.add("in");
            io.unobserve(e.target);
          }
        });
      },
      { threshold: 0.12 }
    );
    els.forEach((el) => io.observe(el));
    return () => io.disconnect();
  }, []);
}

/* ========== Topbar ========== */
function Topbar() {
  return (
    <header className="topbar">
      <div className="topbar-inner">
        <a href="#top" className="brand" aria-label="Mãe Lúcia de Oxum">
          <span className="brand-mark"><TarotCard size={18} /></span>
          <span className="brand-name">
            <b>Mãe Lúcia</b>
            <span>de Oxum</span>
          </span>
        </a>
        <nav>
          <a href="#sobre">Sobre</a>
          <a href="#trabalhos">Trabalhos</a>
          <a href="#depoimentos">Depoimentos</a>
          <a href="#perguntas">Perguntas</a>
        </nav>
        <a href={WA_LINK} target="_blank" rel="noopener" className="cta-mini">
          <WhatsIcon /> Consulta agora
        </a>
      </div>
    </header>
  );
}

/* ========== Hero ========== */
function Hero() {
  return (
    <section className="hero" id="top">
      <div className="hero-bg">
        <img src={(typeof window !== 'undefined' && window.__resources && window.__resources.heroBg) || "assets/casal.png"} alt="Casal reunido em ambiente místico iluminado por velas" />
      </div>
      <div className="hero-orb" />
      <div className="hero-inner">
        <div className="eyebrow">Tradição de Oxum · 30 anos de fé</div>
        <h1>
          Traga de volta<br />
          quem o seu coração<br />
          <em>nunca esqueceu.</em>
        </h1>
        <p className="lead">
          A amarração amorosa de Mãe Lúcia une mais uma vez quem o destino separou.
          Trabalho sério, sigiloso e conduzido sob a força de Oxum, senhora do amor verdadeiro.
        </p>
        <div className="hero-ctas">
          <a href={WA_LINK} target="_blank" rel="noopener" className="btn-gold">
            <WhatsIcon /> Falar com Mãe Lúcia
          </a>
          <a href="#trabalhos" className="btn-ghost">Conhecer os trabalhos</a>
        </div>
        <div className="hero-stats">
          <div className="hero-stat"><div className="num">30+</div><div className="lab">Anos de Prática</div></div>
          <div className="hero-stat"><div className="num">12.480</div><div className="lab">Casais Reunidos</div></div>
          <div className="hero-stat"><div className="num">7 dias</div><div className="lab">Primeiros Sinais</div></div>
          <div className="hero-stat"><div className="num">100%</div><div className="lab">Sigilo Absoluto</div></div>
        </div>
      </div>
      <div className="scroll-hint">Desça com fé</div>
    </section>
  );
}

/* ========== Pain section ========== */
function Pain() {
  const quotes = [
    "Ele saiu de casa sem se despedir. As noites pararam de ter sentido.",
    "Descobri que havia outra. Ainda assim, é dele que sinto falta todo dia.",
    "Vejo o anel na gaveta e pergunto onde foi parar o homem por quem casei.",
    "Ela não responde mais. E eu não consigo parar de esperar.",
  ];
  return (
    <section className="pain" id="dor">
      <div className="container">
        <div className="section-head reveal">
          <div className="kicker"><Diamond /> Você reconhece esta dor?</div>
          <h2>O silêncio de quem se foi <em>dói mais</em> que qualquer palavra.</h2>
          <p>
            Você não está sozinha. Centenas de pessoas chegam até mim com a mesma ferida —
            e voltam para casa de mãos dadas com quem amam.
          </p>
        </div>
        <div className="pain-quotes">
          {quotes.map((q, i) => (
            <div className="pain-quote reveal" key={i} style={{ transitionDelay: `${i * 80}ms` }}>
              <p>{q}</p>
            </div>
          ))}
        </div>
        <div className="pain-cta reveal">
          O amor que parecia perdido pode <em>renascer</em>.<br />
          <b>É para isso que Oxum me chamou.</b>
        </div>
      </div>
    </section>
  );
}

/* ========== About ========== */
function About() {
  return (
    <section id="sobre">
      <div className="container">
        <div className="about-grid">
          <div className="about-portrait reveal">
            <img src={(typeof window !== 'undefined' && window.__resources && window.__resources.maeLuciaPortrait) || "assets/mae-lucia.jpeg"} alt="Mãe Lúcia de Oxum diante do altar sagrado" />
            <div className="frame-corners"><span /><span /><span /><span /></div>
          </div>
          <div className="about-body reveal">
            <div className="kicker"><Diamond /> A sacerdotisa</div>
            <h2>Mãe Lúcia, <em>filha legítima de Oxum</em>.</h2>
            <p>
              Iniciada ainda menina na fé de matriz africana, Mãe Lúcia atravessou <strong>três décadas</strong> dedicada
              exclusivamente aos assuntos do coração. É reconhecida em todo o Brasil como uma das poucas sacerdotisas
              que dominam a antiga <strong>amarração amorosa de Oxum</strong> — força divina das águas doces, senhora do amor que retorna.
            </p>
            <p>
              Seu dom não é palavra. É <strong>resultado</strong>. Milhares de famílias hoje vivem reunidas porque, em algum momento,
              acreditaram que ainda havia tempo de chamar o amor de volta.
            </p>
            <div className="about-credentials">
              <div className="cred"><div className="v">30 anos</div><div className="k">de sacerdócio</div></div>
              <div className="cred"><div className="v">12.480+</div><div className="k">casos resolvidos</div></div>
              <div className="cred"><div className="v">Atendimento</div><div className="k">nacional & internacional</div></div>
              <div className="cred"><div className="v">Sigilo</div><div className="k">total e jurado</div></div>
            </div>
            <div className="about-signature">Mãe Lúcia de Oxum</div>
          </div>
        </div>
      </div>
    </section>
  );
}

/* ========== Services ========== */
function Services() {
  const items = [
    {
      featured: true,
      badge: "Trabalho Principal",
      title: "Amarração Amorosa de Oxum",
      desc: "O trabalho mais procurado. Para trazer de volta o esposo, esposa, namorado(a) ou amor antigo — mesmo em casos considerados perdidos. Conduzido por Oxum, em sete dias os primeiros sinais costumam aparecer.",
      icon: (
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.4" aria-hidden="true">
          <path d="M12 21s-7-4.5-7-10a4 4 0 0 1 7-2.65A4 4 0 0 1 19 11c0 5.5-7 10-7 10z"/>
        </svg>
      ),
    },
    {
      title: "Consulta de Tarô do Amor",
      desc: "Leitura espiritual completa do seu caso. Descubro o que sente a outra pessoa, se há interferência de terceiros e o caminho mais rápido para a reconciliação.",
      icon: (
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.4" aria-hidden="true">
          <rect x="5" y="3" width="14" height="18" rx="2"/>
          <path d="M9 8h6M9 12h6M9 16h3"/>
        </svg>
      ),
    },
    {
      title: "Limpeza & Quebra de Demandas",
      desc: "Remoção de feitiços, olho-grande e amarrações contrárias enviadas por terceiros para afastar o seu amor. Limpeza espiritual com banhos sagrados.",
      icon: (
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.4" aria-hidden="true">
          <path d="M12 2v6"/>
          <path d="M5 12c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7-7-3.13-7-7z"/>
          <path d="M8 12l2.5 2.5L16 9"/>
        </svg>
      ),
    },
    {
      title: "Trabalho de União Definitiva",
      desc: "Para selar o casamento, vencer a dúvida e blindar a relação contra terceiros. Indicado depois da reconciliação para que o amor não volte a se afastar.",
      icon: (
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.4" aria-hidden="true">
          <circle cx="9" cy="13" r="5"/>
          <circle cx="15" cy="13" r="5"/>
        </svg>
      ),
    },
  ];
  return (
    <section className="services" id="trabalhos">
      <div className="container">
        <div className="section-head reveal">
          <div className="kicker"><Diamond /> Trabalhos sagrados</div>
          <h2>Cada caso é único. <em>Cada coração tem seu caminho.</em></h2>
          <p>Após escutar sua história no WhatsApp, Mãe Lúcia indica o trabalho certo para o seu caso. Sem promessa vazia — só o que realmente funciona.</p>
        </div>
        <div className="services-grid">
          {items.map((s, i) => (
            <div className={`service reveal ${s.featured ? "featured" : ""}`} key={i} style={{ transitionDelay: `${i * 80}ms` }}>
              {s.badge && <div className="service-badge">{s.badge}</div>}
              <div className="service-icon">{s.icon}</div>
              <h3>{s.title}</h3>
              <p>{s.desc}</p>
            </div>
          ))}
        </div>

        <div className="featured-strip reveal">
          <h3>Não sabe qual trabalho fazer? <em>Mãe Lúcia escuta seu caso em sigilo.</em></h3>
          <p>O primeiro contato é por WhatsApp. Conte sua história, receba orientação espiritual e decida com calma e fé.</p>
          <a href={waLink("Olá Mãe Lúcia, quero contar meu caso e saber qual trabalho é o ideal.")} target="_blank" rel="noopener" className="btn-gold">
            <WhatsIcon /> Conversar com Mãe Lúcia
          </a>
        </div>
      </div>
    </section>
  );
}

/* ========== Process ========== */
function Process() {
  const steps = [
    { n: "I", t: "Conversa inicial", d: "Você escreve no WhatsApp e conta o seu caso. Mãe Lúcia escuta com atenção e total sigilo." },
    { n: "II", t: "Diagnóstico espiritual", d: "Através do tarô e da força de Oxum, é identificado o caminho exato a ser percorrido." },
    { n: "III", t: "Trabalho conduzido", d: "Mãe Lúcia conduz o ritual com seus pontos, ervas e firmezas. Você acompanha cada passo." },
    { n: "IV", t: "Primeiros sinais", d: "Mensagens, sonhos, vontade súbita de procurar. Em até sete dias o coração começa a falar de volta." },
  ];
  return (
    <section id="processo">
      <div className="container">
        <div className="section-head reveal">
          <div className="kicker"><Diamond /> O caminho da reconciliação</div>
          <h2>Quatro passos. <em>Um amor de volta.</em></h2>
        </div>
        <div className="process-list">
          {steps.map((s, i) => (
            <div className="step reveal" key={i} style={{ transitionDelay: `${i * 80}ms` }}>
              <div className="step-num">{s.n}</div>
              <h4>{s.t}</h4>
              <p>{s.d}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ========== Testimonials ========== */
function Testimonials() {
  const items = [
    {
      stars: 5,
      quote: "Meu marido tinha saído de casa havia quatro meses. Já estava morando com outra. Procurei Mãe Lúcia chorando, sem fé em mais nada. No nono dia ele bateu na minha porta pedindo para voltar. Hoje somos mais felizes do que antes.",
      name: "Mariana A.",
      loc: "Belo Horizonte · MG",
      badge: "Caso encerrado em 14 dias",
      init: "M",
    },
    {
      stars: 5,
      quote: "Minha esposa pediu o divórcio do nada. Eu estava destruído, perdendo peso, sem dormir. Mãe Lúcia me atendeu por WhatsApp na mesma noite — e foi a única que me deu esperança real. Hoje minha aliança voltou para o dedo dela.",
      name: "Carlos R.",
      loc: "Curitiba · PR",
      badge: "Reconciliação em 21 dias",
      init: "C",
    },
    {
      stars: 5,
      quote: "Cinco anos juntos e ele terminou por mensagem. Eu não conseguia comer, não conseguia trabalhar. Mãe Lúcia me explicou que havia um trabalho feito contra a nossa união — e desfez. Hoje estamos noivos.",
      name: "Juliana P.",
      loc: "Recife · PE",
      badge: "Trabalho contrário desfeito",
      init: "J",
    },
    {
      stars: 5,
      quote: "Eu já não acreditava em mais nada. Tinha procurado três pessoas antes. Mãe Lúcia foi a única que me disse a verdade sobre o meu caso — e a verdade salvou minha família. Recomendo de olhos fechados.",
      name: "Patrícia M.",
      loc: "São Paulo · SP",
      badge: "Família reunida",
      init: "P",
    },
    {
      stars: 5,
      quote: "Minha mulher tinha engravidado e ainda assim queria ir embora. Eu estava prestes a perder tudo. Em pouco mais de duas semanas ela me procurou pedindo conversa. Hoje nosso filho tem pai e mãe juntos sob o mesmo teto.",
      name: "Roberto S.",
      loc: "Salvador · BA",
      badge: "União restaurada",
      init: "R",
    },
  ];
  const [idx, setIdx] = React.useState(0);
  const t = items[idx];
  const next = () => setIdx((i) => (i + 1) % items.length);
  const prev = () => setIdx((i) => (i - 1 + items.length) % items.length);

  React.useEffect(() => {
    const id = setInterval(() => setIdx((i) => (i + 1) % items.length), 8000);
    return () => clearInterval(id);
  }, []);

  return (
    <section className="testimonials" id="depoimentos">
      <div className="container">
        <div className="section-head reveal">
          <div className="kicker"><Diamond /> Histórias verdadeiras</div>
          <h2>Quem voltou para casa <em>fala por nós.</em></h2>
          <p>Nomes preservados quando solicitado. Cidades reais. Casos reais.</p>
        </div>
        <div className="testimonial-carousel reveal">
          <div className="testimonial-card" key={idx}>
            <div>
              <div className="tstars">{Array.from({ length: t.stars }).map((_, i) => <Star key={i} />)}</div>
              <p className="tquote">{t.quote}</p>
            </div>
            <div className="testimonial-meta">
              <div className="tavatar">{t.init}</div>
              <div>
                <div className="name">{t.name}</div>
                <div className="loc">{t.loc}</div>
              </div>
              <div className="badge">{t.badge}</div>
            </div>
          </div>
          <div className="carousel-nav">
            <button className="carousel-btn" onClick={prev} aria-label="Anterior"><ArrowLeft /></button>
            <div className="carousel-dots">
              {items.map((_, i) => (
                <button key={i} className={i === idx ? "active" : ""} onClick={() => setIdx(i)} aria-label={`Depoimento ${i + 1}`} />
              ))}
            </div>
            <button className="carousel-btn" onClick={next} aria-label="Próximo"><ArrowRight /></button>
          </div>
        </div>
      </div>
    </section>
  );
}

/* ========== FAQ ========== */
function FAQ() {
  const faqs = [
    {
      q: "A amarração amorosa de Oxum funciona mesmo?",
      a: "Sim. Quando feita por uma sacerdotisa séria, com diagnóstico correto, ervas certas e firmezas conduzidas dentro da tradição, o trabalho de Oxum é um dos mais poderosos para o amor. Por isso Mãe Lúcia escuta cada caso antes de aceitar — não trabalha o que não pode resolver.",
    },
    {
      q: "Em quanto tempo eu vejo resultado?",
      a: "Os primeiros sinais costumam aparecer entre 3 e 9 dias: sonhos, mensagens inesperadas, vontade súbita de procurar. A reconciliação completa varia conforme o caso e costuma se concretizar entre 14 e 30 dias.",
    },
    {
      q: "Meu caso é muito difícil. Mesmo assim funciona?",
      a: "A maioria das pessoas que procuram Mãe Lúcia chega justamente nos casos considerados perdidos: pessoa morando com outra, casamento desfeito, anos sem contato. É exatamente para isto que Oxum chamou Mãe Lúcia.",
    },
    {
      q: "Como funciona o atendimento à distância?",
      a: "Todo o atendimento começa por WhatsApp. Você conta seu caso, recebe orientação e, se for de seu coração, o trabalho é conduzido no terreiro de Mãe Lúcia em seu nome. Você acompanha cada passo por mensagem.",
    },
    {
      q: "É seguro? Tem sigilo?",
      a: "O sigilo é absoluto e jurado. Nada do que é contado a Mãe Lúcia sai do altar. Seu nome, sua história e seu caso permanecem somente entre você, ela e Oxum.",
    },
    {
      q: "Quanto custa?",
      a: "Cada trabalho tem um valor próprio, determinado pela complexidade do caso. Mãe Lúcia conversa com você por WhatsApp, escuta sua história sem compromisso e só então apresenta as opções. O primeiro contato é gratuito.",
    },
  ];
  const [open, setOpen] = React.useState(0);
  return (
    <section id="perguntas">
      <div className="container">
        <div className="section-head reveal">
          <div className="kicker"><Diamond /> Perguntas frequentes</div>
          <h2>Dúvidas que <em>todo coração</em> em sofrimento tem.</h2>
        </div>
        <div className="faq-list reveal">
          {faqs.map((f, i) => (
            <div className={`faq-item ${open === i ? "open" : ""}`} key={i}>
              <button onClick={() => setOpen(open === i ? -1 : i)} aria-expanded={open === i}>
                <span>{f.q}</span>
                <span className="icon">+</span>
              </button>
              <div className="faq-body">
                <p>{f.a}</p>
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ========== Urgency ========== */
function Urgency() {
  return (
    <section className="urgency" id="agir">
      <div className="urgency-inner reveal">
        <div className="divider-ornament"><OxumMark size={28} /></div>
        <h2 style={{ marginTop: 32 }}>
          Cada dia perdido é<br />
          um dia <em>nos braços do outro.</em>
        </h2>
        <p>
          Se você chegou até aqui, foi porque uma força maior te trouxe.
          Não deixe o amanhã decidir o que o seu coração já sabe hoje.
        </p>
        <a href={waLink("Olá Mãe Lúcia, vim pelo site. Preciso urgentemente da sua ajuda no meu caso amoroso.")} target="_blank" rel="noopener" className="btn-gold">
          <WhatsIcon /> Conversar agora · {WA_DISPLAY}
        </a>
        <div className="urgency-meta">
          <span>Atendimento Imediato</span>
          <span>Sigilo Absoluto</span>
          <span>Primeira Conversa Gratuita</span>
        </div>
      </div>
    </section>
  );
}

/* ========== Floating WhatsApp ========== */
function FloatingWA() {
  return (
    <a href={WA_LINK} target="_blank" rel="noopener" className="wa-float" aria-label="WhatsApp Mãe Lúcia">
      <WhatsIcon />
      <span className="wa-label">Falar com Mãe Lúcia</span>
    </a>
  );
}

/* ========== Footer ========== */
function Footer() {
  return (
    <footer>
      <div className="ornate" />
      <div className="brand-name" style={{ fontFamily: "var(--display)", letterSpacing: "0.2em" }}>
        <span style={{ background: "var(--gold-grad)", WebkitBackgroundClip: "text", backgroundClip: "text", color: "transparent", fontSize: 15 }}>
          MÃE LÚCIA DE OXUM
        </span>
      </div>
      <div style={{ fontSize: 13, color: "var(--ivory-dim)", marginBottom: 10 }}>
        WhatsApp · <a href={WA_LINK} target="_blank" rel="noopener" style={{ color: "var(--gold-3)" }}>{WA_DISPLAY}</a>
      </div>
      <div style={{ fontSize: 12, color: "var(--ivory-faint)", letterSpacing: "0.15em", textTransform: "uppercase" }}>
        Atendimento todos os dias · Sigilo absoluto
      </div>
      <div className="legal">
        © {new Date().getFullYear()} Mãe Lúcia de Oxum · Todos os direitos reservados.<br />
        Este site é dedicado à fé. Os trabalhos espirituais não substituem acompanhamento médico ou psicológico.
      </div>
    </footer>
  );
}

/* ========== Export to window ========== */
Object.assign(window, {
  Topbar, Hero, Pain, About, Services, Process, Testimonials, FAQ, Urgency, FloatingWA, Footer, useReveal
});
