:root{
  --bg:#eef2f6;           /* fundo claro estilo site */
  --card:#ffffff;
  --ink:#0b2540;          /* azul escuro */
  --muted:#52657a;
  --line:#d9e2ec;
  --brand:#0b4f87;        /* azul principal */
  --brand2:#19c37d;       /* verde */
  --accent:#ff8a2a;       /* laranja CTA */
  --shadow: 0 14px 40px rgba(2, 16, 30, .12);
  --radius: 18px;
  --max: 1120px;
  --font: "Montserrat", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--font); color:var(--ink); background: var(--bg);
}
a{color:inherit}
img{max-width:100%; display:block}

.container{max-width:var(--max); margin:0 auto; padding:0 18px}
.section{padding:72px 0}
@media (max-width: 720px){ .section{padding:54px 0} }

/* TOPBAR branco (como você pediu) */
.topbar{
  position: sticky; top:0; z-index:60;
  background:#fff;
  border-bottom: 1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding: 12px 0;
  gap: 14px;
}
.brand{
  display:flex; align-items:center; gap: 10px;
  text-decoration:none;
}
.brand img{height:34px; width:auto}
.brand .name{
  font-weight: 900;
  letter-spacing:-.2px;
}
.navlinks{display:flex; gap:18px; align-items:center}
.navlinks a{font-weight:750; text-decoration:none; color: var(--muted)}
.navlinks a:hover{color: var(--ink)}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  padding: 14px 18px;
  border-radius: 999px;
  border: 1px solid rgba(11,79,135,.14);
  text-decoration:none;
  font-weight: 900;
  letter-spacing:.2px;
  transition: transform .15s ease, filter .15s ease;
}
.btn:hover{transform: translateY(-1px); filter: brightness(1.02)}
.btn:focus{outline: 3px solid rgba(11,79,135,.22); outline-offset: 3px}
.btn-primary{
  background: linear-gradient(180deg, var(--accent) 0%, #ff6a00 100%);
  border-color: rgba(0,0,0,.10);
  color:#1c0b00;
  box-shadow: 0 16px 36px rgba(255,122,0,.22);
}
.btn-secondary{
  background:#fff;
  color: var(--brand);
}
.btn-ghost{
  background: rgba(11,79,135,.06);
  border-color: rgba(11,79,135,.10);
  color: var(--brand);
}

/* HERO dramático com fundo escuro (só a faixa) */
.hero{
  background:
    radial-gradient(1200px 520px at 18% 12%, rgba(25,195,125,.18) 0%, rgba(25,195,125,0) 60%),
    radial-gradient(1100px 520px at 82% 8%, rgba(11,79,135,.22) 0%, rgba(11,79,135,0) 60%),
    linear-gradient(180deg, #061a2d 0%, #0a2a49 100%);
  color: #f4f8ff;
  padding: 64px 0 58px;
}
.kickers{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px}
.pill{
  display:inline-flex; align-items:center; gap:8px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: rgba(244,248,255,.86);
  font-weight: 800;
  font-size: 13px;
}
.pill b{color:#fff}

.hero-grid{
  display:grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 26px;
  align-items:center;
}
@media (max-width: 960px){ .hero-grid{grid-template-columns:1fr; gap:18px} }

h1{
  margin: 10px 0 14px;
  font-size: clamp(34px, 3.7vw, 54px);
  line-height: 1.02;
  letter-spacing: -1px;
}
.lead{
  color: rgba(244,248,255,.85);
  font-size: clamp(16px, 1.55vw, 19px);
  line-height: 1.55;
  margin: 0 0 18px;
  max-width: 60ch;
}
.emph{color:#fff; font-weight: 900}

.bullets{display:grid; gap:10px; margin: 14px 0 22px}
.bullet{display:flex; gap:10px; align-items:flex-start; color: rgba(244,248,255,.84); font-weight:750}
.bullet .dot{
  width:22px; height:22px; border-radius:999px;
  background: rgba(25,195,125,.18);
  border: 1px solid rgba(25,195,125,.45);
  display:flex; align-items:center; justify-content:center;
  color: #7ef0bf;
  flex:0 0 auto;
  margin-top:2px;
}

.cta-row{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.micro{margin-top:10px; color: rgba(244,248,255,.70); font-size: 13px}

.hero-visual{
  position:relative;
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
}
.hero-visual img{width:100%; height:auto}
.overlay-badges{
  position:absolute;
  left: 14px; right: 14px; bottom: 14px;
  display:flex; gap:10px; flex-wrap:wrap;
}
.badge{
  display:flex; gap:10px; align-items:center;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(6,26,45,.68);
  backdrop-filter: blur(10px);
  color:#fff;
  font-weight: 900;
  font-size: 13px;
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
.badge .i{
  width:30px; height:30px; border-radius: 12px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
}

.countdown{
  display:flex; gap:10px; align-items:center; flex-wrap:wrap;
  margin-top: 14px;
  color: rgba(244,248,255,.78);
  font-weight: 850;
}
.timer{
  display:flex; gap:8px; align-items:center;
  padding: 9px 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
}
.timer .t{font-variant-numeric: tabular-nums; letter-spacing:.6px}
.timer b{color:#fff}

/* SEÇÕES claras (estilo site) */
.h2{
  font-size: clamp(26px, 2.4vw, 38px);
  letter-spacing:-.8px;
  margin:0 0 10px;
}
.sub{
  color: var(--muted);
  line-height: 1.65;
  max-width: 78ch;
  margin: 0 0 22px;
}

.card{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px;
}
.card h3{margin:0 0 8px; font-size: 18px; letter-spacing:-.2px}
.card p{margin:0; color: var(--muted); line-height:1.6}
.tag{
  display:inline-flex; margin-top: 14px;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(11,79,135,.06);
  color: var(--brand);
  font-weight: 800;
}

.grid-3{display:grid; grid-template-columns: repeat(3, 1fr); gap: 16px}
@media (max-width: 920px){ .grid-3{grid-template-columns:1fr} }

.split{display:grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items:center}
@media (max-width: 960px){ .split{grid-template-columns:1fr} }

.figure{
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: var(--shadow);
}

.list{display:grid; gap:10px; margin: 12px 0 0}
.li{display:flex; gap:10px; align-items:flex-start; color: var(--muted); font-weight: 700}
.li .ok{
  width:22px; height:22px; border-radius:999px;
  background: rgba(25,195,125,.14);
  border: 1px solid rgba(25,195,125,.28);
  display:flex; align-items:center; justify-content:center;
  color: var(--brand2);
  flex:0 0 auto;
  margin-top:2px;
}

.table{
  width:100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow:hidden;
  border-radius: 16px;
  border: 1px solid var(--line);
  background:#fff;
  box-shadow: var(--shadow);
}
.table th, .table td{padding: 14px 14px; border-bottom: 1px solid var(--line); text-align:left; vertical-align:top}
.table th{background: rgba(11,79,135,.06); color: var(--ink); font-weight: 900}
.table tr:last-child td{border-bottom:none}
.kpi{
  display:flex; gap:12px; flex-wrap:wrap; margin-top: 14px;
}
.kpi .chip{
  background: rgba(11,79,135,.06);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 10px 12px;
  font-weight: 900;
  color: var(--brand);
}

/* Oferta */
.offer{
  border-radius: 26px;
  background:
    radial-gradient(900px 360px at 20% 10%, rgba(255,138,42,.18) 0%, rgba(255,138,42,0) 60%),
    #fff;
  border: 1px solid rgba(255,138,42,.28);
  box-shadow: 0 22px 70px rgba(2,16,30,.14);
  padding: 24px;
}
.offer-top{display:flex; align-items:flex-start; justify-content:space-between; gap: 16px; flex-wrap:wrap}
.price{font-size: 46px; font-weight: 950; letter-spacing:-1px; margin: 6px 0 0}
.price small{font-size: 16px; color: var(--muted); font-weight: 900}
.fine{color: var(--muted); font-size: 13px; margin-top: 6px}

.offer-grid{display:grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 18px}
@media (max-width: 920px){ .offer-grid{grid-template-columns: 1fr} }

/* FAQ */
.faq details{
  border: 1px solid var(--line);
  background:#fff;
  border-radius: 16px;
  padding: 14px 16px;
  margin-bottom: 10px;
  box-shadow: 0 10px 24px rgba(2,16,30,.06);
}
.faq summary{cursor:pointer; font-weight: 950; letter-spacing:-.2px}
.faq p{margin: 10px 0 0; color: var(--muted); line-height: 1.65}

/* Footer (estilo site) */
.footer{
  background: #163e5a;
  color: rgba(255,255,255,.86);
  padding: 32px 0 86px;
  margin-top: 10px;
}
.footer b{color:#fff}
.footer a{color: rgba(255,255,255,.92); text-decoration:none}
.footer a:hover{color:#fff}
.footer-grid{display:grid; grid-template-columns: 1.25fr .75fr; gap: 18px}
@media (max-width: 920px){ .footer-grid{grid-template-columns:1fr} }

/* Sticky CTA (mobile) */
.sticky-cta{
  position: fixed;
  left: 12px; right: 12px; bottom: 12px;
  z-index: 70;
  display:none;
}
@media (max-width: 920px){ .sticky-cta{display:block} }
.sticky-cta .bar{
  display:flex; align-items:center; justify-content:space-between; gap: 10px;
  padding: 12px 12px;
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--line);
  box-shadow: 0 18px 50px rgba(2,16,30,.18);
}
.sticky-cta .left{display:grid; line-height: 1.1}
.sticky-cta .left b{font-size: 13px}
.sticky-cta .left span{font-size: 12px; color: var(--muted)}
.sticky-cta .btn{padding: 12px 14px; font-size: 13px}

/* WhatsApp floating button */
.wa-fab{
  position: fixed;
  right: 16px;
  bottom: 92px;
  z-index: 80;
  width: 56px; height: 56px;
  border-radius: 999px;
  background: #25D366;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 18px 50px rgba(2,16,30,.22);
  border: 1px solid rgba(0,0,0,.06);
}
.wa-fab svg{width:28px; height:28px; fill:#fff}
.wa-fab:focus{outline: 3px solid rgba(37,211,102,.35); outline-offset: 4px}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* Testimonials */
.tcard{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px;
  display:flex;
  flex-direction:column;
  gap: 12px;
}
.thead{display:flex; gap:12px; align-items:center}
.avatar{
  width: 54px; height: 54px;
  border-radius: 999px;
  object-fit: cover;
  border: 2px solid rgba(11,79,135,.18);
}
.tname{font-weight: 950; letter-spacing:-.2px}
.tmeta{color: var(--muted); font-weight: 700; font-size: 13px; margin-top:2px}
.stars{color:#f3b600; letter-spacing:2px; font-size: 14px; margin-top: 6px}
.tquote{
  margin:0;
  color: var(--ink);
  font-weight: 700;
  line-height: 1.6;
}
.tproof{margin-top: 4px}
.proof-pill{
  display:inline-flex;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(25,195,125,.12);
  border: 1px solid rgba(25,195,125,.25);
  color: #0b3a2a;
  font-weight: 900;
  font-size: 12px;
}
/* Ajustes solicitados */
.bullet{font-weight:650;}
.bullet b{font-weight:650;}
.lead b{font-weight:900;} /* mantém ênfase do lead */
