@font-face{font-family:"FuturaLocal";src:local("Futura"),local("Futura PT"),local("Futura Std"),local("Futura Md BT"),local("Futura Medium");font-display:swap;}
/* Mega Sorte — padrão tipográfico Futura. Usa a instalação local licenciada quando disponível. */
:root{--ms-font:"FuturaLocal",Futura,"Futura PT","Futura Std","Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;--ms-glass:rgba(255,255,255,.78);--ms-border:rgba(12,66,122,.12)}
html{font-family:var(--ms-font);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body,button,input,select,textarea,a,h1,h2,h3,h4,h5,h6,p,span,strong,small,label,th,td{font-family:var(--ms-font)!important;}
/* Mega Sorte V3.3 Premium — tipografia e renderização */
:root{--ms-font:Futura,"Futura PT","Trebuchet MS",Arial,Helvetica,sans-serif;--ms-glass:rgba(255,255,255,.78);--ms-border:rgba(12,66,122,.12)}
html{font-family:var(--ms-font);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body,button,input,select,textarea{font-family:var(--ms-font)}
/* =========================================================
   MEGA SORTE — Premium Experience V3.2
   Animações voltadas a 60fps: transform + opacity.
   Sem animações de top/left/width/height durante scroll.
========================================================= */
:root{
  --ms-ease-premium:cubic-bezier(.2,.75,.25,1);
  --ms-ease-snappy:cubic-bezier(.22,1,.36,1);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}

/* Barra sutil de progresso de leitura */
#ms-scroll-progress{
  position:fixed;z-index:100000;left:0;top:0;height:3px;width:100%;
  transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,#ff8c0a,#0b66c3,#16a263);
  pointer-events:none;will-change:transform;
}

/* Entrada em viewport */
.ms-reveal{
  opacity:0;
  transform:translate3d(0,18px,0) scale(.992);
  transition:opacity .62s var(--ms-ease-premium),transform .62s var(--ms-ease-premium);
}
.ms-reveal.ms-visible{opacity:1;transform:translate3d(0,0,0) scale(1)}

/* Hero / Steam troca com transição curta */
.v2-feature-card.ms-hero-enter{animation:msHeroEnter .52s var(--ms-ease-snappy) both}
@keyframes msHeroEnter{
  from{opacity:.25;transform:translate3d(10px,0,0) scale(.994)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}

/* Componentes interativos */
.v3-game-card,.passo,.megaflow-point,.v2-info-card,.v3-live-result,.v3-price-section,
.v2-feature-thumbs button,.v2-game-whatsapp,.v2-feature-cta,.v3-result-button,
.duvidas a,.botao-caixa{
  backface-visibility:hidden;
  transform:translateZ(0);
  transition:
    transform .28s var(--ms-ease-premium),
    box-shadow .28s var(--ms-ease-premium),
    border-color .28s ease,
    filter .28s ease,
    opacity .28s ease;
}

.v3-game-art img,.passo img,.megaflow-point b,.v3-result-head img,.v3-live-numbers span{
  transform:translateZ(0);
  transition:transform .32s var(--ms-ease-snappy),filter .32s ease;
}

/* Modal mais fluido */
.v3-result-overlay.aberto{animation:msFadeIn .18s ease-out both}
.v3-result-overlay.aberto .v3-result-modal{animation:msModalIn .34s var(--ms-ease-snappy) both}
#megaflow-cliente-modal.ativo .mf-box{animation:msModalIn .34s var(--ms-ease-snappy) both}
@keyframes msFadeIn{from{opacity:0}to{opacity:1}}
@keyframes msModalIn{from{opacity:0;transform:translate3d(0,12px,0) scale(.975)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}

/* Pulso discreto em resultados atualizados */
.ms-data-updated{animation:msDataPulse .45s var(--ms-ease-snappy)}
@keyframes msDataPulse{0%{transform:scale(.985);opacity:.65}100%{transform:scale(1);opacity:1}}

/* Ticker utiliza apenas transform; hint ao compositor */
.faixa-jogos-trilho{will-change:transform;transform:translate3d(0,0,0)}

/* Melhor custo de renderização abaixo da dobra */
.secao-jogos,.como-funciona,.megaflow-section,.duvidas,.v2-info-section{
  content-visibility:auto;
  contain-intrinsic-size:700px;
}

/* Hover premium somente onde há mouse/trackpad */
@media (hover:hover) and (pointer:fine){
  .v3-game-card:hover,.passo:hover,.megaflow-point:hover,.v2-info-card:hover{
    transform:translate3d(0,-5px,0);
    box-shadow:0 18px 38px rgba(5,38,83,.12);
  }
  .v3-game-card:hover .v3-game-art img,.passo:hover img{transform:scale(1.055) rotate(-1deg)}
  .megaflow-point:hover b{transform:scale(1.08)}
  .v2-feature-thumbs button:hover{transform:translate3d(0,-2px,0)}
  .v2-game-whatsapp:hover,.v2-feature-cta:hover,.duvidas a:hover,.botao-caixa:hover{transform:translate3d(0,-2px,0);filter:brightness(1.04)}
  .v3-result-button:hover{filter:brightness(1.06)}
}

/* Clique tátil */
a:active,button:active{transform:scale(.985)}

/* Indicador de carregamento leve nos botões MegaFlow */
[data-megaflow-busy="1"]{position:relative;overflow:hidden}
[data-megaflow-busy="1"]::after{
  content:"";position:absolute;left:-45%;top:0;width:35%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  animation:msShimmer 1s linear infinite;
}
@keyframes msShimmer{to{transform:translate3d(420%,0,0)}}

/* +Milionária */
.jogo-mais-milionaria .v3-game-art img{filter:drop-shadow(0 8px 16px rgba(0,0,0,.18))}
.trevo-milionaria{white-space:nowrap}

/* Respeita acessibilidade e evita gastar GPU quando usuário prefere menos movimento */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .ms-reveal{opacity:1!important;transform:none!important}
  #ms-scroll-progress{display:none}
}


/* V3.3 — Como funciona premium / preparado para hidratação React */
.ms-how-premium{position:relative;overflow:hidden}
.ms-how-premium::before{content:"";position:absolute;inset:-40% auto auto 58%;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(8,91,180,.10),transparent 68%);pointer-events:none}
.ms-how-heading{position:relative;z-index:1}
.ms-how-grid{position:relative;z-index:1;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px!important}
.ms-how-grid .seta-passo{display:none!important}
.ms-how-step{position:relative;min-height:260px!important;display:flex!important;flex-direction:column;align-items:flex-start!important;text-align:left!important;padding:24px!important;border:1px solid var(--ms-border)!important;border-radius:22px!important;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,250,255,.92))!important;box-shadow:0 12px 32px rgba(5,38,83,.07)!important;overflow:hidden}
.ms-how-step::after{content:"";position:absolute;width:110px;height:110px;right:-28px;bottom:-36px;border-radius:50%;background:linear-gradient(145deg,rgba(7,91,180,.07),rgba(255,151,15,.06));transition:transform .45s var(--ms-ease-premium)}
.ms-how-step .numero-passo{position:absolute!important;top:18px;right:18px!important;left:auto!important;width:34px!important;height:34px!important;box-shadow:0 7px 18px rgba(7,91,180,.22)}
.ms-how-step img{width:48px!important;height:48px!important;object-fit:contain;margin:5px 0 22px!important}
.ms-how-step h3{font-size:18px!important;line-height:1.18;margin-bottom:10px!important;color:#073b78}
.ms-how-step p{font-size:13px!important;line-height:1.55!important;color:#536c86!important;margin:0 0 18px!important}
.ms-how-step small{margin-top:auto;color:#ff8d00;font-size:10px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
@media(hover:hover) and (pointer:fine){.ms-how-step:hover::after{transform:scale(1.25)}.ms-how-step:hover{transform:translate3d(0,-7px,0) perspective(1000px)!important}}
@media(max-width:900px){.ms-how-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.ms-how-grid{grid-template-columns:1fr}.ms-how-step{min-height:220px!important}}

/* V3.3 — Bolão 20+ e probabilidades */
.v3-prob-card{background:linear-gradient(145deg,#fff,#f7fbff)!important}
.v3-prob-highlight{margin-top:14px;padding:13px 14px;border:1px solid rgba(7,91,180,.12);border-radius:12px;background:rgba(7,91,180,.055);color:#355979;font-size:12px;line-height:1.5}
.v3-pool-probability{margin-top:18px;padding:22px;border:1px solid rgba(7,91,180,.14);border-radius:18px;background:linear-gradient(145deg,#f9fbff,#fff);box-shadow:0 12px 28px rgba(5,38,83,.06)}
.v3-pool-prob-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.v3-pool-prob-head h3{margin-top:4px;color:#103d70;font-size:21px}.v3-pool-badge{padding:8px 11px;border-radius:999px;background:#073d82;color:#fff;font-size:11px;font-weight:900;white-space:nowrap}
.v3-pool-explain{margin:13px 0 18px;color:#5b7087;font-size:12px;line-height:1.55}.v3-pool-controls label{display:block;margin-bottom:8px;color:#173f69;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.v3-pool-controls>div{display:grid;grid-template-columns:1fr 74px;gap:12px;align-items:center}.v3-pool-controls input{width:100%;accent-color:#075bb4}.v3-pool-controls output{padding:9px 10px;border-radius:10px;background:#073d82;color:#fff;text-align:center;font-weight:900}
.v3-pool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.v3-pool-grid>div{padding:14px;border:1px solid rgba(7,91,180,.1);border-radius:13px;background:#fff}.v3-pool-grid span{display:block;color:#708195;font-size:10px;font-weight:800;text-transform:uppercase}.v3-pool-grid strong{display:block;margin-top:7px;color:#073d82;font-size:15px}
.v3-pool-presets{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.v3-pool-presets button{border:1px solid #d3dfeb;border-radius:999px;background:#fff;color:#315a80;padding:8px 11px;font-size:11px;font-weight:800;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.v3-pool-presets button:hover{transform:translateY(-2px);border-color:#075bb4;box-shadow:0 6px 14px rgba(7,91,180,.10)}
@media(max-width:680px){.v3-pool-grid{grid-template-columns:1fr}.v3-pool-prob-head{flex-direction:column}.v3-pool-controls>div{grid-template-columns:1fr 64px}}

/* 60/90/120/144Hz: sem timers de animação fixos; requestAnimationFrame acompanha a taxa real do display. */
@media(min-resolution:2dppx){.v3-game-card,.ms-how-step,.megaflow-point{transform:translateZ(0)}}

/* Modo adaptativo para aparelhos com pouca memória/CPU ou economia de dados. */
.ms-lite .ms-how-premium::before{display:none}.ms-lite .v3-game-card,.ms-lite .passo,.ms-lite .megaflow-point{transition-duration:.16s!important}.ms-lite .faixa-jogos-trilho{will-change:auto}

.ms-how-step small{display:none!important}

.passo-acao{width:100%;border:0;font:inherit;text-align:inherit;cursor:pointer}

/* CTA restaurado abaixo do catálogo de jogos */
.v3-games-whatsapp-wrap{display:flex;justify-content:center;padding:26px 0 4px}
.v3-games-whatsapp{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 22px;border:0;border-radius:14px;background:linear-gradient(135deg,#0f9b57,#0b874d);color:#fff;font-family:var(--ms-font)!important;font-size:14px;font-weight:900;cursor:pointer;box-shadow:0 12px 26px rgba(15,155,87,.22);transition:transform .25s var(--ms-ease-premium),box-shadow .25s ease,filter .25s ease}
.v3-games-whatsapp img{width:24px;height:24px;object-fit:contain;filter:brightness(0) invert(1)}
@media(hover:hover) and (pointer:fine){.v3-games-whatsapp:hover{transform:translateY(-3px);box-shadow:0 17px 32px rgba(15,155,87,.27);filter:brightness(1.04)}}
@media(max-width:560px){.v3-games-whatsapp{width:100%;max-width:420px;min-height:54px}}
