:root {
  /* Marca LiveMode */
  --livemode-verde: #6CB52C;
  --livemode-preto: #000000;
  --livemode-branco: #FFFFFF;
  --livemode-cinza: #585555;

  /* Texto */
  --texto-principal: #171717;
  --texto-secundario: #595959;

  /* Fundos */
  --fundo-claro: #FAFAFA;
  --fundo-claro-2: #F5F5F5;
  --fundo-escuro: #0A0A0A;
  --fundo-escuro-2: #111111;

  /* Fontes */
  --fonte-titulo: "Oswald", Impact, "Arial Narrow", sans-serif;
  --fonte-texto: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Formas */
  --raio-card: 8px;
  --raio-botao: 9999px;
}

* { box-sizing: border-box; }

html, body { margin: 0; }

body {
  font-family: var(--fonte-texto);
  font-weight: 400;
  line-height: 1.6;
  color: var(--texto-principal);
  background: var(--livemode-branco);
}

h1, h2, h3 {
  font-family: var(--fonte-titulo);
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.05;
  margin: 0;
}

a { color: var(--livemode-verde); }

/* Blocos alternados */
.bloco { padding: 64px 24px; }
.bloco-escuro { background: var(--fundo-escuro); color: var(--livemode-branco); }
.bloco-claro { background: var(--livemode-branco); color: var(--texto-principal); }

.container { max-width: 960px; margin: 0 auto; }

/* Selo */
.selo {
  display: inline-block;
  padding: 6px 16px;
  border: 1px solid var(--livemode-verde);
  border-radius: var(--raio-botao);
  color: var(--livemode-verde);
  font-weight: 600;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Botão (para as próximas páginas) */
.botao {
  display: inline-block;
  padding: 12px 28px;
  border-radius: var(--raio-botao);
  background: var(--livemode-verde);
  color: var(--livemode-branco);
  font-family: var(--fonte-texto);
  font-weight: 600;
  text-decoration: none;
}

/* Card (para as próximas páginas) */
.card {
  padding: 24px;
  border-radius: var(--raio-card);
  background: var(--fundo-claro-2);
}

/* Bloco de abertura */
.hero { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; }
.hero h1 { margin: 24px 0 16px; font-size: clamp(3rem, 12vw, 6.5rem); letter-spacing: 0.01em; }
.hero p { margin: 0; max-width: 34rem; font-size: clamp(1.0625rem, 3.5vw, 1.375rem); color: #d4d4d4; }