/* ==========================================================================
   price-trust.css
   Blocos de confiança e urgência no card de preço da LP:
   - Selo "Lote de lançamento" acima do preço
   - Reforço da garantia abaixo do botão
   - Microcopy de segurança abaixo da garantia
   Componente modular, mobile-first, reaproveita tokens de style.css.
   ========================================================================== */

/* ---------- Selo "Lote de lançamento" (acima do preço) ---------- */

.launch-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  margin-bottom: 14px;
  border: 1px solid rgba(199, 255, 56, 0.32);
  border-radius: 100px;
  background: rgba(199, 255, 56, 0.06);
  color: var(--lime);
  font-family: "Space Grotesk", sans-serif;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.launch-badge .launch-icon {
  font-size: 0.9em;
  line-height: 1;
}

/* ---------- Reforço da garantia (abaixo do botão) ---------- */

.guarantee-line {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid rgba(199, 255, 56, 0.2);
  border-radius: 10px;
  background: rgba(199, 255, 56, 0.04);
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.5;
  text-align: left;
}

.guarantee-line .guarantee-icon {
  flex-shrink: 0;
  font-size: 1.05rem;
  line-height: 1;
}

.guarantee-line strong {
  color: var(--lime);
}

/* ---------- Microcopy de segurança (abaixo da garantia) ---------- */

.security-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 14px;
  margin-top: 14px;
  color: #8f98aa;
  font-size: 0.72rem;
  letter-spacing: 0.01em;
}

.security-list span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.security-list .security-icon {
  font-size: 0.92em;
}

/* ---------- Ajuste do compat-note dentro do price-box ---------- */

.price-box .compat-note-inline {
  margin-top: 16px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 138, 61, 0.22);
  border-radius: 10px;
  background: rgba(255, 138, 61, 0.05);
  color: #c6ccd7;
  font-size: 0.76rem;
  line-height: 1.55;
  text-align: left;
}

.price-box .compat-note-inline strong {
  color: var(--orange);
}

/* ---------- Telas maiores ---------- */

@media (min-width: 700px) {
  .launch-badge {
    font-size: 0.7rem;
  }

  .guarantee-line {
    font-size: 0.86rem;
  }
}