:root{
  --bg:#0b132b;
  --bg-2:#0e1835;
  --ink:#ffffff;
  --muted:#a0aec0;
  --acc:#3a86ff;
  --card:#111827;
  --card-2:#151d38;
  --glass:rgba(255,255,255,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family: ui-sans-serif,system-ui,Segoe UI,Roboto,Arial; color:var(--ink); background:linear-gradient(180deg,#070b16 0%, #0b132b 60%, #0b132b 100%)}

/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(7,11,22,.75);backdrop-filter: blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav__wrap{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:14px 20px}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.brand__logo{width:36px;height:36px;object-fit:contain;border-radius:8px;background:#0b132b}
.brand__name{font-weight:700}
.nav__links{display:flex;align-items:center;gap:18px}
.nav__links a{color:#fff;text-decoration:none;opacity:.9}
.nav__links a:hover{opacity:1;text-decoration:underline}
.nav__burger{display:none;background:transparent;border:0;cursor:pointer}
.nav__burger span{display:block;width:22px;height:2px;background:#fff;margin:4px 0}

@media (max-width: 900px){
  .nav__burger{display:block}
  .nav__links{position:absolute;left:0;right:0;top:60px;background:#0b132b;display:none;flex-direction:column;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav__links.is-open{display:flex}
}

/* BUTTONS */
.btn{background:var(--acc);color:#fff;border:0;border-radius:10px;padding:10px 16px;text-decoration:none;display:inline-block;font-weight:600;box-shadow:0 10px 24px rgba(58,134,255,.25)}
.btn:hover{filter:brightness(1.05)}
.btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.3)}
.btn--xl{padding:14px 22px;font-size:16px}
.btn--full{width:100%;text-align:center}

/* HERO */
.hero{position:relative;overflow:hidden}
.hero__bg{position:absolute;inset:0;background:
 radial-gradient(800px 250px at 20% 10%, rgba(58,134,255,.25), transparent),
 radial-gradient(600px 250px at 80% 20%, rgba(255,153,0,.15), transparent)}
.hero__content{max-width:1200px;margin:0 auto;padding:64px 20px;text-align:center}
.hero h1{font-size:36px;line-height:1.15;margin:0 0 12px}
@media (min-width:900px){.hero h1{font-size:48px}}
.hero__subtitle{color:var(--muted);max-width:860px;margin:0 auto 16px}
.hero__cta{display:flex;gap:12px;justify-content:center;margin:20px 0}
.hero__badges{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;opacity:.9}
.hero__badges span{border:1px solid rgba(255,255,255,.15);border-radius:999px;padding:6px 10px;background:rgba(255,255,255,.04)}
.hero__shot{margin:26px auto 0;max-width:1100px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 60px rgba(0,0,0,.35)}
.hero__shot img{width:100%;display:block}

/* ==== AJUSTE HERO (garantir CTAs visíveis e clicáveis) ==== */
.hero { position: relative; overflow: hidden; }

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none; /* fundo não captura clique */
}

.hero__content {
  position: relative;
  z-index: 2; /* texto e botões sempre por cima */
}

.hero__shot {
  position: relative;
  z-index: 1;
  margin-top: 26px;
  pointer-events: none; /* imagem não atrapalha clique */
}
.hero__shot img {
  display: block;
  max-width: 100%;
  height: auto;
  pointer-events: none;
}

/* Hero CTAs */
.hero__cta {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 20px 0;
}
.hero__cta a {
  pointer-events: auto; /* clicáveis */
}
.kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 20px;
  margin: 20px 0;
}
.kpi-card {
  background: linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
}
.kpi-icon { font-size: 28px; display: block; margin-bottom: 8px; }
.kpi-value { font-size: 24px; font-weight: 700; color: #fff; }
.kpi-label { font-size: 14px; color: var(--muted); }

.hist-controls { display:flex; gap:8px; align-items:center; }
.hist-controls select,
.hist-controls input{
  background:#0b132b; color:#fff; border:1px solid rgba(255,255,255,.12);
  border-radius:8px; padding:6px 10px; height:34px;
}
.hist-controls input{ width:180px; }

.map-legend{
  margin-top:10px; display:flex; gap:10px; flex-wrap:wrap;
  font-size:13px; color:#cfe2ff; opacity:.9;
}
.map-legend span{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08);
  padding:6px 8px; border-radius:999px;
}


/* LOGOS */
.logos{padding:30px 20px}
.logos__wrap{max-width:1100px;margin:0 auto;text-align:center}
.logos__title{display:block;color:var(--muted);margin-bottom:14px}
.logos__row{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;opacity:.6}
.logos__row img{height:26px}

/* SECTIONS */
.section__head{text-align:center;max-width:760px;margin:0 auto;padding:60px 20px 20px}
.section__head h2{margin:0 0 6px}
.section__head p{color:var(--muted);margin:0}

/* FEATURES */
.features{padding:10px 20px 50px}
.features .grid{max-width:1100px;margin:0 auto;display:grid;gap:16px;grid-template-columns:repeat(1,minmax(0,1fr))}
@media (min-width:800px){.features .grid{grid-template-columns:repeat(3,1fr)}}
.feature{background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px}
.feature .icon{font-size:28px}

/* HOW */
.how{padding:0 20px 60px}
.steps{max-width:1100px;margin:0 auto;display:grid;gap:12px;grid-template-columns:repeat(1,1fr)}
@media (min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:16px}
.badge{display:inline-grid;place-items:center;background:#1f2b4d;border:1px solid rgba(255,255,255,.15);border-radius:10px;width:36px;height:36px;margin-bottom:8px}

.how__split{max-width:1100px;margin:26px auto 0;display:grid;gap:24px;grid-template-columns:1fr}
@media (min-width:900px){.how__split{grid-template-columns:1.1fr .9fr}}
.how__shot{border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.how__shot img{width:100%;display:block}
.how__text .check{padding-left:18px}
.how__text .check li{margin:6px 0}
.link{color:#9cc1ff;text-decoration:none}

/* PRICING */
.pricing{padding:10px 20px 70px;background:linear-gradient(180deg,#0b132b 0%, #0e1835 100%);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.pricing__toggle{display:flex;gap:10px;align-items:center;justify-content:center;margin:4px 0 22px}
.save{color:#8ef0b5}
.switch{position:relative;display:inline-block;width:48px;height:26px}
.switch input{display:none}
.slider{position:absolute;cursor:pointer;inset:0;background:#394464;border-radius:999px;transition:.25s}
.slider:before{content:"";position:absolute;height:18px;width:18px;left:4px;top:4px;background:#fff;border-radius:50%;transition:.25s}
.switch input:checked + .slider{background:#50a2ff}
.switch input:checked + .slider:before{transform:translateX(22px)}
.plans{max-width:1100px;margin:0 auto;display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:1000px){.plans{grid-template-columns:repeat(3,1fr)}}
.plan{background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;position:relative}
.plan--focus{border-color:#5da3ff;box-shadow:0 20px 50px rgba(58,134,255,.2)}
.plan .pill{position:absolute;top:-12px;right:16px;background:#5da3ff;color:#001a3b;padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px}
.plan .price{font-size:26px;margin:8px 0 6px}
.plan .price .p-a{display:none}
.plan .muted{color:var(--muted)}
.plan ul{padding-left:18px}
.plan ul li{margin:6px 0}

/* TESTIMONIALS */
.testi{padding:20px 20px 60px}
.testi__grid{max-width:1100px;margin:0 auto;display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:900px){.testi__grid{grid-template-columns:repeat(3,1fr)}}
.testi blockquote{background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px;margin:0}
.testi footer{margin-top:10px;color:var(--muted)}

/* FAQ */
.faq{padding:10px 20px 70px;border-top:1px solid rgba(255,255,255,.06)}
.faq__grid{max-width:1100px;margin:0 auto;display:grid;gap:12px;grid-template-columns:1fr}
@media (min-width:900px){.faq__grid{grid-template-columns:repeat(2,1fr)}}
details{background:linear-gradient(180deg, var(--card) 0%, var(--card-2) 100%);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:12px}
summary{cursor:pointer;font-weight:600}

/* FOOTER */
.footer{padding:34px 20px}
.footer__wrap{max-width:1100px;margin:0 auto;display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:900px){.footer__wrap{grid-template-columns:2fr 1fr 1fr}}
.footer .col a{display:block;color:#cfe2ff;text-decoration:none;margin:6px 0}
.footer h5{margin:6px 0}
.footer .brand--footer .brand__logo{width:32px;height:32px}
.footer__copy{text-align:center;color:#98a1b3;border-top:1px solid rgba(255,255,255,.06);margin-top:16px;padding-top:14px}


