/* Copyright (c) 2026 Redação Intensiva / MetaRedação. Todos os direitos reservados. Proibida a reprodução total ou parcial sem autorização prévia. */
:root {
  --slate-950: #020617;
  --slate-900: #0f172a;
  --slate-800: #1e293b;
  --slate-700: #334155;
  --slate-500: #64748b;
  --slate-400: #94a3b8;
  --slate-300: #cbd5e1;
  --slate-200: #e2e8f0;
  --slate-100: #f1f5f9;
  --emerald-300: #6ee7b7;
  --emerald-400: #34d399;
  --emerald-500: #10b981;
  --emerald-600: #059669;
  --emerald-900: #064e3b;
  --emerald-950: #022c22;
  --teal-300: #5eead4;
  --teal-400: #2dd4bf;
  --teal-500: #14b8a6;
  --amber-300: #fcd34d;
  --amber-400: #fbbf24;
  --amber-500: #f59e0b;
  --amber-600: #d97706;
  --red-400: #f87171;
  --red-500: #ef4444;
  --red-950: #450a0a;
  --fonte: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; overflow-x: hidden; }
html, body { width: 100%; max-width: 100vw; overflow-x: hidden; }

body.pagina-landing {
  font-family: var(--fonte);
  background: var(--slate-950);
  color: var(--slate-100);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }

.container { max-width: 1280px; margin: 0 auto; padding: 0 16px; }

.ico {
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  display: inline-block;
  vertical-align: middle;
}

.cor-emerald { color: var(--emerald-400); }
.cor-vermelho { color: var(--red-400); }
.cor-amber { color: var(--amber-300); }

.oculto { display: none !important; }

.texto-gradiente {
  background: linear-gradient(90deg, #f87171, #fcd34d, #f59e0b);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-decoration: underline;
  text-decoration-color: rgba(239, 68, 68, 0.4);
  text-underline-offset: 4px;
}

.estrelas {
  display: inline-flex;
  gap: 2px;
  color: var(--amber-400);
}
.estrelas .ico { width: 14px; height: 14px; }

/* ============ TOP BANNER ============ */
.top-banner {
  background: linear-gradient(90deg, #d97706, #059669, #0f766e);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  padding: 10px 16px;
}
@media (min-width: 640px) { .top-banner { font-size: 14px; } }

.top-banner-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.top-banner-left { display: flex; align-items: center; gap: 10px; }

.badge-banner {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(245, 158, 11, 0.3);
  color: #fde68a;
  font-size: 12px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(252, 211, 77, 0.3);
  animation: pulsar 2s infinite;
}
.badge-banner .ico { width: 14px; height: 14px; color: #fcd34d; }

.top-banner-texto { color: #d1fae5; }
.top-banner-texto strong { font-weight: 700; }

.top-banner-right { display: flex; align-items: center; gap: 16px; font-size: 12px; }

.timer-box {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(0, 0, 0, 0.2);
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-family: "Courier New", monospace;
}
.timer-box .ico { width: 14px; height: 14px; color: var(--teal-300); }
.timer-box strong { color: var(--amber-300); font-weight: 700; }

.top-banner-link {
  color: rgba(255,255,255,0.85);
  text-decoration: none;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
  transition: color 0.2s;
}
.top-banner-link:hover { color: #fff; text-decoration: underline; }

/* ============ TOAST COMPRA ============ */
.toast-compra {
  position: fixed;
  bottom: 16px;
  left: 16px;
  z-index: 40;
  max-width: 380px;
  width: calc(100% - 32px);
  background: rgba(15, 23, 42, 0.95);
  border: 1px solid rgba(16, 185, 129, 0.3);
  color: #fff;
  padding: 14px;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: flex-start;
  gap: 12px;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s, transform 0.4s;
  pointer-events: none;
}
.toast-compra.visivel { opacity: 1; transform: translateY(0); pointer-events: auto; }

.toast-icone {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(16, 185, 129, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--emerald-400);
  flex-shrink: 0;
}
.toast-icone .ico { width: 16px; height: 16px; }

.toast-corpo { flex: 1; font-size: 12px; }
.toast-topo { display: flex; align-items: center; justify-content: space-between; }
.toast-nome { color: var(--emerald-300); font-weight: 700; }
.toast-topo span { font-size: 10px; color: var(--slate-400); }
.toast-cidade { color: var(--slate-300); margin-top: 2px; }
.toast-plano { color: var(--amber-300); font-size: 11px; font-weight: 500; margin-top: 4px; }
.toast-plano strong { color: #fff; }

.toast-fechar {
  background: none;
  border: none;
  color: var(--slate-400);
  cursor: pointer;
  padding: 2px;
  border-radius: 4px;
  flex-shrink: 0;
}
.toast-fechar:hover { color: #fff; background: var(--slate-800); }
.toast-fechar .ico { width: 14px; height: 14px; }

/* ============ HEADER ============ */
.header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(15, 23, 42, 0.9);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--slate-800);
  color: #fff;
}

.header-inner {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; }

.marca-icone {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--emerald-500), var(--teal-400));
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--slate-950);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2);
  transition: transform 0.2s;
}
.marca:hover .marca-icone { transform: scale(1.05); }
.marca-icone .ico { width: 24px; height: 24px; }

.marca-nome { font-weight: 800; font-size: 18px; letter-spacing: -0.5px; color: #fff; }
.marca-nome span { color: var(--emerald-400); }

.marca-app {
  font-style: normal;
  background: rgba(16, 185, 129, 0.2);
  color: var(--emerald-300);
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid rgba(16, 185, 129, 0.3);
  margin-left: 4px;
}

.marca p { font-size: 10px; color: var(--slate-400); font-weight: 500; letter-spacing: 0.5px; }

.nav, .nav-desktop { display: none; align-items: center; gap: 16px; font-size: 12px; font-weight: 600; color: var(--slate-300); }
@media (min-width: 768px) { .nav, .nav-desktop { display: flex; } }

.nav-link { color: var(--slate-300); text-decoration: none; transition: color 0.2s; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.nav-link:hover { color: var(--emerald-400); }
.nav-link .ico { width: 14px; height: 14px; color: var(--emerald-400); }
.nav-pack { color: var(--amber-400); font-weight: 700; }
.nav-pack:hover { color: var(--amber-300); }
.nav-pack .ico { color: var(--amber-400); }

/* --- BOTÃO PRIMÁRIO CTA --- */
.btn-header-cta {
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff;
  font-weight: 800;
  font-size: 13px;
  padding: 8px 18px;
  border-radius: 10px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  box-shadow: 0 0 18px rgba(16, 185, 129, 0.4);
  transition: box-shadow 0.2s, transform 0.2s;
}
.btn-header-cta:hover { box-shadow: 0 0 24px rgba(16, 185, 129, 0.6); transform: translateY(-2px); }
.btn-header-cta .ico { width: 16px; height: 16px; }
.btn-header-cta em {
  font-style: normal;
  background: rgba(255,255,255,0.2);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
}

/* --- BOTÃO GHOST (Cupom) --- */
.btn-header-ghost {
  background: transparent;
  color: var(--slate-300);
  border: 1px solid rgba(100,116,139,0.4);
  font-weight: 600;
  font-size: 12px;
  padding: 7px 12px;
  border-radius: 8px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.btn-header-ghost:hover { background: rgba(100,116,139,0.1); border-color: rgba(100,116,139,0.6); color: #fff; }
.btn-header-ghost .ico { width: 14px; height: 14px; }

/* --- BOTÃO OUTLINE (Entrar) --- */
.btn-header-outline {
  background: transparent;
  color: var(--slate-400);
  border: 1px solid rgba(100,116,139,0.3);
  font-weight: 600;
  font-size: 12px;
  padding: 7px 12px;
  border-radius: 8px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.btn-header-outline:hover { background: rgba(100,116,139,0.1); border-color: rgba(100,116,139,0.5); color: #fff; }
.btn-header-outline .ico { width: 14px; height: 14px; }

/* ============ HERO ============ */
.hero {
  position: relative;
  overflow: hidden;
  background: var(--slate-950);
  color: #fff;
  padding: 40px 0 64px;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .hero { padding: 64px 0 96px; } }

.glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
  pointer-events: none;
}
.glow-1 { top: 25%; left: 50%; transform: translateX(-50%); width: 600px; height: 350px; background: rgba(5, 150, 105, 0.15); }
.glow-2 { top: 40px; right: 40px; width: 300px; height: 300px; background: rgba(20, 184, 166, 0.1); }

.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center; }
@media (min-width: 1024px) { .hero-grid { grid-template-columns: 7fr 5fr; } }

.hero-copy { text-align: center; }
@media (min-width: 1024px) { .hero-copy { text-align: left; } }

.pill-hero {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--slate-900);
  border: 1px solid rgba(16, 185, 129, 0.4);
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  color: var(--emerald-300);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}
.pill-hero .ico { width: 14px; height: 14px; color: var(--amber-400); }

.ping {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--emerald-400);
  animation: ping 1.5s infinite;
}

.hero h1 {
  margin: 20px 0 16px;
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -1px;
  line-height: 1.1;
}
@media (min-width: 640px) { .hero h1 { font-size: 42px; } }
@media (min-width: 1024px) { .hero h1 { font-size: 56px; } }

.hero-sub {
  color: var(--slate-300);
  font-size: 16px;
  line-height: 1.6;
  max-width: 640px;
  margin: 0 auto 16px;
}
@media (min-width: 1024px) { .hero-sub { margin: 0; } }
@media (min-width: 640px) { .hero-sub { font-size: 18px; } }
@media (min-width: 1024px) { .hero-sub { font-size: 20px; } }
.hero-sub strong { color: #fff; font-weight: 700; }
.hero-sub .cor-emerald { font-weight: 700; }

.bullets {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 8px 0;
  font-size: 13px;
  color: var(--slate-200);
  max-width: 576px;
  margin: 0 auto 16px;
  text-align: left;
}
@media (min-width: 640px) { .bullets { grid-template-columns: 1fr 1fr; font-size: 14px; } }
@media (min-width: 1024px) { .bullets { margin: 0 0 16px; } }

.bullet {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(15, 23, 42, 0.8);
  border: 1px solid var(--slate-800);
  padding: 10px;
  border-radius: 12px;
}
.bullet .ico { width: 16px; height: 16px; color: var(--emerald-400); }
.bullet .ico.icone-amber { color: var(--amber-400); }

.hero-preco {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: linear-gradient(90deg, rgba(2, 44, 34, 0.8), var(--slate-900));
  border: 1px solid rgba(16, 185, 129, 0.4);
  padding: 12px;
  border-radius: 16px;
  max-width: 448px;
  width: 100%;
  margin: 0 auto 16px;
}
@media (min-width: 1024px) { .hero-preco { margin: 0 0 16px; } }

.hero-preco-titulo {
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--slate-400);
  letter-spacing: 1px;
  display: block;
}

.hero-preco-valor { display: flex; align-items: baseline; gap: 8px; }
.hero-preco-valor .riscado { color: var(--slate-400); text-decoration: line-through; font-size: 12px; }
.hero-preco-valor strong { font-size: 24px; font-weight: 900; color: var(--emerald-400); }
.hero-preco-valor em {
  font-style: normal;
  color: var(--emerald-300);
  font-size: 10px;
  font-weight: 600;
  background: rgba(6, 78, 59, 0.6);
  padding: 2px 6px;
  border-radius: 4px;
}

.hero-preco-badge {
  font-size: 10px;
  font-family: "Courier New", monospace;
  color: var(--amber-300);
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  padding: 4px 8px;
  border-radius: 6px;
  white-space: nowrap;
}

.hero-ctas {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
@media (min-width: 640px) { .hero-ctas { flex-direction: row; justify-content: center; } }
@media (min-width: 1024px) { .hero-ctas { justify-content: flex-start; } }

.btn-primario {
  background: linear-gradient(90deg, var(--emerald-500), var(--teal-400));
  color: var(--slate-950);
  font-weight: 900;
  font-size: 16px;
  padding: 16px 32px;
  border-radius: 16px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);
  transition: transform 0.2s, box-shadow 0.2s;
  width: 100%;
}
@media (min-width: 640px) { .btn-primario { width: auto; } }
.btn-primario:hover { transform: scale(1.02); box-shadow: 0 12px 32px rgba(16, 185, 129, 0.5); }
.btn-primario .ico { width: 20px; height: 20px; }

.btn-secundario {
  background: var(--slate-900);
  color: var(--slate-200);
  border: 1px solid var(--slate-700);
  font-weight: 700;
  font-size: 14px;
  padding: 16px 20px;
  border-radius: 16px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: border-color 0.2s, background 0.2s;
  width: 100%;
}
@media (min-width: 640px) { .btn-secundario { width: auto; } }
.btn-secundario:hover { background: var(--slate-800); border-color: rgba(16, 185, 129, 0.5); }
.btn-secundario .ico { width: 16px; height: 16px; color: var(--emerald-400); animation: quicar 1.5s infinite; }

.hero-garantias {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 16px;
  font-size: 12px;
  color: var(--slate-400);
  padding-top: 8px;
}
@media (min-width: 1024px) { .hero-garantias { justify-content: flex-start; } }
.hero-garantias span { display: inline-flex; align-items: center; gap: 6px; }
.hero-garantias .ico { width: 16px; height: 16px; color: var(--emerald-400); }
.hero-garantias strong { color: var(--slate-200); font-weight: 700; }

/* Preview card */
.hero-preview { position: relative; }

.preview-card {
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(16, 185, 129, 0.3);
  border-radius: 24px;
  padding: 16px;
  box-shadow: 0 24px 48px rgba(16, 185, 129, 0.1);
  backdrop-filter: blur(16px);
}
@media (min-width: 640px) { .preview-card { padding: 24px; } }

.preview-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--slate-800);
  padding-bottom: 12px;
  margin-bottom: 16px;
}

.preview-dots { display: flex; align-items: center; gap: 6px; }
.preview-dots span { width: 12px; height: 12px; border-radius: 50%; }
.preview-dots span:nth-child(1) { background: rgba(239, 68, 68, 0.8); }
.preview-dots span:nth-child(2) { background: rgba(245, 158, 11, 0.8); }
.preview-dots span:nth-child(3) { background: rgba(16, 185, 129, 0.8); }
.preview-dots em { font-style: normal; font-family: "Courier New", monospace; font-size: 11px; color: var(--slate-400); margin-left: 8px; }

.preview-ao-vivo {
  font-size: 10px;
  background: rgba(16, 185, 129, 0.2);
  color: var(--emerald-300);
  font-family: "Courier New", monospace;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(16, 185, 129, 0.3);
}

.preview-score {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(90deg, #022c22, var(--slate-900));
  border: 1px solid rgba(16, 185, 129, 0.4);
  padding: 16px;
  border-radius: 16px;
}

.preview-score > div > span {
  font-size: 12px;
  color: var(--slate-400);
  font-weight: 500;
  display: block;
}

.preview-media { font-size: 30px; font-weight: 900; color: var(--emerald-400); }
.preview-media em { font-style: normal; font-size: 12px; color: var(--emerald-300); font-weight: 400; }

.preview-ganho {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  color: var(--emerald-400);
  font-weight: 600;
  margin-top: 2px;
}
.preview-ganho .ico { width: 12px; height: 12px; }

.preview-meta { text-align: right; }
.preview-meta span { font-size: 12px; color: var(--slate-400); display: block; }
.preview-meta strong { font-size: 18px; font-weight: 800; color: var(--amber-300); }

.barra-meta {
  width: 80px;
  height: 8px;
  background: var(--slate-800);
  border-radius: 999px;
  margin-top: 4px;
  margin-left: auto;
  overflow: hidden;
}
.barra-meta span { display: block; height: 100%; background: var(--amber-400); border-radius: 999px; }

.preview-comps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; text-align: center; margin: 16px 0; }

.comp-card { padding: 8px 2px; border-radius: 12px; border: 1px solid; }
.comp-card div { font-size: 10px; font-weight: 700; opacity: 0.8; }
.comp-card strong { font-size: 14px; }

.comp-atencao { border-color: rgba(245, 158, 11, 0.5); background: rgba(245, 158, 11, 0.1); color: var(--amber-300); }
.comp-excelente { border-color: rgba(16, 185, 129, 0.5); background: rgba(16, 185, 129, 0.1); color: var(--emerald-300); }
.comp-bom { border-color: rgba(20, 184, 166, 0.5); background: rgba(20, 184, 166, 0.1); color: var(--teal-300); }
.comp-perfeito { border-color: rgba(52, 211, 153, 0.5); background: rgba(52, 211, 153, 0.1); color: var(--emerald-300); }

.preview-alerta {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(69, 10, 10, 0.4);
  border: 1px solid rgba(239, 68, 68, 0.5);
  padding: 14px;
  border-radius: 16px;
  margin-bottom: 16px;
}
.preview-alerta > .ico { width: 20px; height: 20px; color: var(--red-400); margin-top: 2px; animation: pulsar 2s infinite; }
.preview-alerta p { font-size: 12px; }
.preview-alerta p:first-child { font-weight: 700; color: #fca5a5; }
.preview-alerta p:last-child { color: var(--slate-300); margin-top: 2px; }

.btn-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--slate-800);
  color: var(--emerald-300);
  font-weight: 700;
  font-size: 12px;
  padding: 10px;
  border-radius: 12px;
  text-decoration: none;
  border: 1px solid rgba(16, 185, 129, 0.3);
  transition: background 0.2s;
  width: 100%;
}
.btn-preview:hover { background: var(--slate-700); }
.btn-preview .ico { width: 14px; height: 14px; color: var(--amber-300); }

/* ============ SEÇÕES GERAIS ============ */
.cabecalho-secao {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 48px;
}
.cabecalho-secao h2 {
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -0.5px;
  margin: 12px 0;
}
@media (min-width: 640px) { .cabecalho-secao h2 { font-size: 36px; } }
.cabecalho-secao p { color: var(--slate-300); font-size: 14px; line-height: 1.6; }
@media (min-width: 640px) { .cabecalho-secao p { font-size: 15px; } }

.pill-emerald, .pill-amber {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.pill-emerald { background: rgba(16, 185, 129, 0.1); border: 1px solid rgba(16, 185, 129, 0.3); color: var(--emerald-400); }
.pill-amber { background: rgba(245, 158, 11, 0.1); border: 1px solid rgba(245, 158, 11, 0.3); color: var(--amber-300); }
.pill-emerald .ico, .pill-amber .ico { width: 14px; height: 14px; }
.pill-amber .ico { color: var(--amber-400); }

/* ============ DEMO ============ */
.secao-demo {
  padding: 64px 0;
  background: var(--slate-900);
  color: #fff;
}
@media (min-width: 768px) { .secao-demo { padding: 96px 0; } }

.demo-frame {
  background: var(--slate-950);
  border: 1px solid var(--slate-800);
  border-radius: 24px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
  overflow: hidden;
}

.demo-topbar {
  background: var(--slate-900);
  border-bottom: 1px solid var(--slate-800);
  padding: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.demo-identidade { display: flex; align-items: center; gap: 12px; }
.demo-mr {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  background: var(--emerald-500);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  color: var(--slate-950);
  font-size: 14px;
}
.demo-identidade h3 { font-size: 14px; font-weight: 700; color: #fff; }
.demo-identidade p { font-size: 11px; color: var(--slate-400); }

.demo-resumo { display: flex; align-items: center; gap: 12px; background: var(--slate-950); border: 1px solid rgba(16, 185, 129, 0.4); padding: 8px 16px; border-radius: 12px; }
.demo-resumo > div > span {
  font-size: 10px;
  color: var(--slate-400);
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  display: block;
}
.demo-resumo strong { font-size: 20px; font-weight: 900; color: var(--emerald-400); }
.demo-resumo strong em { font-style: normal; font-size: 12px; color: var(--slate-400); font-weight: 400; }
.demo-resumo strong.cor-vermelho { font-size: 12px; color: var(--red-400); font-weight: 700; }
.demo-divisor { width: 1px; height: 32px; background: var(--slate-800); }

.demo-tabs {
  display: flex;
  overflow-x: auto;
  background: rgba(15, 23, 42, 0.5);
  border-bottom: 1px solid var(--slate-800);
  padding: 8px;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--slate-400);
  scrollbar-width: none;
}
.demo-tabs::-webkit-scrollbar { display: none; }

.demo-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 12px;
  border: none;
  background: none;
  color: var(--slate-400);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s, color 0.2s;
  font-family: var(--fonte);
}
.demo-tab:hover { background: var(--slate-800); color: #fff; }
.demo-tab .ico { width: 16px; height: 16px; }
.demo-tab.ativo { background: var(--emerald-500); color: var(--slate-950); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3); }
.demo-tab-amber { background: rgba(245, 158, 11, 0.1); color: var(--amber-300); border: 1px solid rgba(245, 158, 11, 0.3); }
.demo-tab-amber:hover { background: rgba(245, 158, 11, 0.2); }
.demo-tab-amber.ativo { background: var(--amber-400); color: var(--slate-950); border-color: var(--amber-300); }

.demo-panel { padding: 24px; }

.alerta-inteligente {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(69, 10, 10, 0.4);
  border: 1px solid rgba(239, 68, 68, 0.5);
  padding: 16px;
  border-radius: 16px;
  margin-bottom: 32px;
}
.alerta-inteligente > .ico { width: 24px; height: 24px; color: var(--red-400); margin-top: 2px; animation: quicar 1.5s infinite; }
.alerta-inteligente h4 { font-weight: 800; font-size: 14px; color: #fca5a5; text-transform: uppercase; letter-spacing: 0.5px; }
.alerta-inteligente p { font-size: 13px; color: var(--slate-200); margin-top: 4px; line-height: 1.5; }
.alerta-inteligente p strong.cor-amber { color: var(--amber-300); }

.graficos-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 1024px) { .graficos-grid { grid-template-columns: 1fr 1fr; } }

.grafico-card {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  padding: 20px;
  border-radius: 16px;
}

.grafico-titulo { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.grafico-titulo h4 { font-size: 14px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 8px; }
.grafico-titulo h4 .ico { width: 16px; height: 16px; color: var(--emerald-400); }
.grafico-titulo p { font-size: 11px; color: var(--slate-400); margin-top: 2px; }

.mono-badge {
  font-size: 10px;
  background: var(--slate-800);
  color: var(--emerald-300);
  padding: 4px 8px;
  border-radius: 4px;
  font-family: "Courier New", monospace;
  white-space: nowrap;
}
.mono-badge.verde { background: rgba(2, 44, 34, 0.6); border: 1px solid rgba(16, 185, 129, 0.3); font-weight: 700; }

.chart-box { height: 260px; position: relative; }
@media (min-width: 640px) { .chart-box { height: 288px; } }

.radar-labels { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; padding-top: 8px; border-top: 1px solid var(--slate-800); text-align: center; }
.radar-labels > div { padding: 4px; border-radius: 4px; background: var(--slate-950); }
.radar-labels span { font-size: 10px; font-family: "Courier New", monospace; color: var(--slate-400); display: block; }
.radar-labels strong { font-size: 12px; font-weight: 900; }
.radar-labels strong.fraca { color: var(--red-400); }
.radar-labels strong.forte { color: var(--emerald-400); }
.radar-labels strong.media { color: var(--amber-300); }

.grafico-dica {
  font-size: 11px;
  color: var(--slate-400);
  text-align: center;
  padding-top: 8px;
  border-top: 1px solid var(--slate-800);
  margin-top: 8px;
}

.panel-titulo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  padding: 16px;
  border-radius: 16px;
  margin-bottom: 24px;
}
.panel-titulo h4 { font-size: 14px; font-weight: 700; color: #fff; }
.panel-titulo p { font-size: 12px; color: var(--slate-400); margin-top: 2px; }

.btn-reset {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--slate-800);
  border: none;
  color: var(--slate-400);
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: color 0.2s;
  font-family: var(--fonte);
}
.btn-reset:hover { color: var(--emerald-400); }
.btn-reset .ico { width: 12px; height: 12px; }

.comp-sliders { display: flex; flex-direction: column; gap: 16px; }

.comp-slider {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  padding: 16px;
  border-radius: 16px;
}

.comp-slider-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.comp-slider-codigo {
  background: rgba(16, 185, 129, 0.2);
  color: var(--emerald-300);
  font-weight: 800;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(16, 185, 129, 0.4);
}
.comp-slider-nome { font-size: 14px; font-weight: 700; color: #fff; margin-left: 8px; }
.comp-slider-valor { font-size: 18px; font-weight: 900; color: var(--emerald-400); font-family: "Courier New", monospace; }
.comp-slider-valor em { font-style: normal; font-size: 12px; color: var(--slate-400); font-weight: 400; }
.comp-slider-desc { font-size: 12px; color: var(--slate-400); }

.comp-slider-controles { display: flex; align-items: center; gap: 16px; padding-top: 8px; }

.comp-range {
  flex: 1;
  width: 100%;
  accent-color: var(--emerald-400);
  cursor: pointer;
  height: 8px;
}

.comp-quick { display: flex; gap: 4px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.comp-quick button {
  font-size: 10px;
  font-family: "Courier New", monospace;
  padding: 2px 6px;
  border-radius: 4px;
  border: none;
  background: var(--slate-800);
  color: var(--slate-400);
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.comp-quick button:hover { color: #fff; }
.comp-quick button.ativo { background: var(--emerald-500); color: var(--slate-950); font-weight: 700; }

.add-redacao {
  background: var(--slate-900);
  border: 1px solid rgba(16, 185, 129, 0.3);
  padding: 16px;
  border-radius: 16px;
  text-align: center;
  margin-top: 24px;
}
.add-redacao p { font-size: 12px; color: var(--slate-300); margin-bottom: 12px; }

.btn-add {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--emerald-500);
  color: var(--slate-950);
  border: none;
  font-weight: 700;
  font-size: 12px;
  padding: 10px 20px;
  border-radius: 12px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
  transition: background 0.2s;
  font-family: var(--fonte);
}
.btn-add:hover { background: var(--emerald-400); }
.btn-add .ico { width: 16px; height: 16px; }

.badge-vicios {
  font-size: 12px;
  background: rgba(245, 158, 11, 0.2);
  color: var(--amber-300);
  padding: 4px 12px;
  border-radius: 999px;
  font-weight: 700;
  border: 1px solid rgba(245, 158, 11, 0.3);
  white-space: nowrap;
}

.checklist-list { display: flex; flex-direction: column; gap: 12px; }

.checklist-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid var(--slate-800);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, opacity 0.2s;
}
.checklist-item.desmarcado { background: var(--slate-950); opacity: 0.6; }
.checklist-item.marcado { background: var(--slate-900); border-color: rgba(245, 158, 11, 0.5); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); }

.checklist-item .check-icone { width: 20px; height: 20px; margin-top: 2px; flex-shrink: 0; }
.checklist-item.marcado .check-icone { color: var(--amber-400); }
.checklist-item.desmarcado .check-icone { color: var(--slate-600); }

.checklist-conteudo { flex: 1; }
.checklist-titulo { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.checklist-titulo h4 { font-size: 14px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 8px; }
.checklist-comp {
  background: var(--slate-800);
  color: var(--amber-300);
  font-size: 10px;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 4px;
}
.checklist-freq {
  font-size: 10px;
  background: var(--red-950);
  border: 1px solid rgba(239, 68, 68, 0.4);
  color: #fca5a5;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  animation: pulsar 2s infinite;
}
.checklist-conteudo p { font-size: 12px; color: var(--slate-400); margin-top: 2px; }

.checklist-aviso {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(2, 44, 34, 0.4);
  border: 1px solid rgba(16, 185, 129, 0.4);
  padding: 16px;
  border-radius: 16px;
  margin-top: 24px;
  font-size: 12px;
  color: var(--emerald-300);
}
.checklist-aviso .ico { width: 20px; height: 20px; color: var(--emerald-400); flex-shrink: 0; }

.meta-form {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  padding: 20px;
  border-radius: 16px;
  margin-bottom: 24px;
}
.meta-form-titulo h4 { font-size: 16px; font-weight: 800; color: #fff; display: flex; align-items: center; gap: 8px; }
.meta-form-titulo h4 .ico { width: 20px; height: 20px; color: var(--emerald-400); }
.meta-form-titulo p { font-size: 12px; color: var(--slate-400); margin-top: 4px; }

.meta-form-grid { display: grid; grid-template-columns: 1fr; gap: 16px; padding-top: 16px; }
@media (min-width: 640px) { .meta-form-grid { grid-template-columns: 1fr 1fr; } }

.meta-form-grid label { font-size: 12px; font-weight: 700; color: var(--slate-300); display: block; margin-bottom: 6px; }

.meta-form-grid select {
  width: 100%;
  background: var(--slate-950);
  border: 1px solid var(--slate-700);
  border-radius: 12px;
  padding: 8px 12px;
  color: var(--emerald-400);
  font-weight: 700;
  font-size: 14px;
  font-family: var(--fonte);
}
.meta-form-grid select:nth-of-type(2) { border-color: rgba(16, 185, 129, 0.5); color: var(--amber-300); }

.meta-resultado {
  background: linear-gradient(135deg, var(--emerald-950), var(--slate-950));
  border: 1px solid rgba(16, 185, 129, 0.5);
  padding: 24px;
  border-radius: 16px;
}

.meta-resultado-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(16, 185, 129, 0.3);
  padding-bottom: 12px;
  gap: 8px;
  flex-wrap: wrap;
}
.meta-resultado-topo > span:first-child {
  font-size: 12px;
  font-family: "Courier New", monospace;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--emerald-400);
}
.meta-pontos {
  background: var(--emerald-500);
  color: var(--slate-950);
  font-size: 12px;
  font-weight: 900;
  padding: 2px 10px;
  border-radius: 999px;
}

.meta-cards { display: grid; grid-template-columns: 1fr; gap: 16px; padding: 16px 0; text-align: center; }
@media (min-width: 640px) { .meta-cards { grid-template-columns: repeat(3, 1fr); } }
.meta-cards > div { background: rgba(15, 23, 42, 0.8); padding: 14px; border-radius: 12px; border: 1px solid var(--slate-800); }
.meta-cards span { font-size: 10px; color: var(--slate-400); text-transform: uppercase; font-family: "Courier New", monospace; display: block; }
.meta-cards strong { font-size: 18px; font-weight: 900; color: var(--amber-300); display: block; margin-top: 4px; }
.meta-cards strong.cor-emerald { color: var(--emerald-400); font-size: 14px; }

.meta-passos { font-size: 12px; color: var(--slate-200); }
.meta-passos p { font-weight: 700; color: var(--emerald-300); margin-bottom: 8px; }
.meta-passos ul { list-style: disc; list-style-position: inside; padding-left: 4px; color: var(--slate-300); }
.meta-passos li { margin-bottom: 4px; }

.pack-preview {
  background: linear-gradient(90deg, rgba(69, 26, 3, 0.6), var(--slate-900), var(--slate-900));
  border: 1px solid rgba(245, 158, 11, 0.5);
  padding: 24px;
  border-radius: 16px;
}
.pack-preview-topo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pack-preco { font-size: 20px; font-weight: 900; color: var(--amber-300); }
.pack-preco em { font-style: normal; font-size: 12px; color: var(--slate-400); font-weight: 400; }
.pack-preview h4 { font-size: 20px; font-weight: 800; color: #fff; margin: 16px 0 8px; }
.pack-preview > p { font-size: 13px; color: var(--slate-300); max-width: 640px; }

.pack-pilares { display: grid; grid-template-columns: 1fr; gap: 16px; padding-top: 16px; }
@media (min-width: 768px) { .pack-pilares { grid-template-columns: repeat(3, 1fr); } }

.pack-pilares > div {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  padding: 16px;
  border-radius: 12px;
}

.pillar-num {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 8px;
}
.pillar-num .ico { width: 18px; height: 18px; }
.pillar-num.amber { background: rgba(245, 158, 11, 0.2); color: var(--amber-300); }
.pillar-num.emerald { background: rgba(16, 185, 129, 0.2); color: var(--emerald-300); }
.pillar-num.teal { background: rgba(20, 184, 166, 0.2); color: var(--teal-300); }

.pack-pilares h3, .pack-pilares h5 { font-size: 14px; font-weight: 800; color: #fff; }
.pack-pilares p { font-size: 12px; color: var(--slate-300); margin-top: 4px; line-height: 1.5; }

.pillar-tag {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-family: "Courier New", monospace;
  font-weight: 600;
  padding-top: 8px;
}
.pillar-tag .ico { width: 14px; height: 14px; }
.pillar-tag.amber { color: var(--amber-300); }
.pillar-tag.amber .ico { color: var(--amber-400); }
.pillar-tag.emerald { color: var(--emerald-300); }
.pillar-tag.emerald .ico { color: var(--emerald-400); }
.pillar-tag.teal { color: var(--teal-300); }
.pillar-tag.teal .ico { color: var(--teal-400); }

.demo-footer-cta {
  background: var(--slate-900);
  border-top: 1px solid var(--slate-800);
  padding: 24px;
  text-align: center;
}
.demo-footer-cta h4 { font-size: 16px; font-weight: 800; color: #fff; }
.demo-footer-cta p { font-size: 12px; color: var(--slate-300); max-width: 576px; margin: 8px auto 16px; }
.demo-footer-cta .btn-primario { font-size: 14px; padding: 14px 32px; margin: 0 auto; }

/* ============ FEATURES ============ */
.secao-features {
  padding: 64px 0;
  background: var(--slate-950);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-features { padding: 96px 0; } }

.features-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 768px) { .features-grid { grid-template-columns: 1fr 1fr; } }

.feature-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  border-radius: 24px;
  padding: 24px;
  transition: border-color 0.3s, box-shadow 0.3s;
}
@media (min-width: 768px) { .feature-card { padding: 32px; } }
.feature-card:hover { border-color: rgba(16, 185, 129, 0.5); box-shadow: 0 12px 32px rgba(16, 185, 129, 0.1); }

.feature-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.feature-icone {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: var(--slate-950);
  border: 1px solid var(--slate-800);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s;
}
.feature-card:hover .feature-icone { transform: scale(1.1); }
.feature-icone .ico { width: 24px; height: 24px; color: var(--emerald-400); }
.feature-num { font-size: 24px; font-weight: 900; color: var(--slate-700); font-family: "Courier New", monospace; transition: color 0.3s; }
.feature-card:hover .feature-num { color: rgba(16, 185, 129, 0.3); }

.feature-tag {
  font-size: 10px;
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  font-weight: 700;
  color: var(--emerald-400);
  letter-spacing: 1px;
  background: rgba(16, 185, 129, 0.1);
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.feature-card h3 { font-size: 20px; font-weight: 900; color: #fff; margin-top: 8px; transition: color 0.3s; }
.feature-card:hover h3 { color: var(--emerald-300); }
.feature-sub { font-size: 12px; font-weight: 600; color: var(--slate-400); margin-top: 2px; }
.feature-desc { font-size: 13px; color: var(--slate-300); line-height: 1.6; padding-top: 8px; }

.feature-rodape {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(30, 41, 59, 0.8);
  margin-top: 24px;
  padding-top: 16px;
  font-size: 12px;
  font-weight: 700;
  color: var(--slate-400);
  transition: color 0.3s;
}
.feature-card:hover .feature-rodape { color: var(--emerald-400); }
.feature-rodape .ico { width: 16px; height: 16px; color: var(--emerald-400); }

.cta-barra {
  margin-top: 48px;
  background: linear-gradient(90deg, rgba(2, 44, 34, 0.8), var(--slate-900), var(--slate-950));
  border: 1px solid rgba(16, 185, 129, 0.3);
  border-radius: 24px;
  padding: 24px 32px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.cta-barra h4 { font-size: 18px; font-weight: 900; color: #fff; }
.cta-barra p { font-size: 12px; color: var(--slate-300); margin-top: 4px; }

.btn-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--emerald-500);
  color: var(--slate-950);
  font-weight: 900;
  font-size: 13px;
  padding: 14px 24px;
  border-radius: 16px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.2);
  transition: background 0.2s, transform 0.2s;
}
.btn-cta:hover { background: var(--emerald-400); transform: scale(1.05); }
.btn-cta .ico { width: 16px; height: 16px; }

/* ============ COMPARAÇÃO ============ */
.secao-comparacao {
  padding: 64px 0;
  background: var(--slate-900);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-comparacao { padding: 96px 0; } }

.comparacao-grid { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: stretch; }
@media (min-width: 768px) { .comparacao-grid { grid-template-columns: 1fr 1fr; } }

.sem-app {
  background: var(--slate-950);
  border: 1px solid rgba(239, 68, 68, 0.3);
  border-radius: 24px;
  padding: 24px 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
}

.comparacao-topo { display: flex; align-items: flex-start; justify-content: space-between; border-bottom: 1px solid var(--slate-800); padding-bottom: 16px; gap: 8px; }

.tag-vermelho {
  font-size: 10px;
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  font-weight: 700;
  color: var(--red-400);
  background: rgba(127, 29, 29, 0.6);
  padding: 4px 10px;
  border-radius: 4px;
  border: 1px solid rgba(239, 68, 68, 0.3);
}
.comparacao-topo h3 { font-size: 20px; font-weight: 800; color: var(--slate-200); margin-top: 8px; }
.comparacao-topo > .ico { width: 32px; height: 32px; color: var(--red-500); flex-shrink: 0; }

.sem-app ul, .com-app ul { list-style: none; display: flex; flex-direction: column; gap: 16px; font-size: 13px; color: var(--slate-300); }
.sem-app li, .com-app li { display: flex; align-items: flex-start; gap: 12px; }
.sem-app li .ico { width: 16px; height: 16px; color: var(--red-400); margin-top: 2px; }
.com-app li .ico { width: 16px; height: 16px; color: var(--emerald-400); margin-top: 2px; }

.sem-resultado {
  border-top: 1px solid var(--slate-900);
  padding-top: 16px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--red-400);
  margin-top: auto;
}

.com-app {
  background: linear-gradient(135deg, rgba(2, 44, 34, 0.9), var(--slate-950));
  border: 2px solid var(--emerald-500);
  border-radius: 24px;
  padding: 24px 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(16, 185, 129, 0.1);
}

.selo-recomendado {
  position: absolute;
  top: 0;
  right: 0;
  background: var(--emerald-500);
  color: var(--slate-950);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 4px 12px;
  border-radius: 0 0 0 12px;
}

.tag-emerald {
  font-size: 10px;
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  font-weight: 700;
  color: var(--emerald-300);
  background: rgba(6, 78, 59, 0.6);
  padding: 4px 10px;
  border-radius: 4px;
  border: 1px solid rgba(16, 185, 129, 0.4);
}
.com-app .comparacao-topo { border-bottom-color: rgba(16, 185, 129, 0.3); }
.com-app .comparacao-topo h3 { color: #fff; }
.com-app .comparacao-topo > .ico { color: var(--emerald-400); }
.com-app li strong { color: #fff; }

.btn-comparacao {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--emerald-500);
  color: var(--slate-950);
  font-weight: 900;
  font-size: 13px;
  padding: 14px;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.2);
  transition: background 0.2s, transform 0.2s;
  margin-top: auto;
}
.btn-comparacao:hover { background: var(--emerald-400); transform: scale(1.05); }
.btn-comparacao .ico { width: 16px; height: 16px; }

/* ============ PACK ============ */
.secao-pack {
  position: relative;
  overflow: hidden;
  padding: 64px 0;
  background: var(--slate-950);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-pack { padding: 96px 0; } }

.glow-pack {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 500px;
  height: 300px;
  background: rgba(245, 158, 11, 0.1);
}

.pack-container {
  position: relative;
  z-index: 1;
  background: linear-gradient(135deg, var(--slate-900), var(--slate-900), rgba(69, 26, 3, 0.4));
  border: 2px solid rgba(245, 158, 11, 0.4);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
}
@media (min-width: 768px) { .pack-container { padding: 40px 48px; } }

.pack-titulo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  border-bottom: 1px solid var(--slate-800);
  padding-bottom: 24px;
}
@media (min-width: 1024px) { .pack-titulo { flex-direction: row; align-items: center; } }

.pack-titulo h2 { font-size: 24px; font-weight: 900; color: #fff; margin: 8px 0; }
@media (min-width: 640px) { .pack-titulo h2 { font-size: 30px; } }
.pack-titulo p { font-size: 13px; color: var(--slate-300); max-width: 640px; }

.pack-valor-box {
  background: var(--slate-950);
  border: 1px solid rgba(245, 158, 11, 0.5);
  border-radius: 16px;
  padding: 16px;
  text-align: center;
  flex-shrink: 0;
  width: 100%;
}
@media (min-width: 640px) { .pack-valor-box { width: auto; } }
.pack-valor-box > span {
  font-size: 10px;
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  font-weight: 700;
  color: var(--slate-400);
  display: block;
}
.pack-valor-box > div { font-size: 30px; font-weight: 900; color: var(--amber-300); margin: 4px 0; }
.pack-valor-box > div em { font-style: normal; font-size: 12px; color: var(--slate-400); font-weight: 400; }
.pack-liberado {
  font-size: 10px;
  font-weight: 700;
  color: var(--emerald-400);
  background: rgba(2, 44, 34, 0.6);
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(16, 185, 129, 0.3);
  display: inline-block;
  margin-top: 4px;
}

.pack-acao {
  background: rgba(2, 6, 23, 0.8);
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 16px;
  padding: 16px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  text-align: center;
  margin-top: 32px;
}
@media (min-width: 640px) { .pack-acao { flex-direction: row; text-align: left; } }

.pack-acao-titulo { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: #fff; }
.pack-acao-titulo .ico { width: 16px; height: 16px; color: var(--amber-400); }
.pack-acao p { font-size: 12px; color: var(--slate-400); margin-top: 4px; }

.btn-pack {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--amber-400);
  color: var(--slate-950);
  font-weight: 900;
  font-size: 13px;
  padding: 12px 24px;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(251, 191, 36, 0.2);
  transition: background 0.2s, transform 0.2s;
  flex-shrink: 0;
}
.btn-pack:hover { background: var(--amber-300); transform: scale(1.05); }
.btn-pack .ico { width: 16px; height: 16px; }

/* ============ CALCULADORA ============ */
.secao-calculadora {
  padding: 64px 0;
  background: var(--slate-900);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-calculadora { padding: 96px 0; } }

.calc-container {
  background: var(--slate-950);
  border: 1px solid rgba(16, 185, 129, 0.3);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.4);
}
@media (min-width: 768px) { .calc-container { padding: 40px 48px; } }

.calc-grid { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
@media (min-width: 1024px) { .calc-grid { grid-template-columns: 1fr 1fr; } }

.calc-inputs {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.calc-label { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 700; color: var(--slate-300); }
.calc-label strong { font-size: 16px; font-family: "Courier New", monospace; }

.calc-slider input[type="range"] {
  width: 100%;
  accent-color: var(--emerald-400);
  cursor: pointer;
  margin: 8px 0;
}

.calc-minmax { display: flex; justify-content: space-between; font-size: 10px; color: var(--slate-500); font-family: "Courier New", monospace; }

.calc-botoes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.calc-btn {
  padding: 8px;
  border-radius: 12px;
  border: 1px solid var(--slate-800);
  background: var(--slate-950);
  color: var(--slate-400);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  font-family: var(--fonte);
}
.calc-btn:hover { color: #fff; }
.calc-btn.ativo { background: var(--emerald-500); color: var(--slate-950); border-color: var(--emerald-400); font-weight: 900; }

.calc-dica {
  font-size: 11px;
  color: var(--slate-400);
  background: var(--slate-950);
  border: 1px solid var(--slate-800);
  border-radius: 12px;
  padding: 12px;
  line-height: 1.5;
}

.calc-resultado {
  background: linear-gradient(135deg, var(--emerald-950), var(--slate-950));
  border: 2px solid rgba(16, 185, 129, 0.5);
  border-radius: 16px;
  padding: 24px 32px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.calc-projecao {
  font-size: 10px;
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--emerald-400);
  background: rgba(6, 78, 59, 0.6);
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid rgba(16, 185, 129, 0.3);
  display: inline-block;
}

.calc-projecao-num { margin: 16px 0; }
.calc-projecao-num > span {
  font-size: 12px;
  color: var(--slate-400);
  display: block;
  font-weight: 500;
}
.calc-projecao-num strong {
  font-size: 44px;
  font-weight: 900;
  background: linear-gradient(90deg, var(--emerald-400), var(--teal-300), var(--amber-300));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: block;
  margin: 4px 0;
}
.calc-projecao-num strong em { font-style: normal; font-size: 18px; color: var(--slate-400); font-weight: 400; }

.calc-salto {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--emerald-400);
  background: rgba(16, 185, 129, 0.2);
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid rgba(16, 185, 129, 0.3);
}
.calc-salto .ico { width: 14px; height: 14px; }

.calc-resultado > p { font-size: 12px; color: var(--slate-300); line-height: 1.6; margin: 16px 0; }

.btn-calc {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  background: var(--emerald-500);
  color: var(--slate-950);
  font-weight: 900;
  font-size: 13px;
  padding: 14px;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.25);
  transition: background 0.2s, transform 0.2s;
}
.btn-calc:hover { background: var(--emerald-400); transform: scale(1.05); }
.btn-calc .ico { width: 16px; height: 16px; }

/* ============ DEPOIMENTOS ============ */
.secao-depoimentos {
  padding: 64px 0;
  background: var(--slate-950);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-depoimentos { padding: 96px 0; } }

.depoimentos-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 768px) { .depoimentos-grid { grid-template-columns: repeat(3, 1fr); } }

.depoimento {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  border-radius: 24px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  transition: border-color 0.3s;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
}
.depoimento:hover { border-color: rgba(16, 185, 129, 0.4); }

.depo-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--slate-800);
  padding-bottom: 12px;
}
.depo-notas { font-size: 12px; font-weight: 700; color: var(--slate-400); display: inline-flex; align-items: center; gap: 6px; }
.depo-notas s { text-decoration: line-through; }
.depo-notas strong { font-size: 16px; font-weight: 900; color: var(--emerald-400); }

.depo-ganho {
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-300);
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(16, 185, 129, 0.3);
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.depo-ganho .ico { width: 12px; height: 12px; }

.depo-texto { font-size: 13px; color: var(--slate-300); font-style: italic; line-height: 1.6; }

.depo-autor { display: flex; align-items: center; gap: 12px; border-top: 1px solid rgba(30, 41, 59, 0.8); padding-top: 16px; }
.depo-autor img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(16, 185, 129, 0.4); }
.depo-autor h4 { font-size: 14px; font-weight: 800; color: #fff; display: flex; align-items: center; gap: 4px; }
.depo-autor h4 .ico { width: 14px; height: 14px; color: var(--emerald-400); }
.depo-autor p { font-size: 11px; color: var(--emerald-300); font-weight: 500; }
.depo-autor span { font-size: 10px; color: var(--slate-500); }

/* ============ PRICING ============ */
.secao-pricing {
  position: relative;
  overflow: hidden;
  padding: 64px 0;
  background: var(--slate-900);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-pricing { padding: 96px 0; } }

.glow-pricing {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 400px;
  background: rgba(16, 185, 129, 0.1);
}

.secao-pricing .container { position: relative; z-index: 1; }

.preco-card {
  position: relative;
  max-width: 672px;
  margin: 0 auto;
  background: var(--slate-950);
  border: 2px solid var(--emerald-500);
  border-radius: 24px;
  padding: 24px;
  overflow: hidden;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
}
@media (min-width: 640px) { .preco-card { padding: 40px; } }

.preco-fita {
  background: linear-gradient(90deg, var(--emerald-500), var(--teal-400));
  color: var(--slate-950);
  font-weight: 900;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 2px;
  text-align: center;
  padding: 8px;
  margin: -24px -24px 24px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
@media (min-width: 640px) { .preco-fita { margin: -40px -40px 24px; } }

.preco-titulo { text-align: center; border-bottom: 1px solid var(--slate-800); padding-bottom: 24px; }
.preco-titulo > span {
  font-size: 12px;
  font-family: "Courier New", monospace;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--slate-400);
  display: block;
}
.preco-titulo > div { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 8px 0; flex-wrap: wrap; }
.preco-titulo s { color: var(--slate-500); text-decoration: line-through; font-size: 18px; font-weight: 700; }
.preco-titulo strong { font-size: 48px; font-weight: 900; color: var(--emerald-400); }
.preco-titulo em { font-style: normal; font-size: 12px; color: var(--slate-400); font-family: "Courier New", monospace; }
.preco-titulo p { font-size: 12px; color: var(--emerald-300); font-weight: 500; }

.preco-beneficios { padding: 24px 0; }
.preco-beneficios h4 { font-size: 12px; font-weight: 700; text-transform: uppercase; font-family: "Courier New", monospace; color: var(--slate-400); letter-spacing: 1px; margin-bottom: 12px; }
.preco-beneficios ul { list-style: none; display: flex; flex-direction: column; gap: 10px; font-size: 13px; color: var(--slate-200); }
.preco-beneficios li { display: flex; align-items: flex-start; gap: 12px; }
.preco-beneficios li .ico { width: 16px; height: 16px; color: var(--emerald-400); margin-top: 2px; flex-shrink: 0; }
.preco-beneficios li strong { font-weight: 700; }

.order-bump {
  background: linear-gradient(90deg, rgba(69, 26, 3, 0.7), var(--slate-900), var(--slate-900));
  border: 2px solid rgba(245, 158, 11, 0.6);
  border-radius: 16px;
  padding: 16px 20px;
  margin-bottom: 24px;
}

.order-bump-label { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }

.order-bump-label input { display: none; }

.order-bump-caixa {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  border: 2px solid var(--slate-600);
  background: var(--slate-950);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
  transition: background 0.2s, border-color 0.2s;
}
.order-bump-caixa .ico { width: 14px; height: 14px; color: transparent; transition: color 0.2s; }
.order-bump-label input:checked + .order-bump-caixa { background: var(--amber-400); border-color: var(--amber-400); }
.order-bump-label input:checked + .order-bump-caixa .ico { color: var(--slate-950); }

.order-bump-titulo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.order-bump-titulo > span { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 900; color: var(--amber-300); }
.order-bump-titulo .ico { width: 16px; height: 16px; color: var(--amber-400); }
.order-bump-titulo em {
  font-style: normal;
  font-size: 10px;
  background: var(--amber-400);
  color: var(--slate-950);
  font-weight: 900;
  padding: 2px 8px;
  border-radius: 4px;
  text-transform: uppercase;
}
.order-bump-corpo { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--slate-300); line-height: 1.5; }

.checkout-email { margin-bottom: 24px; }
.checkout-email label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  font-family: "Courier New", monospace;
  color: var(--slate-400);
  letter-spacing: 1px;
  margin-bottom: 8px;
}
.checkout-email input[type="email"] {
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--slate-700);
  background: var(--slate-950);
  color: #fff;
  font-size: 15px;
  transition: border-color 0.2s;
}
.checkout-email input[type="email"]:focus {
  outline: none;
  border-color: var(--emerald-400);
}
.checkout-email input[type="email"].invalido { border-color: #f87171; }

.preco-total {
  background: var(--slate-900);
  border: 1px solid var(--slate-800);
  border-radius: 16px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 24px;
}
.preco-total > div > span { font-size: 12px; color: var(--slate-400); display: block; }
.preco-total-desc { font-size: 12px; font-weight: 700; color: var(--emerald-300); }
.preco-total strong { font-size: 24px; font-weight: 900; color: #fff; font-family: "Courier New", monospace; }

.preco-cta { margin-bottom: 24px; }

.btn-preco {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  background: linear-gradient(90deg, var(--emerald-500), var(--teal-400));
  color: var(--slate-950);
  font-weight: 900;
  font-size: 16px;
  padding: 16px;
  border-radius: 16px;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);
  transition: transform 0.2s, box-shadow 0.2s;
}
.btn-preco:hover { transform: scale(1.02); box-shadow: 0 12px 32px rgba(16, 185, 129, 0.5); }
.btn-preco .ico { width: 20px; height: 20px; }

.msg-compra {
  min-height: 18px;
  margin: 10px 0 0;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  color: var(--slate-300);
}
.msg-compra.ok { color: var(--emerald-300); }
.msg-compra.erro { color: #f87171; }

.preco-formas {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  font-size: 11px;
  color: var(--slate-400);
  margin-top: 12px;
  flex-wrap: wrap;
}
.preco-formas span { display: inline-flex; align-items: center; gap: 4px; }
.preco-formas .ico { width: 14px; height: 14px; color: var(--emerald-400); }

.preco-garantia {
  display: flex;
  align-items: center;
  gap: 16px;
  border-top: 1px solid var(--slate-900);
  padding-top: 16px;
}
.garantia-selo {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--amber-400);
  font-weight: 900;
  font-size: 14px;
  flex-shrink: 0;
}
.preco-garantia h5 { font-size: 12px; font-weight: 700; color: #fff; }
.preco-garantia p { font-size: 11px; color: var(--slate-400); margin-top: 2px; }

/* ============ FAQ ============ */
.secao-faq {
  padding: 64px 0;
  background: var(--slate-950);
  color: #fff;
  border-bottom: 1px solid var(--slate-800);
}
@media (min-width: 768px) { .secao-faq { padding: 96px 0; } }

.container-faq { max-width: 896px; }

.faq-lista { display: flex; flex-direction: column; gap: 16px; }

.faq-item { background: var(--slate-900); border: 1px solid var(--slate-800); border-radius: 16px; overflow: hidden; transition: border-color 0.2s; }
.faq-item.aberto { border-color: rgba(16, 185, 129, 0.4); }

.faq-pergunta {
  width: 100%;
  background: none;
  border: none;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  text-align: left;
  cursor: pointer;
  font-family: var(--fonte);
  transition: color 0.2s;
}
.faq-pergunta:hover { color: var(--emerald-300); }
.faq-pergunta .ico { width: 20px; height: 20px; color: var(--emerald-400); transition: transform 0.3s; flex-shrink: 0; }
.faq-item.aberto .faq-pergunta .ico { transform: rotate(180deg); }

.faq-num { color: var(--emerald-400); font-family: "Courier New", monospace; font-size: 12px; font-weight: 900; margin-right: 8px; }

.faq-resposta {
  display: none;
  padding: 0 20px 20px;
  font-size: 13px;
  color: var(--slate-300);
  line-height: 1.6;
  border-top: 1px solid rgba(30, 41, 59, 0.6);
  padding-top: 12px;
}
.faq-item.aberto .faq-resposta { display: block; }

/* ============ FOOTER ============ */
.footer {
  background: var(--slate-950);
  color: var(--slate-400);
  font-size: 12px;
  padding: 48px 0;
  border-top: 1px solid var(--slate-900);
}

.footer-topo {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-bottom: 1px solid var(--slate-900);
  padding-bottom: 32px;
}
@media (min-width: 768px) { .footer-topo { flex-direction: row; } }

.footer-marca { display: flex; align-items: center; gap: 10px; }
.footer-marca-icone {
  width: 32px;
  height: 32px;
  border-radius: 12px;
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(16, 185, 129, 0.4);
  color: var(--emerald-400);
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer-marca-icone .ico { width: 20px; height: 20px; }
.footer-marca > div > span { font-size: 16px; font-weight: 800; color: #fff; letter-spacing: -0.5px; }
.footer-marca > div > span span { color: var(--emerald-400); }
.footer-marca p { font-size: 10px; color: var(--slate-500); }

.footer-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 24px; font-weight: 600; color: var(--slate-300); }
.footer-links a { color: var(--slate-300); text-decoration: none; transition: color 0.2s; }
.footer-links a:hover { color: var(--emerald-400); }

.btn-footer {
  background: var(--slate-900);
  color: var(--emerald-400);
  border: 1px solid rgba(16, 185, 129, 0.4);
  font-weight: 700;
  font-size: 12px;
  padding: 8px 16px;
  border-radius: 12px;
  text-decoration: none;
  transition: background 0.2s;
}
.btn-footer:hover { background: var(--slate-800); }

.footer-acoes { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: center; }

.btn-footer-ghost {
  background: transparent;
  color: var(--emerald-300);
  border: 1px solid rgba(16, 185, 129, 0.35);
  font-weight: 700;
  font-size: 12px;
  padding: 8px 16px;
  border-radius: 12px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: background 0.2s, border-color 0.2s;
}
.btn-footer-ghost:hover { background: rgba(16, 185, 129, 0.1); border-color: rgba(16, 185, 129, 0.6); color: var(--emerald-200); }
.btn-footer-ghost .ico { width: 14px; height: 14px; }

.footer-colunas {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  padding-top: 32px;
  font-size: 11px;
  color: var(--slate-500);
}
@media (min-width: 768px) { .footer-colunas { grid-template-columns: repeat(3, 1fr); } }

.footer-colunas h5 { font-weight: 700; color: var(--slate-300); margin-bottom: 4px; }
.footer-colunas p { line-height: 1.6; display: flex; align-items: flex-start; gap: 4px; }
.footer-colunas .ico { width: 14px; height: 14px; color: var(--emerald-400); margin-top: 2px; }

.footer-direitos { text-align: left; }
@media (min-width: 768px) { .footer-direitos { text-align: right; } }
.footer-direitos p { justify-content: flex-start; }
@media (min-width: 768px) { .footer-direitos p { justify-content: flex-end; } }
.footer-direitos p:last-child { color: var(--slate-600); }

/* ============ STICKY CTA ============ */
.sticky-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 30;
  background: rgba(15, 23, 42, 0.95);
  border-top: 1px solid rgba(16, 185, 129, 0.3);
  padding: 12px;
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(8px);
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.3s, transform 0.3s;
  pointer-events: none;
}
.sticky-cta.visivel { opacity: 1; transform: translateY(0); pointer-events: auto; }

.sticky-cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.sticky-info { display: none; align-items: center; gap: 12px; }
@media (min-width: 640px) { .sticky-info { display: flex; } }

.sticky-mr {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(16, 185, 129, 0.3);
  color: var(--emerald-400);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
}

.sticky-nome { font-size: 12px; font-weight: 700; color: #fff; }
.sticky-selo {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(245, 158, 11, 0.2);
  color: var(--amber-300);
  font-size: 10px;
  font-family: "Courier New", monospace;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid rgba(245, 158, 11, 0.3);
  margin-left: 8px;
}
.sticky-selo .ico { width: 12px; height: 12px; color: var(--amber-300); }
.sticky-preco { font-size: 12px; font-weight: 900; color: var(--emerald-400); display: block; margin-top: 2px; }
.sticky-preco em { font-style: normal; font-size: 10px; color: var(--slate-400); font-weight: 400; }

.sticky-mobile-preco { text-align: left; }
@media (min-width: 640px) { .sticky-mobile-preco { display: none; } }
.sticky-mobile-preco span { font-size: 10px; color: var(--slate-400); display: block; font-family: "Courier New", monospace; }
.sticky-mobile-preco strong { font-size: 18px; font-weight: 900; color: var(--emerald-400); }

.btn-sticky {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(90deg, var(--emerald-500), var(--teal-400));
  color: var(--slate-950);
  font-weight: 900;
  font-size: 12px;
  padding: 10px 24px;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.2);
  transition: transform 0.2s;
  flex: 1;
  justify-content: center;
}
@media (min-width: 640px) { .btn-sticky { flex: none; } }
.btn-sticky:hover { transform: scale(1.05); }
.btn-sticky .ico { width: 16px; height: 16px; }

/* ============ ANIMAÇÕES ============ */
@keyframes pulsar {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
@keyframes ping {
  0% { transform: scale(1); opacity: 1; }
  75%, 100% { transform: scale(2); opacity: 0; }
}
@keyframes quicar {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(6px); }
}

/* ============================================================
   MOBILE FIXES — Landing Page Responsiva
   ============================================================ */

/* === Overflow & Tipografia Global === */
body.pagina-landing { overflow-x: hidden; }
body.pagina-landing { padding-bottom: 80px; }

h1, h2, h3, h4, h5, p, span, li, td, th, label, a {
  overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
}

img, svg, video, canvas { max-width: 100%; height: auto; }

/* === Header Mobile === */
@media (max-width: 767px) {
  .header-inner { gap: 8px; padding: 0 12px; }
  .btn-header-ghost span, .btn-header-outline span { display: none; }
  .btn-header-ghost, .btn-header-outline { padding: 7px; }
  .btn-header-cta span { display: none; }
  .btn-header-cta { padding: 8px 10px; }
  .btn-header-cta em { display: none; }
}

/* === Top Banner Mobile === */
@media (max-width: 480px) {
  .top-banner { padding: 8px 12px; }
  .top-banner-inner { justify-content: center; text-align: center; }
  .top-banner-left { flex-direction: column; gap: 4px; }
  .top-banner-right { flex-direction: column; gap: 8px; align-items: center; }
  .timer-box span { display: none; }
}

/* === Hero Mobile === */
@media (max-width: 640px) {
  .hero { padding: 32px 0 48px; }
  .hero h1 { font-size: 28px; letter-spacing: -0.5px; line-height: 1.15; }
  .hero-sub { font-size: 15px; line-height: 1.5; }
  .hero-preco { flex-direction: column; text-align: center; gap: 8px; padding: 12px; }
  .hero-preco-valor { justify-content: center; flex-wrap: wrap; }
  .hero-preco-valor strong { font-size: 22px; }
  .hero-preco-badge { align-self: center; }
  .hero-ctas { gap: 10px; }
  .hero-garantias { flex-direction: column; align-items: center; gap: 8px; font-size: 11px; }
  .preview-media { font-size: 24px; }
  .preview-score { flex-direction: column; gap: 12px; }
  .preview-meta { text-align: left; }
  .preview-bar { flex-wrap: wrap; gap: 8px; }
  .preview-dots em { display: none; }
  .glow-1 { width: 300px; height: 200px; }
  .glow-2 { width: 150px; height: 150px; }
}

/* === Seções Gerais Mobile === */
@media (max-width: 640px) {
  .container { padding: 0 16px; }
  .cabecalho-secao { margin-bottom: 32px; }
  .cabecalho-secao h2 { font-size: 26px; line-height: 1.2; }
  .cabecalho-secao p { font-size: 13px; }
  .pill-emerald, .pill-amber { font-size: 10px; padding: 4px 10px; }
  .cta-barra { flex-direction: column; text-align: center; gap: 16px; padding: 20px; }
  .cta-barra h4 { font-size: 16px; }
  .cta-barra p { font-size: 12px; }
  .btn-cta { width: 100%; justify-content: center; }
}

/* === Demo Frame Mobile === */
@media (max-width: 767px) {
  .demo-topbar { flex-direction: column; align-items: flex-start; padding: 12px; gap: 12px; }
  .demo-resumo { width: 100%; flex-wrap: wrap; gap: 8px; padding: 10px 12px; }
  .demo-resumo > div > span { font-size: 9px; }
  .demo-resumo strong { font-size: 16px; }
  .demo-resumo strong.cor-vermelho { font-size: 11px; }
  .demo-divisor { height: 24px; }
  .demo-identidade h3 { font-size: 13px; }
  .demo-identidade p { font-size: 10px; }
}
@media (max-width: 640px) {
  .demo-panel { padding: 16px; }
  .demo-footer-cta h4 { font-size: 15px; }
  .demo-footer-cta p { font-size: 11px; }
  .demo-footer-cta .btn-primario { font-size: 13px; padding: 12px 24px; }
  .alerta-inteligente { flex-direction: column; gap: 8px; padding: 12px; }
  .alerta-inteligente h4 { font-size: 12px; }
  .alerta-inteligente p { font-size: 12px; }
  .grafico-titulo { flex-direction: column; gap: 6px; }
  .panel-titulo { flex-direction: column; gap: 10px; text-align: center; }
  .meta-resultado-topo { flex-direction: column; gap: 8px; text-align: center; }
  .meta-form { padding: 16px; }
  .meta-resultado { padding: 16px; }
  .pack-preview { padding: 16px; }
  .pack-preview h4 { font-size: 17px; }
  .checklist-aviso { flex-direction: column; gap: 8px; padding: 12px; }
}

/* === Features & Comparação Mobile === */
@media (max-width: 640px) {
  .features-grid { gap: 20px; }
  .feature-card { padding: 20px; border-radius: 16px; }
  .feature-card h3 { font-size: 18px; }
  .comparacao-grid { gap: 20px; }
  .sem-app, .com-app { padding: 20px; border-radius: 16px; }
  .comparacao-topo h3 { font-size: 18px; }
  .sem-app li, .com-app li { font-size: 12px; }
  .btn-comparacao { font-size: 12px; padding: 12px; }
}

/* === Pack Section Mobile === */
@media (max-width: 640px) {
  .pack-container { padding: 20px; border-radius: 16px; }
  .pack-titulo { gap: 16px; }
  .pack-titulo h2 { font-size: 22px; }
  .pack-valor-box > div { font-size: 24px; }
  .pack-acao { padding: 16px; flex-direction: column; text-align: center; }
  .pack-acao-titulo { justify-content: center; }
  .btn-pack { width: 100%; justify-content: center; }
}

/* === Calculadora Mobile === */
@media (max-width: 640px) {
  .calc-container { padding: 20px; border-radius: 16px; }
  .calc-inputs { padding: 16px; }
  .calc-resultado { padding: 20px 16px; }
  .calc-projecao-num strong { font-size: 36px; }
  .calc-botoes { grid-template-columns: repeat(2, 1fr); }
  .calc-btn { font-size: 11px; padding: 10px 6px; }
}

/* === Pricing Mobile === */
@media (max-width: 640px) {
  .preco-card { padding: 16px; border-radius: 16px; }
  .preco-fita { margin: -16px -16px 16px; font-size: 10px; letter-spacing: 1px; padding: 8px 12px; }
  .preco-titulo strong { font-size: 40px; }
  .preco-titulo > div { gap: 6px; }
  .order-bump { padding: 12px; }
  .order-bump-titulo > span { font-size: 13px; }
  .order-bump-corpo { font-size: 11px; }
  .checkout-email input[type="email"] { font-size: 14px; padding: 12px 14px; }
  .preco-total { flex-direction: column; gap: 8px; text-align: center; padding: 12px; }
  .btn-preco { font-size: 14px; padding: 14px; }
  .preco-formas { gap: 10px; font-size: 10px; }
  .preco-garantia { flex-direction: column; text-align: center; gap: 12px; }
}

/* === FAQ Mobile === */
@media (max-width: 640px) {
  .faq-pergunta { padding: 16px; font-size: 13px; gap: 12px; }
  .faq-resposta { padding: 0 16px 16px; font-size: 12px; }
}

/* === Footer Mobile === */
@media (max-width: 640px) {
  .footer { padding: 32px 0; }
  .footer-topo { gap: 16px; padding-bottom: 24px; }
  .footer-links { gap: 12px; font-size: 11px; }
  .footer-colunas { grid-template-columns: 1fr; gap: 20px; padding-top: 24px; }
  .footer-colunas h5 { font-size: 12px; }
  .footer-colunas p { font-size: 11px; line-height: 1.5; }
  .footer-acoes { flex-direction: column; gap: 8px; }
}

/* === Sticky CTA Mobile === */
@media (max-width: 640px) {
  .sticky-cta { padding: 10px 12px; }
  .sticky-cta-inner { gap: 10px; }
  .btn-sticky { font-size: 11px; padding: 10px 16px; }
  .sticky-mobile-preco strong { font-size: 16px; }
}

/* === Scrollbar & Seleção === */
@media (max-width: 767px) {
  ::-webkit-scrollbar { width: 4px; }
  ::-webkit-scrollbar-track { background: transparent; }
  ::-webkit-scrollbar-thumb { background: var(--slate-700); border-radius: 4px; }
  .demo-tabs { scrollbar-width: none; padding: 6px; gap: 4px; }
  .demo-tab { padding: 8px 12px; font-size: 11px; }
}

/* === Correções Adicionais === */
@media (max-width: 480px) {
  .hero-preco { max-width: 100%; }
  .preview-comps { gap: 4px; }
  .comp-card { padding: 6px 2px; }
  .comp-card strong { font-size: 12px; }
  .preview-alerta p { font-size: 11px; }
  .pack-pilares { gap: 12px; }
  .pack-pilares > div { padding: 14px; }
  .preco-card { max-width: 100%; }
}

@media (max-width: 380px) {
  .hero h1 { font-size: 24px; }
  .cabecalho-secao h2 { font-size: 22px; }
  .preco-titulo strong { font-size: 34px; }
  .calc-projecao-num strong { font-size: 30px; }
}
