@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
  :root{
    --primary: oklch(55% .22 25);
    --primary-dark: oklch(45% .20 25);
    --primary-tint: oklch(96% .02 25);
    --bg: oklch(100% 0 0);
    --fg: oklch(23.5% .015 65);
    --muted-bg: oklch(97.5% .003 286);
    --muted-fg: oklch(55.2% .016 285.938);
    --border: oklch(90% .004 286.32);
    --tel: oklch(55% .18 250);
    --tel-tint: oklch(96% .02 250);
    --wa: oklch(52% .14 155);
    --wa-tint: oklch(96% .03 155);
    --crm: oklch(58% .16 75);
    --crm-tint: oklch(96% .03 75);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{font-family:'Manrope',-apple-system,'Segoe UI',sans-serif; color:var(--fg); background:var(--bg); line-height:1.55;}
  .wrap{max-width:1140px; margin:0 auto; padding:0 24px;}
  a{color:inherit; text-decoration:none;}

  header{border-bottom:1px solid var(--border); position:sticky; top:0; background:rgba(255,255,255,.94); backdrop-filter:blur(6px); z-index:30;}
  header .wrap{display:flex; align-items:center; justify-content:space-between; height:72px;}
  .logo{font-weight:800; font-size:20px; letter-spacing:-.02em;}
  .logo span{color:var(--primary);}
  nav{display:flex; gap:20px;}
  nav a{font-size:14.5px; font-weight:500; color:var(--muted-fg);}
  nav a:hover{color:var(--fg);}
  .btn{
    display:inline-flex; align-items:center; gap:8px; padding:11px 22px; border-radius:8px;
    font-weight:600; font-size:14.5px; cursor:pointer; border:1px solid transparent;
  }
  .btn-primary{background:var(--primary); color:#fff;}
  .btn-primary:hover{background:var(--primary-dark);}
  .btn-outline{border-color:var(--border); color:var(--fg);}
  .btn-outline:hover{border-color:var(--fg);}

  .hero{padding:80px 0 64px;}
  .hero-inner{max-width:760px;}
  .eyebrow{
    display:inline-block; font-size:13.5px; font-weight:600; color:var(--primary);
    background:var(--primary-tint); padding:6px 14px; border-radius:999px; margin-bottom:20px;
  }
  .hero h1{font-size:48px; font-weight:800; letter-spacing:-.03em; line-height:1.1; margin-bottom:20px;}
  .hero p{font-size:18px; color:var(--muted-fg); max-width:600px; margin-bottom:32px;}
  .hero-actions{display:flex; gap:12px; margin-bottom:56px;}

  .channel-strip{display:flex; gap:0; border:1px solid var(--border); border-radius:12px; overflow:hidden;}
  .channel-strip > div{flex:1; padding:20px 22px; border-right:1px solid var(--border);}
  .channel-strip > div:last-child{border-right:none;}
  .channel-label{display:flex; align-items:center; gap:10px; font-weight:700; font-size:15px; margin-bottom:6px;}
  .dot{width:9px; height:9px; border-radius:50%; flex-shrink:0;}
  .channel-strip .desc{font-size:13.5px; color:var(--muted-fg); line-height:1.5;}

  .section{padding:72px 0;}
  .section-head{max-width:600px; margin-bottom:44px;}
  .section-head h2{font-size:30px; font-weight:800; letter-spacing:-.02em; margin-bottom:12px;}
  .section-head p{font-size:16px; color:var(--muted-fg);}

  .pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--border); border-radius:14px; overflow:hidden;}
  .pillar{padding:32px 28px; border-right:1px solid var(--border);}
  .pillar:last-child{border-right:none;}
  .pillar-icon{width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; font-size:20px;}
  .pillar h3{font-size:19px; font-weight:700; margin-bottom:10px;}
  .pillar p{font-size:14.5px; color:var(--muted-fg); margin-bottom:16px;}
  .pillar ul{list-style:none;}
  .pillar li{font-size:13.5px; color:var(--fg); padding:5px 0; padding-left:18px; position:relative;}
  .pillar li::before{content:'—'; position:absolute; left:0; color:var(--muted-fg);}

  .integration{
    background:var(--muted-bg); border-radius:16px; padding:48px; margin-top:24px;
    display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;
  }
  .integration h3{font-size:24px; font-weight:800; letter-spacing:-.02em; margin-bottom:14px;}
  .integration p{font-size:15px; color:var(--muted-fg); margin-bottom:0;}
  .flow{display:flex; flex-direction:column; gap:10px;}
  .flow-row{display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--border); border-radius:10px; padding:14px 16px;}
  .flow-row .dot{width:8px; height:8px;}
  .flow-row span{font-size:13.5px; font-weight:600;}
  .flow-arrow{font-size:13px; color:var(--muted-fg); padding-left:20px;}

  .plans-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
  .plan{border:1px solid var(--border); border-radius:14px; padding:26px 22px; position:relative;}
  .plan.featured{border:2px solid var(--primary);}
  .plan-badge{
    position:absolute; top:-11px; left:50%; transform:translateX(-50%); background:var(--primary); color:#fff;
    font-size:11.5px; font-weight:700; padding:4px 12px; border-radius:999px;
  }
  .plan h4{font-size:17px; font-weight:700; margin-bottom:4px;}
  .plan .plan-desc{font-size:13px; color:var(--muted-fg); margin-bottom:18px; min-height:32px;}
  .plan ul{list-style:none; margin-bottom:20px;}
  .plan li{font-size:13px; padding:5px 0; padding-left:20px; position:relative;}
  .plan li::before{content:'✓'; position:absolute; left:0; color:var(--primary); font-weight:700;}
  .plan-note{font-size:12px; color:var(--muted-fg); text-align:center; margin-top:8px;}

  .cta-band{background:var(--fg); border-radius:20px; padding:56px; display:flex; align-items:center; justify-content:space-between; gap:32px;}
  .cta-band h3{color:#fff; font-size:26px; font-weight:800; letter-spacing:-.02em; margin-bottom:8px;}
  .cta-band p{color:oklch(80% .01 65); font-size:15px;}
  .cta-band .btn-primary{white-space:nowrap;}

  footer{border-top:1px solid var(--border); padding:48px 0 32px; margin-top:40px;}
  .footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px; margin-bottom:32px;}
  .footer-grid h5{font-size:13.5px; font-weight:700; margin-bottom:14px;}
  .footer-grid a, .footer-grid p{display:block; font-size:13.5px; color:var(--muted-fg); margin-bottom:9px;}
  .footer-bottom{border-top:1px solid var(--border); padding-top:20px; font-size:13px; color:var(--muted-fg);}
/* ===== Página Planos (calculadora) ===== */
.calc-wrap{display:grid; grid-template-columns:1fr 340px; gap:32px; align-items:start; padding:56px 0;}
@media (max-width:860px){ .calc-wrap{grid-template-columns:1fr;} }
.calc-step-label{display:flex; align-items:baseline; gap:10px; margin:0 0 18px;}
.calc-step-num{
  font-size:13px; font-weight:700; color:var(--primary); background:var(--primary-tint);
  width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.calc-step-label h2{font-size:19px; font-weight:700; letter-spacing:-.01em;}

.pillar-toggle-row{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:40px;}
@media (max-width:700px){ .pillar-toggle-row{grid-template-columns:1fr;} }
.pillar-toggle{
  background:#fff; border:1.5px solid var(--border); border-radius:14px; padding:20px; cursor:pointer; transition:border-color .15s;
}
.pillar-toggle:hover{border-color:var(--muted-fg);}
.pillar-toggle.active[data-p="tel"]{border-color:var(--tel);}
.pillar-toggle.active[data-p="wa"]{border-color:var(--wa);}
.pillar-toggle.active[data-p="crm"]{border-color:var(--crm);}
.pt-top{display:flex; align-items:center; justify-content:space-between;}
.pt-name{font-size:16px; font-weight:700;}
.pt-switch{width:38px; height:22px; border-radius:999px; background:var(--border); position:relative; flex-shrink:0; transition:background .15s;}
.pt-switch::after{content:''; position:absolute; width:16px; height:16px; border-radius:50%; background:#fff; top:3px; left:3px; transition:left .15s; box-shadow:0 1px 2px rgba(0,0,0,.2);}
.pillar-toggle.active[data-p="tel"] .pt-switch{background:var(--tel);}
.pillar-toggle.active[data-p="wa"] .pt-switch{background:var(--wa);}
.pillar-toggle.active[data-p="crm"] .pt-switch{background:var(--crm);}
.pillar-toggle.active .pt-switch::after{left:19px;}
.pt-desc{font-size:13px; color:var(--muted-fg); margin-top:6px;}
.pt-price{font-size:13px; font-weight:600; color:var(--muted-fg); margin-top:12px;}
.pillar-toggle.active .pt-price{color:var(--fg);}

.tier-sub-row{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px;}
.tier-opt{background:var(--muted-bg); border:1px solid var(--border); border-radius:9px; padding:9px 8px; cursor:pointer; text-align:left; font-family:inherit;}
.tier-opt.active{border-color:var(--tel); background:var(--tel-tint);}
.tier-opt-name{font-size:12.5px; font-weight:700;}
.tier-opt-limit{font-size:10.5px; color:var(--muted-fg); margin-top:2px;}

.module-list-calc{display:flex; flex-direction:column; gap:2px; background:#fff; border:1px solid var(--border); border-radius:14px; padding:8px 20px;}
.module-row{display:flex; align-items:flex-start; gap:14px; padding:16px 0; border-bottom:1px solid var(--border); cursor:pointer;}
.module-row:last-child{border-bottom:none;}
.module-row.disabled{opacity:.4; cursor:not-allowed;}
.module-row input{width:19px; height:19px; margin-top:2px; accent-color:var(--primary); flex-shrink:0;}
.module-row-body{flex:1;}
.module-row-name{font-size:14.5px; font-weight:700;}
.module-row-desc{font-size:13px; color:var(--muted-fg); margin-top:2px;}
.module-row-requires{font-size:11.5px; color:var(--muted-fg); margin-top:3px; font-style:italic;}
.module-row-price{font-size:13.5px; font-weight:700; white-space:nowrap; padding-top:1px;}
.module-row-price.usage{font-size:11px; font-weight:600; color:var(--muted-fg);}

.summary-box{background:#fff; border:1px solid var(--border); border-radius:14px; padding:24px; position:sticky; top:88px;}
.summary-box h3{font-size:13px; font-weight:700; color:var(--muted-fg); margin-bottom:14px;}
.summary-line{display:flex; justify-content:space-between; font-size:14px; padding:7px 0; color:var(--muted-fg);}
.summary-line.base{color:var(--fg); font-weight:600;}
.summary-total{display:flex; justify-content:space-between; align-items:baseline; margin-top:14px; padding-top:14px; border-top:1px solid var(--border);}
.summary-total .label{font-size:13px; color:var(--muted-fg);}
.summary-total .value{font-size:28px; font-weight:800; letter-spacing:-.02em;}
.summary-total .value span{font-size:14px; font-weight:600; color:var(--muted-fg);}
.summary-note{font-size:12px; color:var(--muted-fg); margin-top:10px; text-align:center;}

/* ===== Página Cobertura ===== */
.search-box{background:#fff; border:1px solid var(--border); border-radius:16px; padding:36px; max-width:640px; margin:0 auto;}
.search-box label{display:block; font-size:14px; font-weight:600; margin-bottom:8px;}
.search-box select, .search-box input{
  width:100%; padding:12px 14px; border:1px solid var(--border); border-radius:8px;
  font-family:inherit; font-size:14.5px; margin-bottom:20px;
}
.search-box input:last-of-type, .search-box select:last-of-type{margin-bottom:0}
#cityResults{margin-top:16px; max-height:220px; overflow-y:auto;}
.city-result{padding:10px 14px; border-bottom:1px solid var(--border); font-size:14px; display:flex; justify-content:space-between;}
.city-result:last-child{border-bottom:none;}
.city-result .ddd{color:var(--muted-fg); font-size:13px;}
.search-empty{font-size:13.5px; color:var(--muted-fg); text-align:center; padding:14px 0;}

.regions-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:800px){ .regions-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .regions-grid{grid-template-columns:1fr;} }
.region-card{background:#fff; border:1px solid var(--border); border-radius:14px; padding:22px;}
.region-card h4{font-size:15.5px; font-weight:700; margin-bottom:12px;}
.region-card ul{list-style:none;}
.region-card li{font-size:13.5px; padding:4px 0; padding-left:20px; position:relative; color:var(--fg);}
.region-card li::before{content:'✓'; position:absolute; left:0; color:var(--primary); font-weight:700;}
.tier-detail-text{font-size:11.5px; color:var(--muted-fg); margin-top:10px; line-height:1.5;}

/* ===== Logo (imagem real da marca) ===== */
.logo-img{height:52px; width:auto; display:block;}
.logo{display:flex; align-items:center;}
@media (max-width:600px){ .logo-img{height:42px;} }

/* ===== Página Soluções (problema → solução) ===== */
.problem-list{display:flex; flex-direction:column; gap:2px;}
.problem-card{
  display:grid; grid-template-columns:1fr 40px 1fr; gap:20px; align-items:center;
  background:#fff; border:1px solid var(--border); border-radius:14px; padding:26px 28px; margin-bottom:14px;
}
@media (max-width:760px){ .problem-card{grid-template-columns:1fr; gap:14px;} }
.problem-side{}
.problem-label{font-size:11px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; margin-bottom:8px;}
.problem-side.problem .problem-label{color:var(--muted-fg);}
.problem-side.solution .problem-label{color:var(--primary);}
.problem-quote{font-size:15.5px; font-style:italic; color:var(--muted-fg); line-height:1.5;}
.problem-quote::before{content:'"'; } .problem-quote::after{content:'"'; }
.problem-answer{font-size:15px; font-weight:600; color:var(--fg); line-height:1.5;}
.problem-arrow{
  display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:20px; font-weight:700;
}
@media (max-width:760px){ .problem-arrow{transform:rotate(90deg); justify-content:flex-start; padding-left:4px;} }

/* ===== Menu hambúrguer (mobile) ===== */
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:32px; height:32px; background:none; border:none; cursor:pointer; padding:0;
}
.nav-toggle span{width:100%; height:2px; background:var(--fg); border-radius:2px; transition:transform .2s, opacity .2s;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-mobile-actions{display:none;}

@media (max-width:1180px){
  header .wrap{height:64px;}
  nav#mainNav{
    display:none; position:absolute; top:64px; left:0; right:0; background:#fff;
    border-bottom:1px solid var(--border); flex-direction:column; padding:8px 24px 20px; gap:2px;
    box-shadow:0 8px 16px rgba(0,0,0,.06);
  }
  nav#mainNav.open{display:flex;}
  nav#mainNav a{padding:12px 0; border-bottom:1px solid var(--border); font-size:15px;}
  nav#mainNav a:last-of-type{border-bottom:none;}
  .nav-mobile-actions{display:flex; flex-direction:column; gap:10px; margin-top:14px;}
  .nav-mobile-actions .btn{width:100%; justify-content:center;}
  .header-actions{display:none;}
  .nav-toggle{display:flex;}
}

/* ===== Responsividade geral (grids e tipografia que ficaram sem breakpoint) ===== */
@media (max-width:860px){
  .hero h1{font-size:32px;}
  .hero p{font-size:16px;}
  .section-head h2{font-size:24px;}
  .channel-strip{flex-direction:column;}
  .channel-strip > div{border-right:none; border-bottom:1px solid var(--border);}
  .channel-strip > div:last-child{border-bottom:none;}
  .pillars{grid-template-columns:1fr !important;}
  .pillar{border-right:none !important; border-bottom:1px solid var(--border);}
  .pillar:last-child{border-bottom:none;}
  .plans-grid{grid-template-columns:1fr;}
  .integration{grid-template-columns:1fr; padding:28px;}
  .cta-band{flex-direction:column; align-items:flex-start; gap:20px; text-align:left;}
  .footer-grid{grid-template-columns:1fr 1fr; gap:24px;}
  .layout{padding-bottom:40px;}
}

@media (max-width:600px){
  .wrap{padding:0 18px;}
  .hero{padding:40px 0 32px;}
  .hero h1{font-size:26px;}
  .section{padding:48px 0;}
  .footer-grid{grid-template-columns:1fr;}
  .plan{padding:20px 18px;}
  .cta-band{padding:32px 24px;}
  .integration{padding:22px;}
  .search-box{padding:22px;}
}

/* ===== Página Contato ===== */
.contact-layout{display:grid; grid-template-columns:1fr 340px; gap:40px; margin-top:40px; align-items:start;}
.contact-form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media (max-width:860px){
  .contact-layout{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .contact-form-row{grid-template-columns:1fr;}
}

/* ===== Página Softphone ===== */
.advanced-features{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;}
@media (max-width:800px){ .advanced-features{grid-template-columns:1fr;} }
.feature-list-item{display:flex; gap:14px; margin-bottom:22px;}
.feature-list-item .dot-icon{
  width:38px; height:38px; border-radius:9px; background:var(--primary-tint); color:var(--primary);
  display:flex; align-items:center; justify-content:center; flex-shrink:0; font-weight:700;
}
.feature-list-item h4{font-size:15.5px; font-weight:700; margin-bottom:4px;}
.feature-list-item p{font-size:13.5px; color:var(--muted-fg);}
.phone-visual{
  background:var(--muted-bg); border-radius:16px; aspect-ratio:1; display:flex; align-items:center; justify-content:center;
  font-size:72px; color:var(--primary);
}

/* Variante do botão outline pra usar em cima de fundo escuro (cta-band) —
   o btn-outline normal usa texto escuro, que fica invisível em fundo escuro. */
.btn-outline-dark{border-color:rgba(255,255,255,.35); color:#fff;}
.btn-outline-dark:hover{border-color:#fff;}

/* ===== Botão flutuante de WhatsApp ===== */
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:100;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
  transition:transform .15s, box-shadow .15s;
}
.whatsapp-float:hover{transform:scale(1.06); box-shadow:0 6px 18px rgba(0,0,0,.3);}
@media (max-width:600px){
  .whatsapp-float{width:52px; height:52px; bottom:18px; right:18px;}
  .whatsapp-float svg{width:26px; height:26px;}
}

/* ===== Página CRM ===== */
.feature-grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
@media (max-width:900px){ .feature-grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .feature-grid-4{grid-template-columns:1fr;} }
.feature-card{background:#fff; border:1px solid var(--border); border-radius:14px; padding:22px;}
.feature-card .icon{width:38px; height:38px; border-radius:9px; background:var(--crm-tint); color:var(--crm); display:flex; align-items:center; justify-content:center; margin-bottom:14px; font-size:17px;}
.feature-card h4{font-size:15px; font-weight:700; margin-bottom:6px;}
.feature-card p{font-size:13px; color:var(--muted-fg); line-height:1.5;}

.code-block{
  background:#161B22; color:#C9D1D9; border-radius:12px; padding:20px 22px; font-family:'SF Mono',Consolas,monospace;
  font-size:12.5px; line-height:1.7; overflow-x:auto; white-space:pre;
}
.code-block .m{color:#79C0FF;} .code-block .s{color:#A5D6FF;} .code-block .c{color:#8B949E;}

.endpoint-list{display:flex; flex-direction:column; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:12px; overflow:hidden;}
.endpoint-row{display:flex; align-items:center; gap:14px; background:#fff; padding:13px 18px;}
.endpoint-method{font-size:11px; font-weight:700; padding:3px 9px; border-radius:5px; font-family:monospace; flex-shrink:0; width:52px; text-align:center;}
.endpoint-method.get{background:var(--tel-tint); color:var(--tel);}
.endpoint-method.post{background:var(--wa-tint); color:var(--wa);}
.endpoint-path{font-family:monospace; font-size:13px; font-weight:600;}
.endpoint-desc{font-size:12.5px; color:var(--muted-fg); margin-left:auto; text-align:right;}
@media (max-width:700px){ .endpoint-desc{display:none;} }

.webhook-tags{display:flex; flex-wrap:wrap; gap:8px;}
.webhook-tag{background:var(--muted-bg); border:1px solid var(--border); border-radius:999px; padding:6px 14px; font-size:12.5px; font-family:monospace; color:var(--fg);}

/* ===== Página WhatsApp / Agentes de IA ===== */
.agent-objectives{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
@media (max-width:800px){ .agent-objectives{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .agent-objectives{grid-template-columns:1fr;} }
.objective-card{background:#fff; border:1px solid var(--border); border-radius:14px; padding:20px;}
.objective-card .icon{font-size:22px; margin-bottom:10px;}
.objective-card h4{font-size:14.5px; font-weight:700; margin-bottom:5px;}
.objective-card p{font-size:12.5px; color:var(--muted-fg); line-height:1.5;}

.agent-anatomy{background:#fff; border:1px solid var(--border); border-radius:16px; padding:32px; display:grid; grid-template-columns:1fr 1fr; gap:32px;}
@media (max-width:800px){ .agent-anatomy{grid-template-columns:1fr; padding:22px;} }
.anatomy-item{display:flex; gap:14px; margin-bottom:22px;}
.anatomy-item:last-child{margin-bottom:0;}
.anatomy-num{
  width:28px; height:28px; border-radius:50%; background:var(--wa-tint); color:var(--wa);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0;
}
.anatomy-item h5{font-size:14.5px; font-weight:700; margin-bottom:4px;}
.anatomy-item p{font-size:13px; color:var(--muted-fg); line-height:1.5;}

.chat-mock{background:var(--muted-bg); border-radius:14px; padding:20px; display:flex; flex-direction:column; gap:10px;}
.chat-bubble{max-width:80%; padding:10px 14px; border-radius:12px; font-size:13px; line-height:1.4;}
.chat-bubble.in{background:#fff; border:1px solid var(--border); align-self:flex-start; border-bottom-left-radius:2px;}
.chat-bubble.out{background:var(--wa); color:#fff; align-self:flex-end; border-bottom-right-radius:2px;}