@font-face{font-family:Montserrat;font-style:italic;font-weight:900;font-display:swap;src:url('assets/montserrat-black-italic.ttf') format('truetype')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:900;font-display:swap;src:url('assets/montserrat-black.ttf') format('truetype')}
:root{color-scheme:dark;--destaque:#6DBD00;--destaque-escuro:#4C8400;--destaque-rgb:109,189,0;--fundo:#050605;--texto:#F5F7F4;--texto-botao:#071000}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow-x:hidden;background:var(--fundo)}
body{color:var(--texto);font-family:Arial,system-ui,sans-serif;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;padding:max(20px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom));position:relative}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(60vmax 60vmax at 50% 42%,rgba(var(--destaque-rgb),.16),transparent 60%),radial-gradient(40vmax 40vmax at 50% 110%,rgba(var(--destaque-rgb),.09),transparent 60%)}
.meio{position:relative;z-index:1;width:100%;max-width:520px;margin:0 auto;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-width:0}
.fase{width:100%;display:flex;flex-direction:column;align-items:center;min-width:0}
[hidden]{display:none!important}
.rolo{width:116px;height:116px;border-radius:50%;position:relative;margin-bottom:28px;background:radial-gradient(circle at 50% 50%,rgba(var(--destaque-rgb),.08) 0 58%,transparent 60%)}
.rolo::before{content:"";position:absolute;inset:0;border-radius:50%;border:3px solid rgba(var(--destaque-rgb),.18)}
.rolo::after{content:"";position:absolute;inset:0;border-radius:50%;border:3px solid transparent;border-top-color:var(--destaque);border-right-color:var(--destaque);animation:girar .9s linear infinite;filter:drop-shadow(0 0 8px rgba(var(--destaque-rgb),.7))}
.rolo span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:italic 900 28px/1 Montserrat,sans-serif;color:var(--destaque);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.rolo small{font-size:15px;font-weight:900;margin-left:2px}
@keyframes girar{to{transform:rotate(360deg)}}
.titulo{font:italic 900 clamp(24px,7vw,34px)/1.05 Montserrat,sans-serif;text-transform:uppercase;letter-spacing:-.01em;max-width:100%}
.titulo em{font-style:italic;color:var(--destaque)}
.barra{width:100%;max-width:360px;height:14px;margin-top:26px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);overflow:hidden;position:relative}
.barra i{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--destaque-escuro),var(--destaque));box-shadow:0 0 14px rgba(var(--destaque-rgb),.6);position:relative;overflow:hidden}
.barra i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0,rgba(255,255,255,.45) 50%,transparent 100%);transform:translateX(-100%);animation:brilho 1.1s ease-in-out infinite}
@keyframes brilho{to{transform:translateX(100%)}}
.pronto{animation:subir .55s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes subir{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
.check{width:64px;height:64px;border-radius:50%;margin-bottom:24px;background:var(--destaque);color:var(--texto-botao);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 10px rgba(var(--destaque-rgb),.12),0 0 30px rgba(var(--destaque-rgb),.55);animation:pop .5s cubic-bezier(.2,.9,.3,1.4) both}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.check svg{width:32px;height:32px}
.cta{margin-top:32px;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:62px;padding:0 16px;border-radius:999px;border:0;cursor:pointer;background:var(--destaque);color:var(--texto-botao);text-decoration:none;font:italic 900 clamp(18px,5.4vw,22px)/1 Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.02em;box-shadow:0 10px 30px rgba(var(--destaque-rgb),.38);animation:pulsar 1.6s ease-in-out infinite;width:100%;max-width:340px;white-space:nowrap;-webkit-tap-highlight-color:transparent}
.cta::before,.cta::after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid var(--destaque);z-index:-1;animation:anel 1.6s ease-out infinite}
.cta::after{animation-delay:.5s}
.cta svg{width:22px;height:22px;flex-shrink:0}
@keyframes pulsar{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
@keyframes anel{0%{inset:0;opacity:.85}100%{inset:-14px;opacity:0}}
.cta:active{transform:scale(.97);animation:none}
.cta:focus-visible{outline:3px solid var(--texto);outline-offset:6px}
.aviso{margin-top:24px;max-width:340px;color:var(--texto);opacity:.7;font:400 14px/1.6 Arial,sans-serif}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}
