/* Zero Esforço — Página de vendas (design refinado) */
:root{
  --emerald:#10b981; --teal:#0d9488; --ink:#0f172a; --mut:#64748b;
}
*{ -webkit-tap-highlight-color: transparent; }
html{ scroll-behavior:smooth; }
body{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#0f172a; background:#ffffff; overflow-x:hidden;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  font-feature-settings:"cv11","ss01"; letter-spacing:-0.011em;
}

/* Gradientes / utilidades de marca */
.grad-text{ background:linear-gradient(90deg,#059669,#0d9488 55%,#0ea5e9); -webkit-background-clip:text; background-clip:text; color:transparent; }
.btn-cta{
  background:linear-gradient(135deg,#10b981,#0d9488);
  box-shadow:0 12px 30px -8px rgba(16,185,129,.55);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.btn-cta:hover{ transform:translateY(-2px) scale(1.01); filter:brightness(1.05); box-shadow:0 18px 40px -10px rgba(16,185,129,.6); }
.btn-cta:active{ transform:scale(.98); }
.btn-pulse{ animation:pulse 2.4s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ box-shadow:0 12px 30px -8px rgba(16,185,129,.5);} 50%{ box-shadow:0 12px 42px -6px rgba(16,185,129,.85);} }

/* Fundo aurora suave */
.aurora-hero{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.aurora-hero::before,.aurora-hero::after{ content:""; position:absolute; border-radius:50%; filter:blur(90px); opacity:.5; }
.aurora-hero::before{ width:520px; height:520px; background:#34d399; top:-160px; right:-120px; }
.aurora-hero::after{ width:560px; height:560px; background:#38bdf8; bottom:-220px; left:-140px; opacity:.4; }

/* Cards */
.card{ background:#fff; border:1px solid #e8edf3; border-radius:1.5rem; box-shadow:0 1px 2px rgba(15,23,42,.04),0 18px 40px -24px rgba(15,23,42,.18); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.card:hover{ transform:translateY(-4px); border-color:#d1fae5; box-shadow:0 1px 2px rgba(15,23,42,.05),0 26px 56px -22px rgba(16,185,129,.30); }

/* Ícone das features */
.feat-ico{ display:grid; place-items:center; width:3rem; height:3rem; border-radius:1rem;
  background:linear-gradient(135deg,#ecfdf5,#d1fae5); color:#059669; box-shadow:inset 0 0 0 1px rgba(16,185,129,.15); }
.card:hover .feat-ico{ background:linear-gradient(135deg,#10b981,#0d9488); color:#fff; }
.feat-ico svg{ width:1.5rem; height:1.5rem; }

/* Reveal on scroll */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.reveal.in{ opacity:1; transform:none; }

/* Float anim do mockup */
.float{ animation:floaty 5s ease-in-out infinite; }
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }

/* FAQ */
.faq-q{ cursor:pointer; }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.faq-item.open .faq-a{ max-height:320px; }
.faq-item.open .faq-chev{ transform:rotate(180deg); }
.faq-chev{ transition:transform .3s ease; }

/* Selo de garantia girando suave (borda tracejada) */
.badge-spin-host{ animation:spin 22s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg);} }
.badge-spin-host > *{ animation:spin 22s linear infinite reverse; }

/* Sticky CTA mobile */
.sticky-cta{ transition:transform .3s ease; }
.sticky-cta.hide{ transform:translateY(120%); }

/* Banner de compra aprovada (upsell) */
.purchase-banner{
  background:linear-gradient(135deg,#059669,#0d9488);
  color:#fff; padding:10px 0; font-size:14px; font-weight:500;
  animation:bannerSlide .5s ease-out;
}
.purchase-banner svg{ stroke:#fff; flex-shrink:0; }
@keyframes bannerSlide{ from{ transform:translateY(-100%); opacity:0; } to{ transform:none; opacity:1; } }

/* Wiapy 1-Click Upsell container */
#wiapy_upsell{ max-width:100% !important; margin:0 auto !important; }
#wiapy_upsell button{
  box-shadow:0 12px 30px -8px rgba(16,185,129,.55);
  animation:pulse 2.4s ease-in-out infinite;
}
#wiapy_upsell a{ text-decoration:underline; text-underline-offset:2px; }

/* Acessibilidade: respeita quem prefere menos movimento */
@media (prefers-reduced-motion: reduce){
  .float,.btn-pulse,.badge-spin-host,.badge-spin-host>*{ animation:none !important; }
  .reveal{ transition:none; opacity:1; transform:none; }
}