/* ===== Paleta e base ===== */
:root{
  --bg:#000; --bg2:#0c0b09; --card:#181818; --ink:#fff; --muted:#cfcfcf;
  --gold:#c6ac82; --goldSoft:#e4cda5; --line:rgba(198,172,130,.18);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  background:var(--bg); color:var(--ink);
  font-family:'Montserrat','Ubuntu',Arial,sans-serif;
  margin:0; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

/* ===== Header ===== */
.header-flex{
  position: sticky; top: 0; z-index: 50;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 22px; background:rgba(0,0,0,.72); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.brand_logo img{max-width:180px;height:auto}
.btn-whatsapp{
  background:var(--gold); color:#181818; padding:12px 18px; border:none; border-radius:10px;
  font-weight:800; text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  box-shadow:0 10px 30px rgba(198,172,130,.16);
  transform: translateZ(0); transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.btn-whatsapp:hover{transform:translateY(-2px) scale(1.03); filter:brightness(1.05)}

/* ===== Urgência sticky ===== */
.urgencia{
  position:sticky; top:60px; z-index:49;
  display:flex; gap:10px; align-items:center; justify-content:center; text-align:center;
  padding:8px 14px; background:#1c1408; color:var(--gold); border-bottom:1px solid var(--gold);
  font-weight:700; font-size:.98rem;
}
.urgencia .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);display:inline-block;animation:pulse 1.6s infinite}
.urgencia .urg-cta{
  margin-left:12px; background:var(--gold); color:#181818; padding:6px 10px; border-radius:6px; text-decoration:none; font-weight:800
}
@keyframes pulse{0%{opacity:.2}50%{opacity:1}100%{opacity:.2}}

/* ===== Hero ===== */
.hero{
  position:relative; overflow:hidden; background: radial-gradient(1200px 800px at 70% -10%, rgba(198,172,130,.18), transparent 60%) , var(--bg2);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.hero-wrap{max-width:1080px;margin:52px auto 36px; padding:24px}
.hero-title{
  font-size:clamp(1.8rem, 4vw, 3rem); line-height:1.1; font-weight:800; letter-spacing:.3px; margin:0 0 10px
}
.hero-title span{color:var(--gold)}
.hero-sub{font-size:1.12rem; color:var(--muted); max-width:760px}
.hero-cta{margin-top:20px; display:flex; gap:12px; flex-wrap:wrap}
.btn-primary{
  background:linear-gradient(135deg,var(--gold),#e4cda5); color:#181818; font-weight:900;
  border:none; border-radius:12px; padding:14px 18px; text-decoration:none; display:inline-flex; gap:10px; align-items:center;
  box-shadow:0 10px 40px rgba(198,172,130,.18);
  transform:translateZ(0); transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.btn-primary:hover{transform:translateY(-3px) scale(1.03); filter:brightness(1.03)}
.btn-ghost{
  border:2px solid var(--gold); color:var(--gold); border-radius:12px; padding:12px 16px; text-decoration:none; font-weight:800;
  transition:transform .2s ease, background .2s ease, color .2s ease;
}
.btn-ghost:hover{background:var(--gold); color:#181818; transform:translateY(-3px)}
.hero-bg-fx{
  position:absolute; inset:-20% -10% auto auto; height:420px; width:420px;
  background: conic-gradient(from 180deg at 50% 50%, rgba(198,172,130,.22), transparent 30%, rgba(198,172,130,.22) 60%, transparent 80%);
  filter: blur(40px); opacity:.35; pointer-events:none; animation:rotateFX 14s linear infinite;
}
@keyframes rotateFX{to{transform:rotate(360deg)}}

/* ===== Prova social ===== */
.social-proof{padding:22px 16px}
.sp-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sp-item{background:#101010;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:16px;text-align:center}
.sp-item strong{display:block;color:var(--gold);font-size:1.6rem}
.sp-item span{color:var(--muted);font-size:.98rem}

/* ===== Main / Consulta ===== */
main{max-width:760px;margin:34px auto 0; background:#151515; border-radius:16px; padding:28px 22px; box-shadow:0 0 28px rgba(198,172,130,.08)}
.consulta{text-align:center}
.sec-title{color:var(--gold);font-size:1.6rem;margin:0 0 4px}
.sec-sub{color:var(--muted);margin:0 0 6px}

#form-consulta{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:12px}
#consulta{
  width:min(92%,380px); padding:14px 12px; border-radius:10px; border:1px solid var(--gold);
  font-size:1.08rem; background:#202020; color:var(--ink);
  transition:border-color .2s, transform .15s ease, box-shadow .2s;
  box-shadow:0 8px 24px rgba(0,0,0,.18) inset;
}
#consulta:focus{border-color:#fff; outline:none; transform:translateY(-1px); box-shadow:0 0 0 3px rgba(198,172,130,.18)}
.btn-consultar{
  position:relative; overflow:hidden; min-width:180px;
  background:linear-gradient(135deg,var(--gold),#e4cda5); color:#181818; font-weight:900; border:none; border-radius:10px;
  font-size:1.05rem; padding:12px 22px; cursor:pointer; box-shadow:0 10px 30px rgba(198,172,130,.14);
  transform: translateZ(0); transition: transform .15s ease, filter .15s ease;
}
.btn-consultar:hover{transform:translateY(-2px); filter:brightness(1.03)}
.btn-consultar .btn-spinner{
  position:absolute; inset:0; display:none; place-items:center; background:rgba(0,0,0,.06);
}
.btn-consultar.loading .btn-spinner{display:grid}
.btn-consultar.loading .btn-txt{opacity:.0}
.btn-spinner::after{
  content:""; width:18px;height:18px;border:3px solid #181818;border-top-color:transparent;border-radius:50%; animation:spin .7s linear infinite
}
@keyframes spin{to{transform:rotate(360deg)}}
.lgpd{font-size:.9rem;color:var(--gold);margin-top:2px}
#resultado{margin-top:22px; min-height:42px}

/* ===== Result Cards ===== */
.result-card{background:var(--card);border-radius:12px;padding:20px;margin:0 auto 16px;box-shadow:0 10px 30px rgba(198,172,130,.12);border:2px solid var(--gold);max-width:560px;animation:fadeInUp .6s}
.result-card.alerta{border:3px solid var(--gold);background:#1c1408}
.result-card .msg{font-size:1.12rem;font-weight:700;color:var(--gold);margin-bottom:8px;text-align:center}
.result-card .dados{font-size:1.02rem;color:#fff;margin-bottom:6px;text-align:center}
.result-card .alerta-txt{color:var(--gold);font-weight:800;font-size:1.02rem;margin-top:10px;text-align:center}
.result-card .cta-btn{
  background:linear-gradient(135deg,var(--gold),#e4cda5); color:#181818;border:none;border-radius:10px;font-weight:900;font-size:1.02rem;
  padding:12px 20px;margin:14px auto 4px;display:block;cursor:pointer;box-shadow:0 10px 30px rgba(198,172,130,.14);
  transition:transform .15s ease, filter .15s ease;
}
.result-card .cta-btn:hover{transform:translateY(-2px);filter:brightness(1.03)}

/* ===== Benefícios ===== */
.benefits{max-width:1060px;margin:44px auto 0;padding:0 14px}
.b-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.b-card{background:#121212;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px;text-align:center;transition:transform .2s, box-shadow .2s}
.b-card:hover{transform:translateY(-4px);box-shadow:0 18px 50px rgba(198,172,130,.10)}
.b-card i{font-size:24px;color:var(--gold)}
.b-card h3{margin:8px 0 4px;font-size:1.1rem}
.b-card p{color:var(--muted);margin:0}

/* ===== Decisões ===== */
.decisoes{margin:54px auto 36px;max-width:1060px;padding:0 12px}
.decisoes h3{color:var(--gold);font-size:1.6rem;text-align:center;margin-bottom:26px;letter-spacing:.3px}
.decisoes-cards{display:flex;flex-wrap:wrap;gap:22px;justify-content:center}
.decisao-card{background:#181818;border:2px solid var(--gold);border-radius:14px;padding:0 0 16px;width:280px;box-shadow:0 10px 30px rgba(198,172,130,.10);display:flex;flex-direction:column;align-items:center;transition:transform .18s, box-shadow .22s}
.decisao-card:hover{box-shadow:0 22px 50px rgba(198,172,130,.22);transform:translateY(-6px) scale(1.02)}
.decisao-card img{width:100%;height:170px;object-fit:cover;border-radius:12px 12px 0 0;margin-bottom:10px;border-bottom:1px solid var(--gold);background:#222}
.decisao-texto{color:#fff;font-size:.98rem;text-align:center;margin:0 12px}
.decisao-selo{display:block;font-size:.92rem;color:#181818;background:var(--gold);border-radius:6px;font-weight:800;padding:4px 11px;margin:6px 0}

/* ===== Steps ===== */
.steps{max-width:1000px;margin:24px auto 0;padding:0 14px}
.s-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s-item{background:#111;border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:18px;text-align:center;position:relative;overflow:hidden}
.s-item::after{content:"";position:absolute;inset:auto -20% -20% auto;width:120px;height:120px;background:radial-gradient(closest-side, rgba(198,172,130,.18), transparent 70%);filter:blur(10px)}
.s-num{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#181818;font-weight:900;margin:0 auto 8px}

/* ===== Testimonials ===== */
.testimonials{max-width:1000px;margin:36px auto 0;padding:0 14px}
.t-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.t-item{background:#121212;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px;font-style:italic}
.t-item footer{margin-top:8px;color:var(--gold);font-style:normal;font-weight:700}

/* ===== FAQ ===== */
.faq{max-width:900px;margin:40px auto 0;padding:0 14px}
.faq-item{border-bottom:1px solid rgba(255,255,255,.08)}
.faq-q{width:100%;text-align:left;background:transparent;border:none;color:#fff;font-weight:700;padding:16px 0;font-size:1.02rem;display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.faq-q::after{content:"+";color:var(--gold);font-weight:900;transition:transform .2s}
.faq-q[aria-expanded="true"]::after{content:"–"}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;color:var(--muted);padding-right:20px}
.faq-item.open .faq-a{max-height:220px;padding-bottom:12px}

/* ===== CTA Final ===== */
.cta-final{margin:44px auto 50px;max-width:1000px;text-align:center;padding:0 14px}
.cta-final h3{font-size:1.5rem;margin:0 0 12px;color:var(--gold)}

/* ===== Footer ===== */
footer{background:#000;color:var(--gold);text-align:center;padding:30px 0 24px;position:relative;font-size:1rem;border-top:1px solid rgba(255,255,255,.06)}
.rodape-whatsapp{margin-bottom:10px}
.rodape-whatsapp a{display:inline-block;background:var(--gold);color:#181818!important;padding:12px 20px;border-radius:10px;text-decoration:none;font-weight:900;box-shadow:0 10px 30px rgba(198,172,130,.10)}
.institucional{margin-top:8px;color:var(--gold);font-size:.95rem}

/* ===== AOS (reveal on scroll) ===== */
.aos{opacity:0; transform: translateY(30px); transition: opacity .6s ease, transform .6s ease}
.aos.aos-in{opacity:1; transform:none}

/* ===== Utilities / Animations ===== */
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

@media (max-width:1050px){
  .b-grid,.s-grid,.t-grid{grid-template-columns:1fr}
  .sp-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .hero-wrap{padding:18px}
  .sp-grid{grid-template-columns:1fr}
  .decisoes-cards{flex-direction:column;align-items:center}
}

/* --- PATCH: blindar estilo dos botões contra CSS externo --- */
a.btn-primary, a.btn-ghost, .btn-primary, .btn-ghost,
.header-flex .btn-whatsapp, .rodape-whatsapp a, .result-card .cta-btn {
  display:inline-flex; align-items:center; gap:10px; text-decoration:none !important;
  font-weight:900; border-radius:12px;
}
a.btn-primary, .btn-primary {
  background:linear-gradient(135deg, var(--gold), #e4cda5) !important;
  color:#181818 !important; padding:14px 18px !important; border:0 !important;
  box-shadow:0 10px 40px rgba(198,172,130,.18);
}
a.btn-ghost, .btn-ghost {
  border:2px solid var(--gold) !important; color:var(--gold) !important;
  padding:12px 16px !important; background:transparent !important;
}
.hero-cta .btn-primary:hover,
.cta-final .btn-primary:hover,
.result-card .cta-btn:hover,
.header-flex .btn-whatsapp:hover { transform:translateY(-2px) scale(1.02); filter:brightness(1.03); }
.hero-cta a { margin-right:6px; }


/* ====== HOTFIX DE PROPORÇÃO / ALINHAMENTO ====== */

/* Header “container” sem mexer no HTML */
.header-flex{
  /* mantém a barra full-width, mas centraliza o conteúdo como se tivesse container */
  padding-left: max(22px, calc((100vw - 1200px)/2));
  padding-right: max(22px, calc((100vw - 1200px)/2));
}

/* HERO: tipografia e respiros mais equilibrados */
.hero-wrap{max-width:1200px; padding:56px 22px 28px}
.hero-title{
  font-size:clamp(1.9rem, 3.3vw, 2.6rem);  /* antes era maior */
  line-height:1.15;
  letter-spacing:.2px;
}
.hero-sub{font-size:1.08rem; max-width:660px; color:var(--muted)}

/* Botões mais “brandos” (menos gritados) e com baseline correto */
.btn-primary,
.btn-ghost,
.btn-whatsapp{font-weight:700; letter-spacing:.2px} /* antes 900 */
.btn-primary{padding:13px 18px}
.btn-ghost{padding:11px 16px}
.btn-primary i, .btn-ghost i, .btn-whatsapp i{font-size:1em; margin-top:1px}

/* Espaçamento entre CTA e os itens abaixo (evita “encavalado”) */
.hero-cta{gap:10px; margin-top:18px; margin-bottom:8px}

/* Itens “trust-badges” em linha, com cara de chip */
.trust-badges{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px}
.trust-badges .badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 10px; border:1px solid rgba(255,255,255,.08);
  border-radius:10px; background:#101010;
  color:var(--muted); font-size:.96rem
}
.trust-badges .badge i{color:var(--gold); font-size:.95rem}

/* Cards da prova social um pouco mais compactos em desktop amplo */
.sp-grid{max-width:1100px}

/* ===== Especialista responsável (humaniza o CTA) ===== */
.specialist{ max-width:980px; margin:38px auto 0; padding:0 14px }
.specialist-card{
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;
  background:#121212; border:1px solid var(--line); border-radius:18px;
  padding:22px; box-shadow:0 14px 40px rgba(198,172,130,.10);
}
.specialist-card img{
  width:140px; height:178px; object-fit:cover; border-radius:14px;
  border:2px solid var(--gold); flex-shrink:0;
}
.specialist-info{ flex:1; min-width:240px }
.specialist-tag{
  display:inline-block; color:var(--gold); font-weight:800; font-size:.86rem;
  letter-spacing:.4px; text-transform:uppercase; margin-bottom:4px;
}
.specialist-info h3{ margin:2px 0 8px; font-size:1.4rem; color:#fff }
.specialist-info p{ color:var(--muted); margin:0 0 14px; font-size:.99rem; line-height:1.5 }
@media (max-width:560px){
  .specialist-card{ flex-direction:column; text-align:center; padding:20px }
  .specialist-info{ min-width:0 }
}

/* ===== Selo "ao vivo" (urgência + confiança) ===== */
.badge-online{
  border-color:rgba(60,220,130,.35) !important;
  background:rgba(60,220,130,.08) !important;
  color:#bdf5d6 !important;
}
.dot-online{
  width:9px; height:9px; border-radius:50%; background:#3cdc82; display:inline-block;
  box-shadow:0 0 0 0 rgba(60,220,130,.6); animation:dotPulse 1.8s infinite;
}
@keyframes dotPulse{
  0%{box-shadow:0 0 0 0 rgba(60,220,130,.55)}
  70%{box-shadow:0 0 0 9px rgba(60,220,130,0)}
  100%{box-shadow:0 0 0 0 rgba(60,220,130,0)}
}

/* ===== Botão flutuante de WhatsApp ===== */
.wpp-float{
  position:fixed; right:18px; bottom:18px; z-index:80;
  display:inline-flex; align-items:center; gap:9px;
  background:#25D366; color:#fff !important; text-decoration:none !important;
  padding:15px 20px; border-radius:50px; font-weight:800; font-size:1rem;
  box-shadow:0 14px 34px rgba(37,211,102,.38);
  animation:wppFloatPulse 2.6s ease-in-out infinite;
  transition:transform .2s ease, filter .2s ease;
}
.wpp-float:hover{ transform:translateY(-3px) scale(1.05); filter:brightness(1.05) }
.wpp-float i{ font-size:1.35rem }
@keyframes wppFloatPulse{
  0%,100%{ box-shadow:0 14px 34px rgba(37,211,102,.38) }
  50%{ box-shadow:0 14px 34px rgba(37,211,102,.38), 0 0 0 12px rgba(37,211,102,.10) }
}
@media (max-width:560px){
  .wpp-float-text{ display:none }
  .wpp-float{ padding:16px; border-radius:50% }
  .wpp-float i{ font-size:1.5rem }
}

/* ===== Realce nos números da prova social ===== */
.sp-item{ transition:transform .2s ease, box-shadow .2s ease }
.sp-item:hover{ transform:translateY(-3px); box-shadow:0 16px 40px rgba(198,172,130,.14) }

/* Ajustes mobile para tudo ficar proporcional */
@media (max-width: 800px){
  .hero-wrap{padding:38px 16px 20px}
  .hero-title{font-size:clamp(1.6rem, 6vw, 2.2rem)}
  .hero-sub{font-size:1rem; max-width:520px}
  .trust-badges .badge{font-size:.9rem; padding:7px 9px}
  .header-flex{
    padding-left:14px;
    padding-right:14px;
  }
}
