/* Pop-ups do site — independentes do tema (prefixo .spx). No celular viram
 * uma folha que sobe da base; no computador, uma janela central. */
.spx{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:24px;font-family:var(--pc-body,"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif);color:#eef1ff}
.spx[hidden]{display:none}
.spx__backdrop{position:absolute;inset:0;background:rgba(5,8,28,.66);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:0;transition:opacity .25s ease}
.spx__box{position:relative;width:min(1020px,100%);max-height:calc(100dvh - 48px);overflow:auto;overscroll-behavior:contain;border-radius:26px;padding:clamp(22px,3.4vw,40px);background:radial-gradient(700px 360px at 100% 0,rgba(108,76,245,.42),transparent 62%),radial-gradient(520px 320px at 0 100%,rgba(20,224,196,.16),transparent 60%),#0b1031;border:1px solid rgba(160,180,255,.18);box-shadow:0 40px 120px -30px rgba(0,0,0,.8);transform:translateY(18px) scale(.98);opacity:0;transition:transform .35s cubic-bezier(.16,1,.3,1),opacity .25s ease;outline:none}
.spx.is-open .spx__backdrop{opacity:1}
.spx.is-open .spx__box{transform:none;opacity:1}
body.spx-open{overflow:hidden}
.spx__close{position:absolute;top:14px;right:14px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;font:400 1.6rem/1 system-ui,sans-serif;cursor:pointer;display:grid;place-items:center;transition:background .2s}
.spx__close:hover{background:rgba(255,255,255,.18)}
.spx__head{max-width:640px;margin-bottom:22px;padding-right:40px}
.spx__eyebrow{margin:0 0 10px;font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#7ff0dc}
.spx__title{margin:0;font:800 clamp(1.5rem,1.1rem + 1.8vw,2.35rem)/1.1 var(--pc-display,"Sora",system-ui,sans-serif);letter-spacing:-.025em;color:#fff;text-wrap:balance}
.spx__lead{margin:12px 0 0;color:rgba(230,234,255,.74);font-size:1rem;line-height:1.55}
.spx__offers{display:grid;grid-template-columns:repeat(var(--spx-cols,3),minmax(0,1fr));gap:14px}
.spx__offers--1{--spx-cols:1}.spx__offers--2{--spx-cols:2}.spx__offers--4{--spx-cols:2}
.spx__offer{position:relative;display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.spx__offer.is-main{background:linear-gradient(160deg,rgba(124,77,255,.28),rgba(59,108,255,.14));border-color:rgba(160,140,255,.45)}
.spx__badge{align-self:flex-start;padding:5px 10px;border-radius:999px;background:linear-gradient(120deg,#7c4dff,#3b6cff);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.spx__offer h3{margin:0;font:700 1.12rem/1.25 var(--pc-display,"Sora",system-ui,sans-serif);color:#fff}
.spx__result{margin:0;padding:9px 12px;border-radius:12px;background:rgba(46,230,197,.12);color:#9ff5e4;font-weight:700;font-size:.92rem;line-height:1.35}
.spx__offer ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.spx__offer li{position:relative;padding-left:22px;font-size:.9rem;line-height:1.4;color:rgba(235,238,255,.86)}
.spx__offer li::before{content:"✓";position:absolute;left:0;top:0;color:#2ee6c5;font-weight:800}
.spx__audience{margin:0;font-size:.8rem;line-height:1.45;color:rgba(220,226,255,.55)}
.spx__cta{margin-top:auto;display:grid;gap:8px;padding-top:6px}
.spx__cta small{font-size:.8rem;color:rgba(230,234,255,.7)}
.spx__btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 16px;border-radius:999px;background:#fff;color:#141833!important;font-weight:800;font-size:.95rem;text-decoration:none;transition:transform .2s,box-shadow .2s}
.spx__offer.is-main .spx__btn{background:linear-gradient(120deg,#7c4dff,#3b6cff);color:#fff!important;box-shadow:0 14px 30px -12px rgba(95,82,226,.9)}
.spx__btn:hover{transform:translateY(-2px)}
.spx__foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0 0;font-size:.9rem}
.spx__foot a{color:#c9d6ff;font-weight:700;text-underline-offset:3px}
.spx__foot span{color:rgba(220,226,255,.45);font-size:.78rem}
.spx--canto{align-items:flex-end;justify-content:flex-end}
.spx--canto .spx__backdrop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;pointer-events:none}
.spx--canto .spx__box{width:min(420px,100%)}
.spx--canto .spx__offers{--spx-cols:1}
@media (min-width:761px) and (max-height:860px){
  .spx__head{margin-bottom:16px}
  .spx__lead{margin-top:8px}
  .spx__offer{padding:16px;gap:8px}
  .spx__audience{display:none}
  .spx__foot{margin-top:14px}
}
@media (max-width:760px){
  .spx{padding:0;align-items:flex-end}
  .spx__box{width:100%;max-height:88dvh;border-radius:24px 24px 0 0;padding:22px 16px calc(18px + env(safe-area-inset-bottom));transform:translateY(100%)}
  .spx.is-open .spx__box{transform:none}
  .spx__box::before{content:"";display:block;width:44px;height:5px;margin:-8px auto 14px;border-radius:5px;background:rgba(255,255,255,.25)}
  .spx__close{top:12px;right:12px}
  .spx__offers{--spx-cols:1!important}
  .spx__offer{padding:16px}
  .spx__offer:not(.is-main) ul,.spx__offer:not(.is-main) .spx__audience{display:none}
  .spx__offer:not(.is-main){gap:8px}
  .spx__offer:not(.is-main) .spx__cta small{display:none}
  .spx__offer:not(.is-main) .spx__btn{min-height:44px;background:rgba(255,255,255,.94)}
}
@media (prefers-reduced-motion:reduce){.spx__box,.spx__backdrop{transition:none}}

/* ===== Formato "pergunta + oferta" (layout quiz) ===== */
.spx--quiz .spx__box{width:min(560px,100%);padding:clamp(22px,3.2vw,34px)}
.spx--quiz .spx__head{margin-bottom:18px}
.spx--quiz .spx__title{font-size:clamp(1.45rem,1.15rem + 1.3vw,2rem)}
.spx__step[hidden]{display:none}
.spx__step.is-active{animation:spx-in .3s cubic-bezier(.16,1,.3,1)}
@keyframes spx-in{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.spx__question{margin:0 0 10px;font-weight:800;font-size:.95rem;color:#fff}
.spx__choices{display:grid;gap:10px}
.spx__choice{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:64px;padding:14px 16px;border-radius:16px;border:1px solid rgba(160,180,255,.22);background:rgba(255,255,255,.06);color:#fff;text-align:left;font:inherit;cursor:pointer;transition:background .2s,border-color .2s,transform .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.spx__choice span{display:grid;gap:3px}
.spx__choice b{font:700 1.02rem/1.25 var(--pc-display,"Sora",system-ui,sans-serif)}
.spx__choice small{font-size:.8rem;color:rgba(220,226,255,.62)}
.spx__choice i{font-style:normal;font-size:1.2rem;color:#7ff0dc;transition:transform .2s}
.spx__choice:hover,.spx__choice:focus-visible{background:linear-gradient(120deg,rgba(124,77,255,.3),rgba(59,108,255,.2));border-color:rgba(160,140,255,.6)}
.spx__choice:hover i{transform:translateX(4px)}
.spx__choice:active{transform:scale(.98)}
.spx__whats-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:#9ff5e4;font-weight:700;font-size:.9rem;text-decoration:none}
.spx__whats-link:hover{text-decoration:underline;text-underline-offset:3px}
.spx__back{display:block;border:0;background:none;color:rgba(220,226,255,.7);font:600 .85rem/1 inherit;padding:6px 0;margin:0 0 12px;cursor:pointer}
.spx__back:hover{color:#fff}
.spx__pitch .spx__badge{margin-bottom:10px;display:inline-block}
.spx__pitch-title{margin:0 0 12px;font:800 clamp(1.4rem,1.1rem + 1.2vw,1.9rem)/1.12 var(--pc-display,"Sora",system-ui,sans-serif);letter-spacing:-.02em;color:#fff;outline:none;padding-right:36px}
.spx__hook{margin:0 0 14px;padding:12px 14px;border-radius:14px;background:rgba(255,186,73,.12);border:1px solid rgba(255,186,73,.28);color:#ffe2a8;font-weight:600;font-size:.92rem;line-height:1.45}
.spx__pitch ul{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:9px}
.spx__pitch li{position:relative;padding-left:24px;font-size:.95rem;line-height:1.4;color:rgba(235,238,255,.9)}
.spx__pitch li::before{content:"✓";position:absolute;left:0;top:0;color:#2ee6c5;font-weight:800}
.spx__actions{display:grid;gap:10px}
.spx__btn--main{background:linear-gradient(120deg,#7c4dff,#3b6cff)!important;color:#fff!important;min-height:54px;font-size:1.02rem;box-shadow:0 16px 34px -14px rgba(95,82,226,.95)}
.spx__btn--whats{background:rgba(37,211,102,.12)!important;color:#7af0a8!important;border:1px solid rgba(37,211,102,.35);min-height:48px}
.spx__btn--whats svg,.spx__whats-link svg{flex:none}
.spx__terms{margin:12px 0 0;text-align:center;font-size:.8rem;color:rgba(220,226,255,.62)}
.spx--quiz .spx__foot{margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
@media (max-width:760px){
  .spx--quiz .spx__box{width:100%}
  .spx__choice{min-height:60px}
  .spx--quiz .spx__lead{font-size:.92rem}
}