/* =========================================================
   Lais Vascular — blocos de conversão para páginas que
   recebem tráfego pago (varizes, vasinhos).
   Traz para dentro do site o que funcionava nas /lp/*:
   CTA acima da dobra, sinais de confiança, prova social,
   faixa final e barra fixa no mobile.
   ========================================================= */

/* ---------- Abertura e CTA acima da dobra ----------
   No celular a primeira tela precisa caber título + resumo + botão.
   Por isso o resumo é curto e o texto completo vem depois da imagem. */
.lead-resumo{
  margin:0;
  font-size:1.06rem;
  line-height:1.6;
  color:#4a4038;
}
.lead-cta{
  margin:18px 0 6px;
}
@media (max-width:820px){
  .lead-resumo{font-size:1rem}
  .lead-cta{margin-top:16px}
}

/* Nota de CRM e atendimento — mesma tipografia e a mesma quebra em duas
   linhas fixas da home (.hero-note em home-tweaks.css), para não sobrar
   palavra órfã no celular */
.lead-cta-note{
  margin:16px 0 0;
  font-size:clamp(12.6px,0.9vw,14px);
  line-height:1.34;
  color:#7a6d5d;
  font-weight:400;
  letter-spacing:0;
}
.lead-cta-note .nota-forte{
  display:block;
  font-weight:600;
  color:#5f5346;
}
.lead-cta-note .nota-sub{display:block}

/* Selos de confiança */
.trust-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}
.trust-chips span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:12.5px;
  font-weight:600;
  padding:8px 13px;
  border-radius:999px;
  border:1px solid rgba(200,176,138,.45);
  background:rgba(200,176,138,.14);
  color:#5c4d33;
}
.trust-chips span::before{
  content:"";
  width:14px;height:14px;flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A89273' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Subtítulo dentro de um bloco de tratamento — precisa se distinguir
   dos rótulos em caixa alta dos cartões de .treat-facts */
.treat-block > h4{
  font-size:1.06rem;
  font-weight:700;
  letter-spacing:-.01em;
  margin:24px 0 6px;
  color:#2f2a24;
}

/* ---------- Lista de sinais / sintomas ---------- */
.signal-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:18px;
}
.signal-grid div{
  display:flex;
  align-items:flex-start;
  gap:11px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  padding:16px 18px;
  box-shadow:0 10px 26px rgba(0,0,0,.06);
}
.signal-grid div::before{
  content:"";
  width:19px;height:19px;flex:none;margin-top:2px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A89273' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E") center/contain no-repeat;
}
.signal-grid p{
  margin:0;
  color:var(--muted,#5a5a5a);
  line-height:1.55;
  font-size:.95rem;
}
@media (max-width:900px){.signal-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.signal-grid{grid-template-columns:1fr}}

/* ---------- Faixa de CTA final ---------- */
.cta-band{
  margin-top:8px;
  padding:34px 30px;
  border-radius:26px;
  text-align:center;
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(250,245,237,.96));
  border:1px solid rgba(76,58,35,.10);
  box-shadow:0 18px 40px rgba(63,45,29,.10);
}
.cta-band h2{margin:0 0 8px}
.cta-band p{
  margin:0 auto 18px;
  max-width:560px;
  color:var(--muted,#5a5a5a);
  line-height:1.62;
}
.cta-band .btn-wa{display:inline-flex}
.cta-band .band-note{
  margin:14px 0 0;
  font-size:.88rem;
  color:#7a6f63;
}

/* ---------- Barra fixa de agendamento (mobile) ---------- */
.sticky-cta{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:900;
  display:none;
  padding:8px 14px calc(8px + env(safe-area-inset-bottom));
  background:rgba(246,241,234,.97);
  border-top:1px solid rgba(76,58,35,.12);
  box-shadow:0 -8px 24px rgba(63,45,29,.10);
  backdrop-filter:blur(10px);
}
/* Barra discreta: alta o suficiente para o polegar, baixa o suficiente
   para não competir com o conteúdo */
.sticky-cta .btn-wa{
  width:100%;
  padding:12px 16px !important;
  font-size:.95rem;
}

@media (max-width:820px){
  .sticky-cta{display:block}
  /* espaço para a barra não cobrir o rodapé */
  body.has-sticky-cta footer{padding-bottom:96px}
  /* o flutuante redondo vira redundante com a barra */
  body.has-sticky-cta .whats-fab{display:none !important}

  /* Com JS, a barra some enquanto houver outro botão de WhatsApp na tela
     (track.js cuida disso). Sem JS, ela fica sempre visível. */
  .sticky-cta.js-auto{
    transform:translateY(115%);
    opacity:0;
    pointer-events:none;
    transition:transform .28s ease, opacity .28s ease;
  }
  .sticky-cta.js-auto.is-on{
    transform:none;
    opacity:1;
    pointer-events:auto;
  }
}
@media (max-width:820px) and (prefers-reduced-motion: reduce){
  .sticky-cta.js-auto{transition:none}
}

@media (prefers-reduced-motion: reduce){
  .signal-grid div,.cta-band{transition:none !important}
}
