/*
 * SPI MENTORIAS, PÁGINA DE VENDA (2026-10-12). Escopo: body.venda-mentorias (loja/mentorias.html).
 *
 * A página usa as classes de loja/css/spi-venda.css (hero escuro e dourado, celulares com tela
 * real, diferenciais em linhas alternadas, tiras de telas, grade do básico). Aqui fica só o que é
 * desta página: o selo "Em breve" do topo e as listas da seção de benefícios.
 */
.venda-mentorias [id] { scroll-margin-top: 1rem; }

/* o selo do topo no lugar do preço: o produto ainda está "Em breve" */
.venda-mentorias .mt-embreve {
  display: flex; flex-direction: column; gap: .25rem;
  max-width: 36rem; margin-top: 1.3rem; padding: .9rem 1.1rem;
  border: 1px solid rgba(241, 207, 107, .4); border-left: 4px solid #f1cf6b; border-radius: .9rem;
  background: rgba(241, 207, 107, .08);
}
.venda-mentorias .mt-embreve strong {
  color: #f8e3a6; font-size: 1.05rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.venda-mentorias .mt-embreve span { color: rgba(252, 244, 232, .88); font-size: .95rem; line-height: 1.5; }

/* os três blocos de benefícios: mentor, mentorado e mentoria */
.venda-mentorias .mt-beneficios { grid-template-columns: minmax(0, 1fr); }
.venda-mentorias .mt-lista { margin: .6rem 0 0; padding: 0; list-style: none; display: grid; gap: .75rem; }
.venda-mentorias .mt-lista li {
  position: relative; padding-left: 1.2rem; color: var(--sv-mudo, #bdbdbd); font-size: .93rem; line-height: 1.55;
}
.venda-mentorias .mt-lista li::before {
  content: ""; position: absolute; left: 0; top: .6em; width: .5rem; height: .5rem; border-radius: 50%; background: var(--sv-ouro, #e6bb5a);
}
.venda-mentorias .mt-lista strong { color: #fff; font-weight: 700; }
@media (min-width: 900px) {
  .venda-mentorias .mt-beneficios { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* o chamado de contato, em dois botões lado a lado quando cabe */
.venda-mentorias .mt-contato { margin-top: 1.4rem; }
.venda-mentorias .mt-contato .btn-ghost {
  padding: .5rem 1rem; border: 1px solid rgba(255, 255, 255, .4); border-radius: 999px; color: #fff;
}