/* =============================================================
   GARANTIA + COMENTARIOS — NP-vsl
   Equivalente ao que nas paginas ml vinha do bootstrap + main.css.
   Tudo escopado em .esconder para nao afetar o resto da pagina.
   Carregar DEPOIS de offer-shims.css.
   ============================================================= */

/* ---------- BLOCO BRANCO (garantia -> comentarios -> oferta de baixo) ---------- */
/* vai da garantia ate o footer; o padding-bottom substitui o padding preto
   que o .article-container tinha embaixo (zerado no style.css). */
.esconder .offer-white {
  background: #fff;
  color: #231f20;
  margin-top: 1.5rem;
  padding-bottom: 2rem;
}

/* ---------- GARANTIA ---------- */
.esconder #guarantee {
  position: relative;
  background-image: linear-gradient(45deg, #2d5aa0, #1a3d7c);
  color: #fff;
  text-align: center;
}

.esconder #guarantee .container {
  max-width: 1100px;
  padding: 2.5rem 0.75rem;
}

.esconder #guarantee figure {
  margin: 0 0 1rem;
}

.esconder #guarantee img.guarantee-badge {
  display: block;
  width: 100%;
  max-width: 200px;
  height: auto;
  margin: 0 auto;
}

.esconder #guarantee h2 {
  color: #fff;
  font-size: 1.5em;
  margin: 0 0 1rem;
}

.esconder #guarantee .guarantee-content p {
  margin: 0;
  font-size: 0.85em;
  line-height: 1.6;
}

/* classes utilitarias usadas pelo guarantee-leads.js (vinham do bootstrap) */
.esconder .position-relative {
  position: relative;
}

.esconder .text-center {
  text-align: center;
}

/* ---------- COMENTARIOS ---------- */
.esconder .comments {
  max-width: 720px;
  margin: 2rem auto;
  background: #fff;
  padding: 20px;
  border: 1px solid silver;
  border-radius: 12px;
}

.esconder .comments-title {
  font-size: 18px;
  font-weight: bold;
  margin: 0 0 20px;
}

.esconder .comment {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
}

.esconder .comment-body {
  background: #f0f2f5;
  border-radius: 14px;
  padding: 12px 14px;
  width: 100%;
}

.esconder .comment-name {
  font-size: 14px;
  font-weight: bold;
  color: #1877f2;
  margin-bottom: 4px;
}

.esconder .comment-text {
  font-size: 14px;
  color: #050505;
  line-height: 1.4;
}

.esconder .comment-footer {
  margin-top: 8px;
  font-size: 12px;
  color: #65676b;
}

.esconder .comments-fb-label {
  text-align: center;
  font-size: 12px;
  color: #65676b;
  margin: 1rem 0 0;
}
