/* Estilo do site do Se Vira! (fonte Poppins local, OFL). Editar aqui. */
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/poppins-latin-300-normal.woff2) format('woff2')}@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/poppins-latin-400-normal.woff2) format('woff2')}@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/poppins-latin-500-normal.woff2) format('woff2')}@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/poppins-latin-600-normal.woff2) format('woff2')}@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/poppins-latin-700-normal.woff2) format('woff2')}@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/poppins-latin-800-normal.woff2) format('woff2')}@font-face{font-family:'Poppins';font-style:normal;font-weight:900;font-display:swap;src:url(/fonts/poppins-latin-900-normal.woff2) format('woff2')}
:root{--t-xl:clamp(64px,11.5vw,150px);--t-l:clamp(40px,6.4vw,84px);--t-m:clamp(30px,4vw,52px);--t-s:clamp(20px,1.8vw,24px);--t-lede:clamp(18px,1.6vw,21px);--t-body:clamp(16px,1.2vw,17px);--t-sm:14px;--t-lab:12px}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.18s}
/* Se Vira! · site. Mesa preta do jogo, Poppins, cartas iguais às do app, dourado só no Pro.
   Escala: --k multiplica as medidas da carta do app (250×350 px). */
:root{
  --bg:#000; --fg:#f2f2f2; --text:#d4d4d4; --muted:#8a8a8a; --line:#262626; --card:#121212; --raise:#0c0c0c;
  --gold:#D9C3A0; --gold-line:#3e3424; --gold-deep:#110f0b; --gold-text:#d8cfbf;
  --brown:#8A5A3C; --wine:#9E2A3F; --sand:#D9C3A0; --olive:#6E7148; --caramel:#C4974F;
  --ui:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.32,.72,0,1); --out:cubic-bezier(.22,.8,.3,1);
  --gut:max(20px,env(safe-area-inset-left,0px));
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{background:var(--bg);overscroll-behavior:none;touch-action:pan-x pan-y}
html{scroll-padding-top:90px}
body{margin:0;color:var(--fg);font-family:var(--ui);font-size:var(--t-body);line-height:1.6;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--bg)}
a{color:inherit}
a,button{-webkit-tap-highlight-color:transparent}
img{max-width:100%;display:block}
p{margin:0}
:focus-visible{outline:2px solid var(--fg);outline-offset:3px;border-radius:6px}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- cabeçalho ---------- */
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:18px;position:sticky;top:env(safe-area-inset-top,0px);z-index:31;background:rgba(0,0,0,.94);box-shadow:0 0 0 100vmax rgba(0,0,0,.94);clip-path:inset(0 -100vmax)}
.logo{display:flex;align-items:center;gap:10px;font-size:19px;letter-spacing:-.03em;text-decoration:none}
.logo .wm{font-weight:300;white-space:nowrap}.logo .wm b{font-weight:800}
.logo svg{width:54px;height:35px;overflow:visible;margin:-4px -12px -4px -10px}
.nav nav{display:flex;align-items:center;gap:28px;font-size:15px;color:var(--muted)}
.nav nav a{text-decoration:none;transition:color .2s}
.nav nav a[aria-current="page"]{color:var(--fg)}
.nav .nav-cta{color:var(--bg);background:var(--fg);border-radius:999px;padding:9px 18px;font-weight:600;font-size:14px}
@media (hover:hover) and (pointer:fine){.nav nav a:not(.nav-cta):hover{color:var(--fg)}}
.menu-btn{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--fg);cursor:pointer;position:relative;z-index:32;flex:none}
.menu-btn span{position:absolute;left:13px;right:13px;top:21px;height:1.6px;background:currentColor;border-radius:2px;transition:transform .3s var(--ease)}
.menu-btn span:first-child{transform:translateY(-4px)}
.menu-btn span:last-child{transform:translateY(4px)}
.menu-btn[aria-expanded="true"] span:first-child{transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] span:last-child{transform:rotate(-45deg)}
.m-only,.m-home{display:none!important}

/* ---------- tipografia ---------- */
.kick{font-size:var(--t-lab);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0 0 18px;display:flex;align-items:center;gap:9px}
.kick svg{width:16px;height:12px;color:var(--gold)}
.kick i{width:7px;height:7px;border-radius:50%;background:var(--caramel);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}
h1,h2,h3{margin:0;text-wrap:balance}
.h-xl{word-spacing:.06em;font-weight:900;font-size:var(--t-xl);line-height:.88;letter-spacing:-.055em}
.h-l{word-spacing:.06em;font-weight:900;font-size:var(--t-l);line-height:.95;letter-spacing:-.045em}
.h-m{word-spacing:.05em;font-weight:800;font-size:var(--t-m);line-height:1;letter-spacing:-.04em}
h3{font-weight:800;font-size:var(--t-s);line-height:1.25;letter-spacing:-.015em}
.lede{font-size:var(--t-lede);line-height:1.55;color:var(--text);max-width:46ch;margin-top:22px}
.body{color:var(--text);max-width:52ch}
.micro{font-size:var(--t-sm);color:var(--muted)}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 17px var(--ui);border-radius:999px;min-height:60px;padding:0 30px;text-decoration:none;border:1px solid var(--fg);background:none;color:var(--fg);cursor:pointer;transition:transform .14s var(--ease),background .2s,box-shadow .2s}
.btn:active{transform:scale(.96)}
.btn.primary{background:var(--fg);color:var(--bg)}
.btn.gold{border-color:var(--gold-line);background:linear-gradient(180deg,#1e1a14,var(--gold-deep));box-shadow:0 0 0 1px #4a3e2a inset,0 0 50px -14px rgba(217,195,160,.3)}
.btn.gold svg{color:var(--gold)}
.btn svg{width:20px;height:20px;flex:none}
@media (hover:hover) and (pointer:fine){.btn.primary:hover{box-shadow:0 0 0 6px rgba(242,242,242,.12)}.btn.gold:hover{box-shadow:0 0 0 1px #6b5a3c inset,0 0 60px -10px rgba(217,195,160,.4)}}
.cta{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:36px}
.cta.center{align-items:center}

/* ---------- carta do jogo (cópia da .pc do app) ---------- */
.gc{--k:1;position:relative;width:calc(250px*var(--k));aspect-ratio:5/7;border-radius:calc(36px*var(--k));padding:calc(38px*var(--k)) calc(22px*var(--k));background:linear-gradient(180deg,#191919,#101010);box-shadow:0 0 0 1px #2a2a2a,0 calc(30px*var(--k)) calc(60px*var(--k)) calc(-20px*var(--k)) rgba(0,0,0,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(10px*var(--k));text-align:center;flex:none}
.gc::after{content:"";position:absolute;inset:calc(9px*var(--k));border:1px solid #232323;border-radius:calc(28px*var(--k));pointer-events:none}
.gc .pw{font-weight:300;line-height:1.08;letter-spacing:-.02em;font-size:calc(34px*var(--k));text-wrap:balance}
.gc .pw.long{font-size:calc(28px*var(--k))}
.gc .pcat{font-size:calc(10px*var(--k));font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.gc .ix{position:absolute;top:calc(24px*var(--k));left:calc(26px*var(--k));display:flex;flex-direction:column;align-items:center;gap:calc(6px*var(--k));font-weight:600;font-size:calc(14px*var(--k));color:var(--muted);font-variant-numeric:tabular-nums}
.gc .ix i{width:calc(6px*var(--k));height:calc(6px*var(--k));border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}
.gc .ix.b{top:auto;left:auto;bottom:calc(24px*var(--k));right:calc(26px*var(--k));transform:rotate(180deg)}
.gc.back{box-shadow:0 0 0 1px #222}
.gc.back>*{opacity:.3}
.gc.hit{background:color-mix(in srgb,var(--tc,#C4974F) 30%,#121212)}
.gc.hit .pcat{opacity:0}
.gc .okm{position:absolute;left:50%;top:50%;width:calc(58px*var(--k));height:calc(58px*var(--k));margin:calc(-122px*var(--k)) 0 0 calc(-29px*var(--k));border-radius:50%;display:grid;place-items:center;background:var(--tc,#C4974F);color:#141414;z-index:2}
.gc .okm svg{width:calc(30px*var(--k));height:calc(30px*var(--k))}
.gc.gift{background:linear-gradient(180deg,#1e1a14,#110f0b);box-shadow:0 0 0 1px #5e4f35,0 0 40px -12px rgba(217,195,160,.25),0 calc(30px*var(--k)) calc(60px*var(--k)) calc(-20px*var(--k)) rgba(0,0,0,.9)}
.gc.gift::after{border-color:var(--gold-line)}
.gc .gcrown{width:calc(26px*var(--k));height:calc(19px*var(--k));color:var(--gold)}
.gc .gcrown svg{width:100%;height:100%;display:block}
.gc.gift .pcat{color:var(--gold);letter-spacing:.12em;white-space:nowrap}
.gc.custom .pin{position:absolute;top:calc(22px*var(--k));right:calc(24px*var(--k));width:calc(18px*var(--k));height:calc(18px*var(--k));color:var(--gold)}

/* ---------- celular ---------- */
.phone{--pw:300px;position:relative;width:var(--pw);aspect-ratio:390/844;border-radius:calc(var(--pw)*.16);padding:calc(var(--pw)*.032);background:linear-gradient(160deg,#2a2a2a,#0c0c0c 40%,#151515);box-shadow:0 0 0 1px #333 inset,0 0 0 1px #000,0 50px 100px -30px rgba(0,0,0,.95),0 0 120px -40px rgba(255,255,255,.08);flex:none}
.phone .scr{position:relative;width:100%;height:100%;border-radius:calc(var(--pw)*.13);overflow:hidden;background:#000}
.phone .scr img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:opacity .45s var(--ease)}
.phone .scr::before{content:"";position:absolute;top:calc(var(--pw)*.03);left:50%;width:calc(var(--pw)*.3);height:calc(var(--pw)*.085);margin-left:calc(var(--pw)*-.15);border-radius:999px;background:#000;z-index:2}

/* ---------- seções ---------- */
section{padding-block:clamp(80px,11vw,150px)}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,6vw,96px);align-items:center}
.split.rev{grid-template-columns:.95fr 1.05fr}
.split>*{min-width:0}
.stagec{position:relative;display:grid;place-items:center;min-height:560px}

/* início: topo */
.hero{padding-block:clamp(36px,6vw,80px) clamp(70px,9vw,120px)}
.hero .h-xl{white-space:nowrap}
.hero .lede{font-size:var(--t-lede);max-width:24ch;text-wrap:pretty;color:var(--fg);font-weight:400}
.hero .stagec .phone{--pw:clamp(250px,24vw,310px);z-index:2}
.hero .stagec .gc{position:absolute;--k:.86}
.hero .gc.c-l{transform:translate(-62%,4%) rotate(-12deg)}
.hero .gc.c-r{transform:translate(62%,6%) rotate(12deg)}
.hero .gc.c-hit{--k:.62;z-index:3;transform:translate(-120%,58%) rotate(-7deg)}
@media (prefers-reduced-motion:no-preference){
  .hero .stagec .phone{animation:rise .9s var(--out) backwards}
  .hero .gc.c-l{animation:dealL .9s .12s var(--out) backwards}
  .hero .gc.c-r{animation:dealR .9s .18s var(--out) backwards}
  .hero .gc.c-hit{animation:pop .7s .7s cubic-bezier(.34,1.5,.5,1) backwards}
  @keyframes rise{from{opacity:0;transform:translateY(40px)}}
  @keyframes dealL{from{opacity:0;transform:translate(-50%,10%) rotate(0)}}
  @keyframes dealR{from{opacity:0;transform:translate(-50%,10%) rotate(0)}}
  @keyframes pop{from{opacity:0;transform:translate(-120%,70%) rotate(-7deg) scale(.6)}}
}

/* faixa de palavras */
.band{padding-block:28px;border-block:1px solid var(--line);overflow:hidden;position:relative}
.band::before,.band::after{content:"";position:absolute;top:0;bottom:0;width:12vw;z-index:2;pointer-events:none}
.band::before{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.band::after{right:0;background:linear-gradient(-90deg,var(--bg),transparent)}
.mq{display:flex;width:max-content;gap:0;animation:mq 60s linear infinite}
.mq.r2{animation-direction:reverse;animation-duration:75s;margin-top:10px}
.mq span{display:inline-flex;align-items:center;gap:22px;padding-right:22px;font-weight:300;font-size:clamp(28px,3.4vw,44px);letter-spacing:-.025em;white-space:nowrap}
.mq.r2 span{color:var(--muted)}
.mq span i{width:9px;height:9px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28)}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mq{animation:none}}

/* cena */
.scene .stagec .phone{--pw:clamp(250px,24vw,300px)}

/* grátis: a cartela em leque */
.wheel{--R:1500px;--step:9.5deg;--k:.86;--p:0;position:relative;margin-inline:calc(50% - 50vw);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);height:calc(350px*var(--k) + 170px);margin-top:clamp(28px,4vw,56px);margin-bottom:0}
.wheel .gc{position:absolute;left:50%;top:10px;--k:inherit;transform-origin:50% var(--R);transform:translateX(-50%) rotate(calc(var(--i)*var(--step) + var(--p)*var(--step)*8));will-change:transform}
.free-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);align-items:end}
.free-head .lede{margin-top:0}

/* bloco dourado do Pro */
.gold-box{position:relative;border-radius:36px;padding:clamp(28px,5vw,72px);background:radial-gradient(120% 80% at 70% 0%,#2a2216 0%,#15120d 45%,#0a0907 100%);overflow:hidden}
.gold-box::after{content:"";position:absolute;inset:9px;border:1px solid var(--gold-line);border-radius:28px;pointer-events:none}
.gold-box>*{position:relative;z-index:1}
.gold-box .kick{color:var(--gold)}
.gold-box .lede,.gold-box .body{color:var(--gold-text)}
.gold-box .stagec{min-height:520px}
.gold-box .phone{--pw:clamp(240px,22vw,280px)}
.gold-box .stagec .gc{position:absolute;--k:.6;transform:translate(78%,52%) rotate(8deg);z-index:3}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.chip{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--line);font-size:var(--t-sm)}
.chip svg{width:14px;height:10px;color:var(--gold)}
.gold-box .chip{border-color:var(--gold-line);color:#e6dccb}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:34px}
.row p{font-size:var(--t-sm);color:var(--gold-text)}

/* fechamento */
.end{text-align:center;position:relative;overflow:hidden}
.end .h-xl{font-size:var(--t-xl)}
.end .cards{display:flex;justify-content:center;margin-bottom:clamp(28px,4vw,48px);height:clamp(150px,16vw,210px)}
.end .cards .gc{--k:.56;margin-inline:-26px}
.end .cards .gc:nth-child(1){transform:rotate(-10deg) translateY(10px)}
.end .cards .gc:nth-child(2){z-index:2}
.end .cards .gc:nth-child(3){transform:rotate(10deg) translateY(10px)}

/* rodapé */
footer{border-top:1px solid var(--line);padding-block:40px 48px;display:grid;grid-template-columns:1fr auto;gap:24px 40px;align-items:start;font-size:var(--t-sm);color:var(--muted)}
footer .logo{color:var(--fg)}
footer .fnote{margin-top:10px}
footer nav{display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:flex-end}
footer a{text-decoration:none}
@media (hover:hover) and (pointer:fine){footer a:hover{color:var(--fg)}}
footer .fmail{grid-column:2;justify-self:end;color:var(--text)}

/* ---------- páginas internas ---------- */
.page-head{padding-block:clamp(40px,6vw,80px) clamp(40px,5vw,64px)}

/* como jogar: passos com o celular grudado */
.walk{margin-top:clamp(20px,4vw,48px)}
.steps{list-style:none;margin:0;padding:0;counter-reset:st;border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:72px minmax(0,1fr) minmax(0,1.3fr);gap:clamp(16px,3vw,48px);align-items:baseline;padding-block:clamp(28px,3.4vw,44px);border-bottom:1px solid var(--line);counter-increment:st}
.step::before{content:counter(st);width:48px;height:48px;border-radius:50%;background:var(--fg);color:var(--bg);display:grid;place-items:center;font-weight:800;font-size:18px;align-self:start}
.step h3{font-size:var(--t-m);font-weight:800;letter-spacing:-.035em;line-height:1.05;word-spacing:.05em}
.step p{color:var(--text);max-width:52ch;margin:0}

.vals{display:flex;justify-content:center;gap:clamp(12px,3vw,40px);flex-wrap:wrap;margin-top:56px}
.vals figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:18px}
.vals .gc{--k:.84}
.vals figcaption{font-weight:600;font-size:var(--t-sm);color:var(--text);display:flex;align-items:center;gap:8px}
.vals figcaption i{width:8px;height:8px;border-radius:50%}
.note{margin-top:28px;color:var(--muted);font-size:var(--t-sm);max-width:62ch}
.center-head{text-align:center;display:flex;flex-direction:column;align-items:center}
.center-head .lede{margin-inline:auto}

.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.rule{background:var(--card);border-radius:28px;padding:30px;display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden}
.rule::after{content:"";position:absolute;inset:7px;border:1px solid #1f1f1f;border-radius:22px;pointer-events:none}
.rule .big{font-weight:900;font-size:var(--t-m);line-height:1;letter-spacing:-.05em;margin-bottom:8px}
.rule p{color:var(--text);font-size:var(--t-body)}
.rule.x2{background:color-mix(in srgb,var(--wine) 26%,#121212)}
.rule.x2 .big{color:#f0c9cf}

/* pro */
.perks{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.perks li{border:1px solid var(--gold-line);border-radius:22px;padding:22px 24px;background:rgba(0,0,0,.22);display:flex;flex-direction:column;gap:6px}
.perks b{font-weight:800;font-size:var(--t-s);line-height:1;letter-spacing:-.035em;color:var(--gold)}
.perks p{color:var(--gold-text);font-size:var(--t-body)}
.perks a{color:var(--gold)}
.packs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:44px}
.ptile{font:inherit;color:var(--fg);text-align:left;cursor:pointer;border:0;background:linear-gradient(180deg,#1b1711,#0e0c09);box-shadow:0 0 0 1px var(--gold-line) inset;border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:10px;min-height:190px;transition:transform .14s var(--ease),box-shadow .25s}
.ptile:active{transform:scale(.98)}
@media (hover:hover) and (pointer:fine){.ptile:hover{box-shadow:0 0 0 1px #6b5a3c inset,0 0 50px -14px rgba(217,195,160,.35);transform:translateY(-3px)}}
.ptop{display:flex;justify-content:space-between;align-items:center;gap:10px}
.pn{font-weight:800;font-size:var(--t-s);letter-spacing:-.01em;line-height:1.2}
.ptop svg{width:16px;height:12px;color:var(--gold);flex:none}
.pd{color:#cfc6b6;font-size:var(--t-sm);line-height:1.5;flex:1}
.pf{display:flex;justify-content:space-between;align-items:center;font-size:var(--t-sm);color:var(--gold)}
.pf .see{border:1px solid var(--gold-line);border-radius:999px;padding:6px 13px;color:var(--fg);font-weight:500}
.before{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}

/* folha do pacote (igual ao app) */
dialog.sheet{border:0;padding:0;margin:0;max-width:none;max-height:none;width:100%;height:100%;background:transparent;color:var(--fg)}
dialog.sheet::backdrop{background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sh-in{position:relative;margin:0 auto;height:100%;max-width:480px;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(56px + env(safe-area-inset-top,0px)) 22px calc(24px + env(safe-area-inset-bottom,0px));background:radial-gradient(130% 55% at 50% 0%,#2a2216 0%,#15120d 42%,#0a0907 100%)}
@media (min-width:600px){dialog.sheet{display:grid;place-items:center}.sh-in{height:auto;max-height:calc(100% - 48px);border-radius:32px;box-shadow:0 0 0 1px var(--gold-line),0 40px 120px -20px #000;padding:56px 32px 28px}}
dialog.sheet[open] .sh-in{animation:sheetIn .4s var(--ease)}
@keyframes sheetIn{from{opacity:0;transform:translateY(28px)}}
.sh-x{position:absolute;top:calc(10px + env(safe-area-inset-top,0px));right:10px;width:44px;height:44px;border:0;background:none;color:var(--muted);cursor:pointer;display:grid;place-items:center}
.sh-x svg{width:22px;height:22px}
.demo{position:relative;width:100%;height:210px;flex:none;pointer-events:none}
.dc{position:absolute;left:50%;top:50%;width:138px;height:190px;margin:-95px 0 0 -69px;border-radius:22px;background:linear-gradient(180deg,#1e1a14,#110f0b);box-shadow:0 0 0 1px var(--gold-line),0 24px 50px -20px #000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px;text-align:center}
.dc::after{content:"";position:absolute;inset:7px;border:1px solid var(--gold-line);border-radius:16px;pointer-events:none}
.dc.c{z-index:3}
.dc.l{transform:translateX(-50%) rotate(-10deg) scale(.88)}
.dc.r{transform:translateX(50%) rotate(10deg) scale(.88)}
.dc.l>*,.dc.r>*{opacity:.35}
.dc .dcat{font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.dc .dw{font-weight:300;font-size:21px;line-height:1.1;letter-spacing:-.02em;text-wrap:balance;transition:opacity .26s var(--ease)}
.dc .dw.long{font-size:18px}.dc .dw.xlong{font-size:15px}
.sheet.swap .dc .dw{opacity:0}
.sh-t{margin:22px 0 0;font-weight:300;font-size:30px;line-height:1.05;letter-spacing:-.03em}
.sh-t b{font-weight:900}
.sh-s{color:#bdb3a2;font-size:14px;margin-top:8px;max-width:32ch}
.buy{width:100%;max-width:360px;margin-top:22px;background:rgba(20,17,12,.9);border:1px solid var(--gold-line);border-radius:24px;padding:18px 18px 16px;text-align:left}
.buy-top{display:flex;align-items:baseline;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--gold-line)}
.buy-top b{font-size:28px;font-weight:900;letter-spacing:-.03em}
.buy-top span{font-size:13px;color:var(--gold);font-weight:600}
.buy-list{list-style:none;margin:12px 0 16px;padding:0;display:flex;flex-direction:column;gap:9px}
.buy-list li{display:flex;align-items:center;gap:10px;font-size:14px;color:#ddd5c6;line-height:1.3}
.buy-list svg{width:15px;height:15px;flex:none;color:var(--gold)}
.btn.sh-buy{width:100%;background:var(--gold);color:#17120a;border-color:var(--gold);font-weight:700;min-height:52px;font-size:16px}
.sh-later{margin-top:12px;color:var(--fg);font:600 15px var(--ui);padding:8px 14px;background:none;border:0;cursor:pointer}
.sh-foot{margin-top:4px;font-size:12px;color:var(--muted);max-width:34ch}

/* suporte */
.help{display:grid;grid-template-columns:1fr 360px;gap:clamp(32px,5vw,72px);align-items:start}
.help>*{min-width:0}
.faq{display:flex;flex-direction:column;gap:10px}
.faq h2{font-size:var(--t-s);font-weight:800;letter-spacing:-.03em;margin:36px 0 8px}
.faq h2:first-child{margin-top:0}
.faq details{background:var(--card);border-radius:22px;padding:0 24px;transition:background .2s}
.faq details[open]{background:#161616}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font-weight:500;font-size:var(--t-body)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:10px;height:10px;border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);transform:rotate(45deg);flex:none;margin-top:-5px;transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:5px}
.faq details>div{padding:0 0 24px;color:var(--text);max-width:60ch}
.contact-card{position:sticky;top:110px;background:var(--card);border-radius:28px;padding:30px;display:flex;flex-direction:column;gap:14px}
.contact-card::after{content:"";position:absolute;inset:7px;border:1px solid #1f1f1f;border-radius:22px;pointer-events:none}
.contact-card>*{position:relative;z-index:1}
.mail{font-weight:800;font-size:var(--t-s);letter-spacing:-.015em;word-break:break-all;user-select:all;-webkit-user-select:all}
.copy{font:600 15px var(--ui);color:var(--bg);background:var(--fg);border:0;border-radius:999px;height:48px;padding:0 22px;cursor:pointer;align-self:flex-start}
.contact-card .links{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding-top:16px;border-top:1px solid var(--line);font-size:var(--t-sm)}
.contact-card .links a{text-decoration:none;color:var(--text)}

/* privacidade */
.prose{max-width:68ch;display:flex;flex-direction:column;gap:44px}
.prose section{padding:0;display:flex;flex-direction:column;gap:12px}
.prose h2{font-size:var(--t-s);font-weight:800;letter-spacing:-.03em}
.prose p{color:var(--text)}
.prose a{color:var(--fg)}
.date{color:var(--muted);font-size:var(--t-sm);margin-top:20px}
.tldr{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}

/* ---------- celular ---------- */
@media (max-width:900px){
  .split,.split.rev,.free-head,.walk,.help{grid-template-columns:1fr}
  .packs{grid-template-columns:1fr 1fr}
  .rules,.before{grid-template-columns:1fr}
  .stagec{min-height:0;padding-block:20px 40px}
  .hero{padding-top:8px}
  .hero .h-xl,.end .h-xl{font-size:clamp(60px,18vw,84px)}
  .hero .gc.c-hit{transform:translate(-112%,62%) rotate(-7deg)}
  .step{grid-template-columns:48px minmax(0,1fr);row-gap:10px}
  .step p{grid-column:2}
  .contact-card{position:static}
  .perks{grid-template-columns:1fr}
  .gold-box .stagec{min-height:0}
  footer{grid-template-columns:1fr}
  footer nav{justify-content:flex-start}
  footer .fmail{grid-column:1;justify-self:start}
}
@media (max-width:820px){
  .menu-btn{display:block}
  .nav{-webkit-backdrop-filter:none;backdrop-filter:none;clip-path:none;box-shadow:none;background:var(--bg)}
  .nav .logo{position:relative;z-index:32}
  .nav nav{position:fixed;inset:0;z-index:30;background:var(--bg);flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;padding:calc(96px + env(safe-area-inset-top,0px)) max(24px,env(safe-area-inset-right,0px)) calc(40px + env(safe-area-inset-bottom,0px)) max(24px,env(safe-area-inset-left,0px));font-size:clamp(36px,11vw,48px);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:var(--fg);opacity:0;visibility:hidden;transition:opacity .22s var(--ease),visibility 0s .22s}
  .nav.open nav{opacity:1;visibility:visible;transition:opacity .22s var(--ease)}
  .nav nav a{color:var(--fg);padding:6px 0;transform:translateY(14px);transition:transform .45s var(--ease)}
  .nav nav a[aria-current="page"]{color:var(--muted)}
  .nav.open nav a{transform:none}
  .nav nav .nav-cta{display:none}
  .nav nav .m-home{display:inline-flex!important}
  .nav nav .m-only{display:inline-flex!important;margin-top:32px;font-size:16px;letter-spacing:0;line-height:1;padding:0 26px}
  .nav nav .m-small{min-height:52px;align-items:center;padding:6px 32px 6px 0;margin-top:10px;font-size:22px;font-weight:600;letter-spacing:-.01em;color:var(--muted)}
  body.menu-open{overflow:hidden}
}
@media (max-width:520px){
  .packs{grid-template-columns:1fr}
  .ptile{min-height:0}
  .hero .stagec .gc{--k:.66}
  .hero .gc.c-l{transform:translate(-55%,4%) rotate(-12deg)}
  .hero .gc.c-r{transform:translate(55%,6%) rotate(12deg)}
  .hero .gc.c-hit{--k:.5;transform:translate(-82%,72%) rotate(-7deg)}
  .vals .gc{--k:.5}
  .vals{gap:8px}
  .wheel{--R:700px;--step:12.5deg;--k:.52;margin-top:24px;margin-bottom:44px;height:calc(350px*var(--k) + 40px);-webkit-mask-image:none;mask-image:none}
  .end .cards .gc{--k:.46}
  .gold-box{border-radius:28px}
  .gold-box::after{border-radius:21px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

html,body{overflow-x:clip}
@media (max-width:1100px) and (min-width:521px){.wheel{--k:.72;--R:1100px;--step:10deg}}
@media (max-width:520px){.gold-box .stagec .gc{transform:translate(42%,46%) rotate(8deg)}}

/* pilhas de cartas (no lugar dos celulares) */
.pile{position:relative;height:clamp(440px,42vw,560px);display:grid;place-items:center}
.pile .gc{position:absolute;--k:1}
.p-hero .p1{transform:translate(-30%,2%) rotate(-13deg)}
.p-hero .p2{transform:translate(30%,4%) rotate(11deg)}
.p-hero .p3{--k:1.18;transform:rotate(-3deg);z-index:2}
.p-play .p1{transform:translate(-6%,5%) rotate(-7deg)}
.p-play .p2{transform:translate(5%,2.5%) rotate(5deg)}
.p-play .p3{transform:rotate(-1deg) translateY(-2%);z-index:2}
.p-fan .gc{--k:.7;transform-origin:50% 115%}
.p-fan .p1{transform:translateX(-72%) translateY(6%) rotate(-11deg)}
.p-fan .p2{transform:translateY(-3%);z-index:3}
.p-fan .p3{transform:translateX(72%) translateY(6%) rotate(11deg)}
@media (prefers-reduced-motion:no-preference){
  .p-hero .p1{animation:pdeal .9s .1s var(--out) backwards}
  .p-hero .p2{animation:pdeal .9s .16s var(--out) backwards}
  .p-hero .p3{animation:ppop .8s .4s cubic-bezier(.34,1.4,.5,1) backwards}
  @keyframes pdeal{from{opacity:0;transform:translateY(30px) rotate(0)}}
  @keyframes ppop{from{opacity:0;transform:translateY(50px) scale(.92) rotate(0)}}
}
@media (hover:hover) and (pointer:fine){.p-fan .gc{transition:translate .3s var(--ease)}.p-fan .gc:hover{translate:0 -14px;z-index:5}}
@media (max-width:900px){.pile{height:auto;min-height:420px;padding-block:20px 40px}}
@media (max-width:520px){.pile{min-height:360px}.pile .gc{--k:.78}.p-hero .p3{--k:.84}.p-fan .gc{--k:.54}}
@media (max-width:520px){section{padding-block:52px}section+section{padding-top:12px}.hero{padding-bottom:36px}.p-fan{min-height:0;height:250px;padding-block:0;margin-top:-84px;position:relative;z-index:2}.gold-box .p-fan{margin-bottom:-12px}}

.gc .nw{white-space:nowrap}
@media (max-width:520px){.p-fan .p1{transform:translateX(-64%) translateY(6%) rotate(-11deg)}.p-fan .p3{transform:translateX(64%) translateY(6%) rotate(11deg)}}
.scene .h-l{max-width:14ch}
.scene .lede{max-width:46ch;margin-top:clamp(20px,2.4vw,32px)}
.gold-box.solo>div{max-width:720px}

/* baralho que dá pra passar, igual ao app */
.deck{display:flex;flex-direction:column;align-items:center;gap:18px}
.dk-stage{position:relative;width:calc(250px*var(--dk));height:calc(350px*var(--dk) + 40px);--dk:1.12;display:grid;place-items:center}
.dk-stage .gc{--k:var(--dk);position:absolute;transition:transform .32s var(--out),background .15s}
.dk-stage .gc>*{transition:opacity .25s}
.dk-stage .l0{z-index:3;transform:rotate(-1.5deg);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.dk-stage .l0:active{cursor:grabbing}
.dk-stage .l1{z-index:2;transform:translate(6%,3%) rotate(5deg)}
.dk-stage .l2{z-index:1;transform:translate(-6%,4%) rotate(-6deg)}
.dk-stage .gc.enter{transition:none;transform:translate(-6%,4%) rotate(-6deg) scale(.94)}
.dk-stage .gc .okm{opacity:0;transform:scale(.5);transition:opacity .12s,transform .22s cubic-bezier(.34,1.5,.5,1)}
.dk-stage .gc.hit{background:color-mix(in srgb,#C4974F 30%,#121212)}
.dk-stage .gc.hit .okm{opacity:1;transform:none}
.dk-stage .gc.fly-up{z-index:4;transition:transform .45s cubic-bezier(.55,0,.8,.2);transform:translateY(calc(-100vh - 100%)) rotate(-3deg)}
.dk-stage .gc.leaving{z-index:0;transition:transform .44s var(--out);transform:translateX(calc(var(--dir)*16%)) rotate(calc(var(--dir)*8deg)) scale(.92)}
.dk-stage .gc:focus-visible{outline:2px solid var(--fg);outline-offset:6px}
.dk-bar{display:flex;align-items:center;gap:14px;margin:0;font-size:var(--t-sm);color:var(--muted)}
.dk-pts{min-width:44px;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line);display:inline-grid;place-items:center;font-weight:700;color:var(--fg);font-variant-numeric:tabular-nums}
.dk-pts.bump{animation:bump .35s cubic-bezier(.34,1.6,.5,1)}
@keyframes bump{40%{transform:scale(1.25);border-color:#C4974F;color:#C4974F}}
@media (max-width:900px){.deck{padding-block:24px 8px}}
@media (max-width:520px){.dk-stage{--dk:.9}.dk-bar{text-align:center;flex-direction:column;gap:10px}}
@media (prefers-reduced-motion:reduce){.dk-stage .gc,.dk-stage .gc.fly-up,.dk-stage .gc.leaving{transition-duration:.12s}}
.dk-done{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;animation:pdone .4s var(--out) both}
.dk-done .dk-tag{margin:0;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.dk-done .dk-big{margin:0 0 18px;font-size:clamp(72px,9vw,112px);font-weight:900;letter-spacing:-.05em;line-height:1;color:#C4974F}
@keyframes pdone{from{opacity:0;transform:translateY(16px) scale(.96)}}
.dk-stage .gc.nope{animation:nope .32s}
@keyframes nope{25%{translate:-10px 0}50%{translate:8px 0}75%{translate:-4px 0}}
.nf{display:grid;grid-template-columns:auto 1fr;gap:clamp(32px,6vw,96px);align-items:center;min-height:62vh}
.nf .nf-card{--k:.9;transform:rotate(-6deg)}
@media (max-width:820px){.nf{grid-template-columns:1fr;justify-items:start}.nf .nf-card{--k:.62;justify-self:center}}
@media (max-width:820px){
  .hero{padding-top:0;padding-bottom:48px}
  .hero>div:first-child{padding-block:36px 52px}
  .hero .h-xl{margin-top:6px}
  .hero .cta{margin-top:40px}
  .hero .deck{padding-top:8px}
}
/* troca de idioma */
footer .langs{display:flex;gap:18px;flex-wrap:wrap;font-size:var(--t-sm)}
footer .langs a{color:var(--muted);text-decoration:none}
footer .langs a[aria-current]{color:var(--fg)}
@media (hover:hover) and (pointer:fine){footer .langs a:hover{color:var(--fg)}}
@media (max-width:820px){
  .nav nav .m-only.m-langs{display:flex!important;gap:4px 22px;flex-wrap:wrap;margin-top:28px;padding:0;font-size:16px;font-weight:500;letter-spacing:0;line-height:1}
  .nav nav .m-langs .m-lang{display:inline-flex!important;align-items:center;min-height:44px;margin:0;padding:0;font-size:16px;color:var(--muted);transform:none}
  .nav nav .m-langs .m-lang[aria-current]{color:var(--fg)}
}
/* ---------- blog ---------- */
.posts{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.post-card{display:flex;flex-direction:column;gap:8px;padding:26px 28px;border-radius:26px;background:var(--card,#121212);border:1px solid var(--line);text-decoration:none;color:var(--fg)}
@media (hover:hover) and (pointer:fine){.post-card:hover{border-color:#3a3a3a}.post-card:hover .post-go{color:var(--fg)}}
.post-t{font-weight:800;font-size:var(--t-s);letter-spacing:-.02em;line-height:1.2}
.post-d{color:var(--text);font-size:var(--t-body);max-width:62ch}
.post-go{color:var(--muted);font-size:var(--t-sm);font-weight:600;margin-top:4px}
.post-meta{color:var(--muted);font-size:var(--t-sm);display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0}
.tag-draft{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#141414;background:#C4974F;border-radius:999px;padding:3px 10px}
.post-head .h-l{max-width:22ch;margin:18px 0 18px;font-size:clamp(34px,4.6vw,60px);line-height:1}
.post-back{color:var(--muted);text-decoration:none;font-size:var(--t-sm);font-weight:600}
@media (hover:hover) and (pointer:fine){.post-back:hover{color:var(--fg)}}
.post-body{max-width:68ch;padding-bottom:clamp(40px,6vw,80px);display:flex;flex-direction:column;gap:14px}
.post-body>*{margin:0}
.post-body h2{font-size:var(--t-s);font-weight:800;letter-spacing:-.02em;margin-top:22px}
.post-body h3{font-size:18px;font-weight:700;margin-top:12px}
.post-body p,.post-body li{color:var(--text);font-size:var(--t-body);line-height:1.7}
.post-body ul,.post-body ol{margin:0;padding-left:22px;display:grid;gap:6px}
.post-body strong{color:var(--fg)}
.post-body a{color:var(--fg)}
.post-body blockquote{padding:14px 18px;border-left:3px solid #C4974F;background:#141414;border-radius:0 14px 14px 0}
.post-body blockquote p{margin:0;color:var(--muted)}
.post-body img{max-width:100%;border-radius:20px}