/* Volktra — estilo compartilhado (página de links + páginas de venda) */
:root {
  --verde: #22F23C;
  --verde-escuro: #12b52a;
  --verde-fundo: rgba(34, 242, 60, .08);
  --verde-borda: rgba(34, 242, 60, .35);
  --preto: #050605;
  --fundo: #0a0b0a;
  --card: #111311;
  --card-2: #161916;
  --borda: #232723;
  --texto: #f2f5f2;
  --texto-2: #a9b2a9;
  --texto-3: #6f786f;
  --vermelho: #ff5a5a;
  --amarelo: #FFE500;
  --raio: 18px;
  --titulo: 'Exo 2', system-ui, sans-serif;
  --corpo: 'Inter', system-ui, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--preto);
  color: var(--texto);
  font-family: var(--corpo);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

h1, h2, h3, h4 { font-family: var(--titulo); line-height: 1.12; letter-spacing: -.01em; }
.verde { color: var(--verde); }

/* Fundo com grade e brilho verde (igual à interface) */
.fundo-grade {
  position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 45% at 50% -5%, rgba(34, 242, 60, .16), transparent 70%),
    linear-gradient(rgba(34, 242, 60, .035) 1px, transparent 1px) 0 0 / 44px 44px,
    linear-gradient(90deg, rgba(34, 242, 60, .035) 1px, transparent 1px) 0 0 / 44px 44px;
  mask-image: linear-gradient(#000 0%, #000 55%, transparent 100%);
}

/* Botões */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  background: var(--verde); color: #031204;
  font-family: var(--titulo); font-weight: 800; font-size: 1.08rem;
  padding: 1em 2em; border-radius: 999px; border: 0; cursor: pointer;
  box-shadow: 0 0 0 0 rgba(34, 242, 60, .5), 0 10px 40px -10px rgba(34, 242, 60, .65);
  transition: transform .18s ease, box-shadow .18s ease, background .18s;
}
.botao:hover { transform: translateY(-2px); background: #4dff63; box-shadow: 0 0 0 6px rgba(34, 242, 60, .15), 0 16px 50px -10px rgba(34, 242, 60, .8); }
.botao:active { transform: translateY(0); }
.botao.grande { font-size: 1.2rem; padding: 1.1em 2.4em; }
.botao.contorno { background: transparent; color: var(--texto); border: 1px solid var(--borda); box-shadow: none; }
.botao.contorno:hover { border-color: var(--verde-borda); background: var(--verde-fundo); }

.selo {
  display: inline-flex; align-items: center; gap: .5em;
  font-size: .8rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--verde); background: var(--verde-fundo); border: 1px solid var(--verde-borda);
  padding: .4em 1em; border-radius: 999px;
}
.selo::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--verde); box-shadow: 0 0 10px var(--verde); }

/* Aparecer ao rolar */
.surge { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.surge.visivel { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .surge { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* Rodapé */
.rodape {
  text-align: center; color: var(--texto-3); font-size: .85rem;
  padding: 48px 16px 40px; border-top: 1px solid var(--borda); margin-top: 40px;
}
.rodape img { width: 120px; margin: 0 auto 18px; border-radius: 10px; }
.rodape nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin: 16px 0; }
.rodape nav a:hover { color: var(--verde); }
.rodape .aviso { max-width: 640px; margin: 0 auto; font-size: .78rem; line-height: 1.55; }