/* Popup de voto do Prêmio Reclame AQUI 2026 (Modelo B "Modal grande"), do pacote aprovado da campanha.
   Componente isolado: todas as regras ficam dentro de .ra26-pop. A fonte DM Sans vem do Google Fonts (font_dm_sans). */

.ra26-pop{
  --ra26-dark:#062B0E; --ra26-deep:#03190A; --ra26-lime:#B6F21A;
  --ra26-font:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  position:fixed; inset:0; z-index:2147483000;
  padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);
  font-family:var(--ra26-font); color:#fff; -webkit-font-smoothing:antialiased; line-height:1.5;
}
.ra26-pop[hidden]{display:none!important}
.ra26-pop *,.ra26-pop *::before,.ra26-pop *::after{box-sizing:border-box}
@media (prefers-reduced-motion:no-preference){
  .ra26-pop{animation:ra26-in .28s ease-out}
  .ra26-pop .ra26-card{animation:ra26-up .34s cubic-bezier(.2,.8,.2,1)}
  @keyframes ra26-in{from{opacity:0}to{opacity:1}}
  @keyframes ra26-up{from{opacity:0;margin-top:16px}to{opacity:1;margin-top:0}}
}

/* fundo escurecido: a página continua visível atrás */
.ra26-pop .ra26-bd{position:absolute;inset:0;background:rgba(3,25,10,.74);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

/* card grande centralizado */
.ra26-pop .ra26-card{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(1120px,calc(100% - 80px)); height:min(660px,calc(100% - 80px));
  border-radius:32px; overflow:hidden;
  box-shadow:0 40px 100px rgba(0,0,0,.5),0 0 0 1px rgba(182,242,26,.18);
  background:
    radial-gradient(80% 70% at 85% 110%,rgba(182,242,26,.35),transparent 60%),
    radial-gradient(60% 60% at 0% 0%,rgba(16,90,30,.55),transparent 70%),
    var(--ra26-deep);
}
.ra26-pop .ra26-card:focus{outline:none}
.ra26-pop .ra26-grid{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center}
.ra26-pop .ra26-txt{padding:0 24px 0 64px;display:flex;flex-direction:column;gap:18px}
.ra26-pop .ra26-logo{display:block;width:120px;height:auto}
.ra26-pop .ra26-eb{display:inline-flex;align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ra26-dark);background:var(--ra26-lime);border-radius:999px;padding:6px 12px;line-height:1.2}
/* !important: o CSS das páginas da Momentum força Poppins em todo h2 */
.ra26-pop h2{margin:0;font-family:var(--ra26-font)!important;font-size:52px;font-weight:800;letter-spacing:-.03em;line-height:1.02;color:#fff;text-wrap:balance}
.ra26-pop h2 em{font-style:normal;color:var(--ra26-lime)}
.ra26-pop .ra26-lead{margin:0;font-size:18px;line-height:1.5;color:rgba(255,255,255,.86);max-width:32ch}
.ra26-pop .ra26-act{max-width:400px}
.ra26-pop .ra26-cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;border-radius:999px;background:var(--ra26-lime);color:var(--ra26-dark);font:800 17px var(--ra26-font);text-decoration:none;padding:0 24px;box-shadow:0 10px 28px rgba(182,242,26,.28);transition:transform .15s,filter .2s}
.ra26-pop .ra26-cta:hover{filter:brightness(1.06);transform:translateY(-1px)}
.ra26-pop .ra26-cta svg{width:20px;height:20px;flex:0 0 auto}
.ra26-pop .ra26-later{display:block;margin:12px 0 0;background:none;border:0;color:rgba(255,255,255,.78);font:600 14px var(--ra26-font);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:6px 10px}
.ra26-pop .ra26-later:hover{color:#fff}
.ra26-pop .ra26-meta{margin:10px 0 0;font-size:13px;color:rgba(255,255,255,.7);text-align:left;max-width:400px}

/* arte da mão com o selo, com fade para o lado do texto */
.ra26-pop .ra26-art{position:relative;height:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%);mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
.ra26-pop .ra26-art img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:100% 50%}

/* botão Fechar: branco, com X e texto, sempre no canto superior direito */
.ra26-pop .ra26-x{position:absolute;z-index:5;top:20px;right:20px;height:50px;padding:0 18px 0 14px;display:flex;align-items:center;gap:8px;border:0;border-radius:999px;background:#fff;color:var(--ra26-dark);font:800 15px var(--ra26-font);cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 0 4px rgba(255,255,255,.18)}
.ra26-pop .ra26-x svg{width:22px;height:22px}
.ra26-pop .ra26-x:hover{background:var(--ra26-lime)}
.ra26-pop .ra26-x:focus-visible,.ra26-pop .ra26-cta:focus-visible,.ra26-pop .ra26-later:focus-visible{outline:3px solid var(--ra26-lime);outline-offset:3px}

/* celular: modal centralizado quase na largura toda, arte em cima */
@media (max-width:640px){
  .ra26-pop .ra26-card{width:calc(100% - 24px);height:auto;max-height:calc(100% - 24px);overflow:auto;border-radius:24px}
  .ra26-pop .ra26-card:focus{outline:none}
.ra26-pop .ra26-grid{position:relative;inset:auto;grid-template-columns:1fr;align-items:start}
  .ra26-pop .ra26-art{order:-1;height:220px;-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)}
  .ra26-pop .ra26-art img{object-position:100% 40%;transform:scale(2);transform-origin:100% 42%}
  .ra26-pop .ra26-txt{padding:0 20px 22px;gap:12px}
  .ra26-pop .ra26-logo{display:none}
  .ra26-pop h2{font-size:29px}
  .ra26-pop .ra26-lead{font-size:15px}
  .ra26-pop .ra26-act{max-width:none}
  .ra26-pop .ra26-later{margin:12px auto 0}
  .ra26-pop .ra26-meta{text-align:center;max-width:none}
  .ra26-pop .ra26-x{top:12px;right:12px;height:44px;padding:0 14px 0 10px;font-size:14px}
}

/* trava a rolagem do site enquanto o popup está aberto */
html.ra26-lock,html.ra26-lock body{overflow:hidden!important}
