// Seção de oferta + CTA + elementos de confiança + modal
const { useState: useState_O, useEffect: useEffect_O, useRef: useRef_O } = React;

// Card principal da oferta
const OfferCard = ({ tweaks, onAccept, onDecline }) => {
  const benefits = [
    { icon: "👁", title: "A Grande Revelação", desc: "Carta Psíquica Completa — descubra quem ele realmente é." },
    { icon: "📍", title: "Localização + Encontro", desc: "Saiba onde ele mora e quando irão se encontrar." },
    { icon: "🎨", title: "Retrato Colorido", desc: "Veja sua alma gêmea em todos os detalhes." },
    { icon: "🔮", title: "Preságio do Amanhã", desc: "Bônus 1 — o que vai acontecer nos próximos 12 meses.", bonus: true },
    { icon: "⏳", title: "Ecos da Alma", desc: "Bônus 2 — entenda conexões de vidas passadas.", bonus: true },
  ];

  return (
    <section style={{ padding: "56px 18px 24px", background: tweaks.dark ? "#0e0a08" : "#f8efe2" }}>
      <Reveal>
        <div style={{ textAlign: "center", marginBottom: "8px" }}>
          <div style={{
            display: "inline-block",
            background: tweaks.gold,
            color: "#1a1410",
            fontSize: "11px",
            letterSpacing: "0.2em",
            textTransform: "uppercase",
            fontWeight: 700,
            padding: "6px 14px",
            borderRadius: "100px",
            fontFamily: "'Inter Tight', sans-serif",
          }}>
            ✦ Oferta Especial
          </div>
        </div>
      </Reveal>

      <Reveal delay={100} as="h2" style={{
        fontFamily: "'Cormorant Garamond', serif",
        fontSize: "28px",
        fontWeight: 400,
        lineHeight: 1.15,
        textAlign: "center",
        color: tweaks.dark ? "#f5ede0" : "#1a1410",
        margin: "12px 0 32px",
        letterSpacing: "-0.015em",
        textWrap: "pretty",
      }}>
        Combo Completo da Alma Gêmea
        <em style={{ display: "block", fontSize: "18px", fontStyle: "italic", color: tweaks.gold, marginTop: "4px" }}>
          o que você recebe hoje ↓
        </em>
      </Reveal>

      <div style={{
        background: tweaks.dark ? "#1a1410" : "#fff",
        borderRadius: "12px",
        padding: "20px 16px 22px",
        boxShadow: tweaks.dark
          ? `0 0 0 1px ${tweaks.gold}33`
          : "0 20px 50px -20px rgba(60,40,20,0.18), 0 0 0 1px #ead9c9",
        position: "relative",
      }}>
        {/* Lista de benefícios */}
        <div style={{ display: "flex", flexDirection: "column", gap: "12px" }}>
          {benefits.map((b, i) => (
            <Reveal key={i} delay={i * 80}>
              <div style={{
                display: "flex",
                gap: "12px",
                padding: "10px 4px",
                borderBottom: i < benefits.length - 1 ? `1px solid ${tweaks.dark ? "rgba(184,137,61,0.15)" : "#f0e4d4"}` : "none",
                position: "relative",
              }}>
                <div style={{
                  width: "40px",
                  height: "40px",
                  borderRadius: "8px",
                  background: b.bonus
                    ? `linear-gradient(135deg, ${tweaks.gold}33 0%, ${tweaks.gold}11 100%)`
                    : tweaks.dark ? "rgba(245,237,224,0.06)" : "#faf3e8",
                  display: "flex",
                  alignItems: "center",
                  justifyContent: "center",
                  fontSize: "20px",
                  flexShrink: 0,
                  border: b.bonus ? `1px solid ${tweaks.gold}55` : "none",
                }}>{b.icon}</div>
                <div style={{ flex: 1 }}>
                  <div style={{
                    display: "flex",
                    alignItems: "center",
                    gap: "8px",
                    marginBottom: "2px",
                    flexWrap: "wrap",
                  }}>
                    <span style={{
                      fontFamily: "'Cormorant Garamond', serif",
                      fontSize: "18px",
                      fontWeight: 500,
                      color: tweaks.dark ? "#f5ede0" : "#1a1410",
                      lineHeight: 1.2,
                    }}>{b.title}</span>
                    {b.bonus && (
                      <span style={{
                        fontSize: "9px",
                        letterSpacing: "0.15em",
                        textTransform: "uppercase",
                        background: tweaks.gold,
                        color: "#1a1410",
                        padding: "2px 6px",
                        borderRadius: "3px",
                        fontWeight: 700,
                        fontFamily: "'Inter Tight', sans-serif",
                      }}>BÔNUS</span>
                    )}
                  </div>
                  <p style={{
                    fontFamily: "'Inter Tight', sans-serif",
                    fontSize: "13px",
                    lineHeight: 1.45,
                    color: tweaks.dark ? "#a89888" : "#7a6a5e",
                    margin: 0,
                  }}>{b.desc}</p>
                </div>
                <div style={{
                  flexShrink: 0,
                  alignSelf: "center",
                  color: tweaks.gold,
                  fontSize: "16px",
                }}>✓</div>
              </div>
            </Reveal>
          ))}
        </div>

        {/* Preço */}
        <Reveal delay={500}>
          <div style={{
            marginTop: "24px",
            paddingTop: "20px",
            borderTop: `1px dashed ${tweaks.dark ? "rgba(184,137,61,0.3)" : "#e0cfb8"}`,
            textAlign: "center",
          }}>
            <div style={{
              fontFamily: "'Inter Tight', sans-serif",
              fontSize: "12px",
              letterSpacing: "0.18em",
              textTransform: "uppercase",
              color: tweaks.dark ? "#a89888" : "#8a7060",
              marginBottom: "6px",
              fontWeight: 500,
            }}>
              Leve tudo hoje com 80% OFF
            </div>
            <div style={{
              display: "flex",
              alignItems: "baseline",
              justifyContent: "center",
              gap: "10px",
              marginBottom: "4px",
            }}>
              <span style={{
                fontFamily: "'Inter Tight', sans-serif",
                fontSize: "16px",
                color: tweaks.dark ? "#a89888" : "#a89888",
                textDecoration: "line-through",
                textDecorationThickness: "1.5px",
              }}>De R$ 335</span>
            </div>
            <div style={{
              display: "flex",
              alignItems: "baseline",
              justifyContent: "center",
              gap: "4px",
              marginBottom: "2px",
            }}>
              <span style={{
                fontFamily: "'Cormorant Garamond', serif",
                fontSize: "20px",
                color: tweaks.dark ? "#f5ede0" : "#1a1410",
                fontWeight: 400,
              }}>por apenas</span>
            </div>
            <div style={{
              display: "flex",
              alignItems: "baseline",
              justifyContent: "center",
              gap: "4px",
              lineHeight: 1,
              marginTop: "4px",
            }}>
              <span style={{
                fontFamily: "'Cormorant Garamond', serif",
                fontSize: "20px",
                color: tweaks.dark ? "#f5ede0" : "#1a1410",
                fontWeight: 500,
              }}>R$</span>
              <span style={{
                fontFamily: "'Cormorant Garamond', serif",
                fontSize: "72px",
                fontWeight: 500,
                color: tweaks.dark ? "#f5ede0" : "#1a1410",
                letterSpacing: "-0.04em",
                lineHeight: 0.9,
              }}>67</span>
            </div>
            <div style={{
              fontFamily: "'Inter Tight', sans-serif",
              fontSize: "12px",
              color: tweaks.dark ? "#a89888" : "#8a7060",
              marginTop: "6px",
            }}>
              ou 12× de R$ 6,77 no cartão
            </div>
          </div>
        </Reveal>

        {/* CTA */}
        <Reveal delay={600}>
          <button
            onClick={onAccept}
            className="cta-pulse"
            style={{
              width: "100%",
              marginTop: "20px",
              padding: "20px 16px",
              background: `linear-gradient(180deg, ${tweaks.gold} 0%, #9d7330 100%)`,
              border: "none",
              borderRadius: "10px",
              color: "#1a1410",
              fontFamily: "'Inter Tight', sans-serif",
              fontSize: "16px",
              fontWeight: 700,
              letterSpacing: "0.02em",
              cursor: "pointer",
              boxShadow: `0 12px 30px -10px ${tweaks.gold}88, inset 0 1px 0 rgba(255,255,255,0.4)`,
              position: "relative",
              overflow: "hidden",
              textWrap: "balance",
            }}
          >
            <span style={{ position: "relative", zIndex: 2 }}>
              SIM, QUERO DESCOBRIR TUDO AGORA
              <div style={{ fontSize: "11px", fontWeight: 500, opacity: 0.75, marginTop: "4px", letterSpacing: "0.05em" }}>
                Receber Combo Completo por R$ 67
              </div>
            </span>
          </button>
        </Reveal>

        {/* Garantia + recusa */}
        <Reveal delay={700}>
          <div style={{ marginTop: "16px", display: "flex", flexDirection: "column", alignItems: "center", gap: "12px" }}>
            <div style={{
              display: "flex",
              alignItems: "center",
              gap: "8px",
              fontFamily: "'Inter Tight', sans-serif",
              fontSize: "12px",
              color: tweaks.dark ? "#c8b8a8" : "#5a4a3e",
              fontWeight: 500,
            }}>
              <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
                <path d="M8 1.5 L13.5 4 V8 C13.5 11 11 13.5 8 14.5 C5 13.5 2.5 11 2.5 8 V4 L8 1.5 Z" stroke={tweaks.gold} strokeWidth="1.2" strokeLinejoin="round" fill="none" />
                <path d="M5.5 8 L7 9.5 L10.5 6" stroke={tweaks.gold} strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" />
              </svg>
              Garantia incondicional de 7 dias
            </div>
            <button
              onClick={onDecline}
              style={{
                background: "none",
                border: "none",
                fontFamily: "'Inter Tight', sans-serif",
                fontSize: "12px",
                color: tweaks.dark ? "#7a6a5e" : "#a89888",
                textDecoration: "underline",
                textDecorationThickness: "0.5px",
                textUnderlineOffset: "3px",
                cursor: "pointer",
                padding: "6px",
                fontStyle: "italic",
              }}
            >
              Não... prefiro nunca descobrir o nome dele.
            </button>
          </div>
        </Reveal>
      </div>
    </section>
  );
};

// Depoimentos
const Testimonials = ({ tweaks }) => {
  const items = [
    {
      name: "Marisa, 54",
      city: "Belo Horizonte",
      stars: 5,
      text: "Quando vi o retrato colorido eu chorei. Era exatamente o rosto que aparecia nos meus sonhos há anos.",
    },
    {
      name: "Cláudia, 47",
      city: "Curitiba",
      stars: 5,
      text: "A carta psíquica acertou o nome do meu colega de trabalho. Eu nunca tinha pensado nele desse jeito.",
    },
    {
      name: "Vera, 61",
      city: "Recife",
      stars: 5,
      text: "Comprei o combo completo e foi a melhor decisão. Os detalhes que a Mestre Maya revelou me arrepiaram.",
    },
  ];

  return (
    <section style={{ padding: "48px 22px", background: tweaks.dark ? "#15100c" : "#fbf6ee" }}>
      <Reveal>
        <div style={{ textAlign: "center", marginBottom: "24px" }}>
          <div style={{
            fontFamily: "'Inter Tight', sans-serif",
            fontSize: "11px",
            letterSpacing: "0.22em",
            textTransform: "uppercase",
            color: tweaks.gold,
            fontWeight: 600,
            marginBottom: "8px",
          }}>
            ✦ Quem confiou
          </div>
          <h3 style={{
            fontFamily: "'Cormorant Garamond', serif",
            fontSize: "26px",
            fontWeight: 400,
            color: tweaks.dark ? "#f5ede0" : "#1a1410",
            margin: 0,
            lineHeight: 1.2,
            textWrap: "pretty",
          }}>
            Mais de <em style={{ fontStyle: "italic", color: tweaks.gold }}>11.400 mulheres</em>
            <br />já receberam o Combo Completo
          </h3>
        </div>
      </Reveal>

      <div style={{ display: "flex", flexDirection: "column", gap: "12px", maxWidth: "340px", margin: "0 auto" }}>
        {items.map((t, i) => (
          <Reveal key={i} delay={i * 100}>
            <div style={{
              background: tweaks.dark ? "rgba(245,237,224,0.04)" : "#fff",
              border: `1px solid ${tweaks.dark ? "rgba(184,137,61,0.18)" : "#ead9c9"}`,
              borderRadius: "10px",
              padding: "16px 16px 14px",
              boxShadow: tweaks.dark ? "none" : "0 2px 8px rgba(60,40,20,0.04)",
            }}>
              <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: "8px" }}>
                <div style={{
                  fontFamily: "'Cormorant Garamond', serif",
                  fontSize: "17px",
                  fontWeight: 500,
                  color: tweaks.dark ? "#f5ede0" : "#1a1410",
                }}>
                  {t.name}
                  <span style={{ fontSize: "12px", fontWeight: 400, fontStyle: "italic", color: tweaks.dark ? "#a89888" : "#8a7060", marginLeft: "8px" }}>
                    · {t.city}
                  </span>
                </div>
                <div style={{ color: tweaks.gold, fontSize: "12px", letterSpacing: "1px" }}>
                  {"★".repeat(t.stars)}
                </div>
              </div>
              <p style={{
                fontFamily: "'Inter Tight', sans-serif",
                fontSize: "14px",
                lineHeight: 1.5,
                color: tweaks.dark ? "#c8b8a8" : "#5a4a3e",
                margin: 0,
                fontStyle: "italic",
              }}>"{t.text}"</p>
            </div>
          </Reveal>
        ))}
      </div>
    </section>
  );
};

// Mestre Maya
const MasterCard = ({ tweaks }) => {
  return (
    <section style={{ padding: "48px 24px", textAlign: "center" }}>
      <Reveal>
        <div style={{
          width: "96px",
          height: "96px",
          borderRadius: "50%",
          margin: "0 auto 18px",
          background: `linear-gradient(155deg, ${tweaks.gold} 0%, #8a6628 100%)`,
          padding: "3px",
          boxShadow: `0 12px 30px -10px ${tweaks.gold}66`,
        }}>
          <div style={{
            width: "100%",
            height: "100%",
            borderRadius: "50%",
            background: `radial-gradient(circle at 50% 35%, #c98968 0%, #6b3a2a 60%, #2a160e 100%)`,
            position: "relative",
            overflow: "hidden",
          }}>
            <div style={{
              position: "absolute",
              inset: 0,
              background: `radial-gradient(ellipse 70% 40% at 50% 20%, #1a0e08 0%, transparent 60%)`,
            }} />
          </div>
        </div>
      </Reveal>
      <Reveal delay={120}>
        <div style={{
          fontFamily: "'Inter Tight', sans-serif",
          fontSize: "11px",
          letterSpacing: "0.22em",
          textTransform: "uppercase",
          color: tweaks.gold,
          fontWeight: 600,
          marginBottom: "4px",
        }}>
          ✦ Sobre quem está com você
        </div>
      </Reveal>
      <Reveal delay={160}>
        <h3 style={{
          fontFamily: "'Cormorant Garamond', serif",
          fontSize: "26px",
          fontWeight: 400,
          color: tweaks.dark ? "#f5ede0" : "#1a1410",
          margin: "0 0 10px",
          letterSpacing: "-0.01em",
        }}>
          Mestre <em style={{ fontStyle: "italic" }}>Maya</em>
        </h3>
      </Reveal>
      <Reveal delay={220}>
        <p style={{
          fontFamily: "'Inter Tight', sans-serif",
          fontSize: "14px",
          lineHeight: 1.55,
          color: tweaks.dark ? "#c8b8a8" : "#5a4a3e",
          maxWidth: "300px",
          margin: "0 auto 16px",
          textWrap: "pretty",
        }}>
          Vidente espiritual com mais de <strong style={{ color: tweaks.dark ? "#f5ede0" : "#1a1410" }}>32 anos</strong> de experiência em conexões de alma. Já desenhou retratos para mais de 11 mil pessoas no Brasil e em Portugal.
        </p>
      </Reveal>
      <Reveal delay={280}>
        <div style={{ display: "flex", justifyContent: "center", gap: "16px", flexWrap: "wrap" }}>
          {[
            { num: "32+", label: "anos lendo almas" },
            { num: "11k", label: "retratos feitos" },
            { num: "4.9★", label: "avaliação" },
          ].map((s, i) => (
            <div key={i} style={{ textAlign: "center" }}>
              <div style={{
                fontFamily: "'Cormorant Garamond', serif",
                fontSize: "22px",
                color: tweaks.gold,
                fontWeight: 500,
                lineHeight: 1,
              }}>{s.num}</div>
              <div style={{
                fontFamily: "'Inter Tight', sans-serif",
                fontSize: "10px",
                letterSpacing: "0.1em",
                textTransform: "uppercase",
                color: tweaks.dark ? "#a89888" : "#8a7060",
                marginTop: "3px",
              }}>{s.label}</div>
            </div>
          ))}
        </div>
      </Reveal>
    </section>
  );
};

// Live counter — pessoas que adquiriram hoje
const LiveCounter = ({ tweaks }) => {
  const [count, setCount] = useState_O(847);
  useEffect_O(() => {
    const t = setInterval(() => setCount((c) => c + Math.floor(Math.random() * 2)), 8000);
    return () => clearInterval(t);
  }, []);

  return (
    <Reveal>
      <div style={{
        display: "flex",
        alignItems: "center",
        gap: "10px",
        background: tweaks.dark ? "rgba(245,237,224,0.04)" : "#fff",
        border: `1px solid ${tweaks.dark ? "rgba(184,137,61,0.2)" : "#ead9c9"}`,
        borderRadius: "100px",
        padding: "8px 14px",
        margin: "20px auto 0",
        width: "fit-content",
      }}>
        <div style={{ position: "relative", width: "8px", height: "8px" }}>
          <div style={{
            position: "absolute",
            inset: 0,
            borderRadius: "50%",
            background: "#22a060",
          }} />
          <div style={{
            position: "absolute",
            inset: "-3px",
            borderRadius: "50%",
            background: "#22a06066",
            animation: "ping 1.8s cubic-bezier(0,0,0.2,1) infinite",
          }} />
        </div>
        <span style={{
          fontFamily: "'Inter Tight', sans-serif",
          fontSize: "12px",
          color: tweaks.dark ? "#c8b8a8" : "#5a4a3e",
        }}>
          <strong style={{ color: tweaks.dark ? "#f5ede0" : "#1a1410", fontWeight: 600 }}>{count}</strong> mulheres adquiriram hoje
        </span>
      </div>
    </Reveal>
  );
};

// Footer com pagamento e selos
const TrustFooter = ({ tweaks }) => {
  return (
    <footer style={{
      padding: "32px 24px 40px",
      background: tweaks.dark ? "#0a0807" : "#1a1410",
      color: "#c8b8a8",
      textAlign: "center",
    }}>
      <div style={{
        fontFamily: "'Inter Tight', sans-serif",
        fontSize: "10px",
        letterSpacing: "0.2em",
        textTransform: "uppercase",
        color: "#7a6a5e",
        marginBottom: "14px",
        fontWeight: 600,
      }}>
        Pagamento 100% seguro
      </div>

      <div style={{ display: "flex", justifyContent: "center", gap: "10px", flexWrap: "wrap", marginBottom: "20px" }}>
        {/* Pix */}
        <div style={{
          background: "#fff",
          color: "#1a1410",
          padding: "8px 12px",
          borderRadius: "6px",
          fontFamily: "'Inter Tight', sans-serif",
          fontSize: "11px",
          fontWeight: 700,
          letterSpacing: "0.05em",
          display: "flex",
          alignItems: "center",
          gap: "5px",
        }}>
          <svg width="14" height="14" viewBox="0 0 14 14"><path d="M7 1 L13 7 L7 13 L1 7 Z" fill="#32BCAD" /></svg>
          PIX
        </div>
        {/* Visa */}
        <div style={{
          background: "#fff",
          color: "#1a1f71",
          padding: "8px 14px",
          borderRadius: "6px",
          fontFamily: "Georgia, serif",
          fontSize: "13px",
          fontWeight: 700,
          fontStyle: "italic",
          letterSpacing: "0.02em",
        }}>VISA</div>
        {/* Master */}
        <div style={{
          background: "#fff",
          padding: "5px 10px",
          borderRadius: "6px",
          display: "flex",
          alignItems: "center",
        }}>
          <div style={{ width: "16px", height: "16px", borderRadius: "50%", background: "#eb001b" }} />
          <div style={{ width: "16px", height: "16px", borderRadius: "50%", background: "#f79e1b", marginLeft: "-6px" }} />
        </div>
        {/* SSL */}
        <div style={{
          background: "rgba(255,255,255,0.08)",
          color: "#c8b8a8",
          padding: "8px 12px",
          borderRadius: "6px",
          fontFamily: "'Inter Tight', sans-serif",
          fontSize: "11px",
          fontWeight: 600,
          display: "flex",
          alignItems: "center",
          gap: "5px",
        }}>
          🔒 SSL
        </div>
      </div>

      <div style={{
        fontFamily: "'Inter Tight', sans-serif",
        fontSize: "10px",
        color: "#7a6a5e",
        lineHeight: 1.6,
        maxWidth: "280px",
        margin: "0 auto",
      }}>
        Caminho dos Astros · CNPJ 00.000.000/0001-00
        <br />
        Suporte: contato@caminhodosastros.net
        <br />
        <span style={{ opacity: 0.7 }}>Termos · Privacidade · Reembolso</span>
      </div>
    </footer>
  );
};

// Modal de last-chance
const LastChanceModal = ({ tweaks, open, onClose, onAccept }) => {
  if (!open) return null;
  return (
    <div
      onClick={onClose}
      style={{
        position: "fixed",
        inset: 0,
        background: "rgba(20,12,8,0.7)",
        backdropFilter: "blur(8px)",
        zIndex: 100,
        display: "flex",
        alignItems: "center",
        justifyContent: "center",
        padding: "24px",
        animation: "fadeIn 200ms ease-out",
      }}
    >
      <div
        onClick={(e) => e.stopPropagation()}
        style={{
          background: tweaks.dark ? "#1a1410" : "#fff",
          borderRadius: "12px",
          padding: "28px 22px",
          maxWidth: "340px",
          width: "100%",
          textAlign: "center",
          boxShadow: "0 30px 60px -10px rgba(0,0,0,0.4)",
          border: `1px solid ${tweaks.gold}55`,
          animation: "slideUp 300ms cubic-bezier(.2,.7,.3,1)",
          position: "relative",
        }}
      >
        <button
          onClick={onClose}
          style={{
            position: "absolute",
            top: "10px",
            right: "10px",
            background: "none",
            border: "none",
            fontSize: "22px",
            color: tweaks.dark ? "#7a6a5e" : "#a89888",
            cursor: "pointer",
            padding: "4px 8px",
            lineHeight: 1,
          }}
        >×</button>

        <div style={{
          fontSize: "32px",
          marginBottom: "8px",
        }}>💔</div>

        <h3 style={{
          fontFamily: "'Cormorant Garamond', serif",
          fontSize: "26px",
          fontWeight: 400,
          color: tweaks.dark ? "#f5ede0" : "#1a1410",
          margin: "0 0 12px",
          lineHeight: 1.15,
          letterSpacing: "-0.01em",
          textWrap: "pretty",
        }}>
          Tem certeza que quer ir <em style={{ fontStyle: "italic", color: tweaks.gold }}>sem saber</em>?
        </h3>

        <p style={{
          fontFamily: "'Inter Tight', sans-serif",
          fontSize: "14px",
          lineHeight: 1.55,
          color: tweaks.dark ? "#c8b8a8" : "#5a4a3e",
          margin: "0 0 20px",
          textWrap: "pretty",
        }}>
          Esta é a última chance de descobrir o <strong>nome</strong>, a <strong>localização</strong> e o <strong>momento do encontro</strong> com sua alma gêmea.
          <br /><br />
          <em style={{ fontStyle: "italic" }}>Esta oferta não voltará a aparecer.</em>
        </p>

        <button
          onClick={onAccept}
          style={{
            width: "100%",
            padding: "18px 16px",
            background: `linear-gradient(180deg, ${tweaks.gold} 0%, #9d7330 100%)`,
            border: "none",
            borderRadius: "10px",
            color: "#1a1410",
            fontFamily: "'Inter Tight', sans-serif",
            fontSize: "15px",
            fontWeight: 700,
            cursor: "pointer",
            letterSpacing: "0.02em",
            boxShadow: `0 8px 20px -8px ${tweaks.gold}88`,
          }}
        >
          Quero descobrir tudo por R$ 67
        </button>

        <button
          onClick={onClose}
          style={{
            background: "none",
            border: "none",
            fontFamily: "'Inter Tight', sans-serif",
            fontSize: "12px",
            color: tweaks.dark ? "#7a6a5e" : "#a89888",
            textDecoration: "underline",
            cursor: "pointer",
            marginTop: "12px",
            padding: "6px",
            fontStyle: "italic",
          }}
        >
          Não, prefiro abrir mão dessa oportunidade.
        </button>
      </div>
    </div>
  );
};

window.OfferCard = OfferCard;
window.Testimonials = Testimonials;
window.MasterCard = MasterCard;
window.LiveCounter = LiveCounter;
window.TrustFooter = TrustFooter;
window.LastChanceModal = LastChanceModal;