/* =====================================================================
   VOA — sistema de UI (carregado por último; unifica raio, botões, sombras)
   ===================================================================== */
:root{--r:8px}

/* 1) Raio único e discreto */
.btn,
.btn-outline-white,
.btn-wpp,
.card,
.chip,
.cs-badge,
.cs-card,
.cs-filter,
.ct-card,
.ct-card .ico,
.ct-form,
.ev-badge-ad,
.evidence-card,
.feature,
.hero-top .pill,
.hv-btn,
.hv-tag,
.lb-camp,
.lb-camp-status,
.lb-inner,
.lb-metric,
.lb-tag,
.mockup,
.mockup-row .pill-s,
.nav-cta,
.nav-mobile-menu .mm-body .m-cta,
.nav-svc-menu,
.pf-badge-ad,
.pf-card::after,
.s-cta,
.s-cta .btn-dark,
.s-cta .btn-ghost,
.sim-card,
.sim-niche,
.sim-results,
.sim-slider,
.ss-viewer,
.submit-btn,
.svc-aside,
.testi-card,
.trust,
.trust-badge,
.vs-col{border-radius:var(--r)!important}
.lb-note{border-radius:0 var(--r) var(--r) 0!important}
.svc-hero{border-radius:0!important}
.svc-grid{border-radius:0!important}

/* 2) Sem glow / brilho colorido */
.btn-dark,
.btn-dark:hover,
.btn-ghost:hover,
.btn-primary,
.btn-primary:hover,
.btn-wpp,
.card:hover,
.chip:hover,
.ct-form,
.feature,
.logo-mark,
.mockup-bars b:hover,
.mockup:hover,
.nav-cta:hover,
.nav-mobile-menu .mm-body .m-cta,
.nav-mobile-menu .mm-body .m-cta:hover,
.pf-card:hover,
.pf-card:hover .big,
.s-cta .btn-dark,
.s-cta .btn-dark:hover,
.sim-card,
.stat:hover .num,
.submit-btn:hover,
.svc-aside,
.testi-card,
.testi-card:hover,
.vs-col.good,
.btn,.nav-cta,.m-cta,.submit-btn,.hv-btn,.pulse,.blink,.logo-mark,.wpp-float,.wpp-float-btn,.hero::before,.sim-card,.sim-bg,.vs-col.good{box-shadow:none!important;text-shadow:none!important}
.pulse,.blink,.logo-mark{animation:none!important}
.btn::after,.nav-cta::after,.btn-wpp::after{display:none!important}
.btn-wpp .pulse{display:none!important}

/* 3) Botões: um único padrão */
.btn,.nav-cta,.m-cta,.submit-btn{
  display:inline-flex!important;align-items:center;justify-content:center;gap:8px;
  height:48px;padding:0 24px!important;border:1.5px solid transparent;
  font:600 14px/1 'Archivo',system-ui,sans-serif!important;letter-spacing:.01em!important;text-transform:none!important;
  text-decoration:none;white-space:nowrap;cursor:pointer;transform:none!important;
  transition:background .2s,color .2s,border-color .2s;
}
.nav-cta{height:42px;padding:0 18px!important}
.btn-primary,.btn-dark,.btn-wpp,.nav-cta,.m-cta,.submit-btn,.s-cta .btn-dark{
  background:#1AC8FF!important;border-color:#1AC8FF!important;color:#06120e!important;
}
.btn-primary:hover,.btn-dark:hover,.btn-wpp:hover,.nav-cta:hover,.m-cta:hover,.submit-btn:hover,.s-cta .btn-dark:hover{
  background:#0FB4E8!important;border-color:#0FB4E8!important;color:#06120e!important;transform:none!important;
}
.btn-ghost,.btn-outline,.btn-outline-white,.s-cta .btn-ghost{
  background:transparent!important;color:#1AC8FF!important;border-color:#1AC8FF!important;
}
.btn-ghost:hover,.btn-outline:hover,.btn-outline-white:hover,.s-cta .btn-ghost:hover{
  background:#1AC8FF!important;color:#06120e!important;border-color:#1AC8FF!important;transform:none!important;
}
.s-cta .btn-ghost{color:#0b0f0e!important;border-color:#0b0f0e!important}
.s-cta .btn-ghost:hover{background:#0b0f0e!important;color:#fff!important;border-color:#0b0f0e!important}
.submit-btn{width:100%}
.btn .arrow,.nav-cta .arrow{transition:none}

/* 4) Menu Serviços: só os nomes */
.nav-svc-menu{min-width:220px!important;padding:8px!important}
.nav-links .nav-svc-menu a,.nav-svc-menu a{
  display:block!important;padding:11px 14px!important;font-size:14px!important;font-weight:600!important;
  letter-spacing:0!important;text-transform:none!important;color:#cfd8d5!important;
}
.nav-links .nav-svc-menu a:hover,.nav-svc-menu a:hover{background:rgba(255,255,255,.06)!important;color:#1AC8FF!important}

/* 5) Ícones SVG de lista */
.ic-svg{width:12px;height:12px;display:block}
.trust-badge .ic-svg{display:inline-block;width:13px;height:13px;vertical-align:-2px}

/* 6) Seção "O que é" nas páginas de serviço */
.svc-what{background:#f6f8f4;color:#0b0f0e;padding:84px 0;border-bottom:1px solid rgba(10,13,12,.1)}
.what-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.what-eyebrow{display:flex;align-items:center;gap:12px;color:#0A74E0;font:700 12px/1 'Archivo',sans-serif;letter-spacing:.2em;text-transform:uppercase;margin-bottom:18px}
.what-eyebrow .bar{width:32px;height:1px;background:currentColor;display:block}
.svc-what h2{font:900 clamp(30px,3.6vw,48px)/1.05 'Archivo',sans-serif;letter-spacing:-.025em;margin:0;color:#0b0f0e}
.svc-what h2 em{font-style:normal;color:#0A74E0}
.svc-what p{font-size:18px;line-height:1.65;color:#44504d;margin:0 0 28px}
.what-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid rgba(10,13,12,.12);padding-top:20px}
.what-fact span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#7a8683;font-weight:600;margin-bottom:6px}
.what-fact strong{display:block;font-size:14px;line-height:1.4;font-weight:600;color:#0b0f0e}
@media(max-width:860px){.what-grid{grid-template-columns:1fr;gap:28px}.svc-what{padding:60px 0}}
@media(max-width:560px){.what-facts{grid-template-columns:1fr;gap:14px}}

/* 7) CTA fixo (mobile) — no desktop o CTA fica no header fixo */
.fixed-cta{display:none}
@media(max-width:780px){
  .fixed-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:998;padding:10px 16px;background:#0a0d0c;border-top:1px solid rgba(255,255,255,.1)}
  .fixed-cta .btn{width:100%}
  body{padding-bottom:70px}
  .wpp-float,.wpp-float-btn{bottom:84px!important;right:16px!important}
}

/* 8) Respiro lateral consistente nas seções */
.container{padding-left:56px!important;padding-right:56px!important}
@media(max-width:780px){.container{padding-left:22px!important;padding-right:22px!important}}
@media(max-width:480px){.container{padding-left:16px!important;padding-right:16px!important}}

@media(max-width:900px){.nav-cta{display:none!important}}

/* Botão flutuante do WhatsApp (todas as páginas) */
.wpp-float{position:fixed;bottom:28px;right:28px;z-index:999;width:56px;height:56px;border-radius:50%!important;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.28)!important;transition:background .2s}
.wpp-float:hover{background:#1ebe5a}
.wpp-float svg{width:30px;height:30px}

/* ===== Barra de progresso (abaixo do header) ===== */
nav.nav{position:sticky}
.scroll-progress{position:absolute;left:0;right:0;bottom:-1px;height:3px;background:rgba(255,255,255,.08);pointer-events:none}
.scroll-progress i{display:block;height:100%;background:#1AC8FF;transform:scaleX(0);transform-origin:left center;will-change:transform}
nav.nav{transition:background .3s,border-color .3s}
nav.nav.nav-scrolled{background:rgba(10,13,12,.94)!important}

/* ===== Animações de entrada ===== */
.js-motion .mo{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);transition-delay:var(--mo-d,0s)}
.js-motion .mo[data-mo="left"]{transform:translateX(-32px)}
.js-motion .mo[data-mo="right"]{transform:translateX(32px)}
.js-motion .mo[data-mo="zoom"]{transform:scale(.96)}
.js-motion .mo.mo-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js-motion .mo{opacity:1!important;transform:none!important;transition:none!important}}

/* ===== Microinterações ===== */
.btn .arrow,.btn i{display:inline-block;transition:transform .25s}
.btn:hover .arrow{transform:translateX(3px)}
.evidence-card,.cs-card,.fp,.card{transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s}
.evidence-card:hover{transform:translateY(-3px)}
.svc-list li .ic{transition:transform .25s}
.svc-list li:hover .ic{transform:scale(1.15)}
.foot-inner a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s,color .2s}
.foot-inner a:hover{background-size:100% 1px}
details summary{transition:color .2s}
details[open] summary{color:#1AC8FF}

/* ===== Card de destaque (Sites e Logos) ===== */
.feature{align-items:stretch!important}
.feature-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.feature-copy p{margin-bottom:22px}
.feature-copy .feature-chips{margin-bottom:28px}
.feature-copy .btn{margin-top:0}
.feature-panels{display:grid;gap:14px;align-content:center}
.fp{display:grid;gap:8px;padding:22px 24px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);color:#e9efed;text-decoration:none}
.fp:hover{border-color:#1AC8FF;background:rgba(26,200,255,.06);transform:translateY(-3px)}
.fp-k{font:600 11px/1 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:#1AC8FF}
.fp strong{font:800 20px/1.2 'Archivo',sans-serif;letter-spacing:-.01em;color:#fff}
.fp ul{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:6px}
.fp li{position:relative;padding-left:16px;font-size:14px;color:#a9b6b2}
.fp li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:2px;background:#1AC8FF}
.fp-go{margin-top:6px;font:600 13px/1 'Archivo',sans-serif;color:#1AC8FF}
.fp-go i{font-style:normal;display:inline-block;transition:transform .25s}
.fp:hover .fp-go i{transform:translateX(4px)}

/* ===== Responsividade ===== */
html{-webkit-text-size-adjust:100%}
body{overflow-x:clip}
img{max-width:100%;height:auto}
.svc-grid-2col>*,.svc-grid>*,.what-grid>*,.ct-grid>*,.feature>*,.cases-grid>*,.foot-inner>*{min-width:0}
.svc-list li,.faq summary,.fp li{overflow-wrap:anywhere}
@media(max-width:980px){
  .svc-grid-2col,.svc-grid,.feature{grid-template-columns:minmax(0,1fr)!important}
  .feature{padding:32px 24px!important}
}
@media(max-width:780px){
  h1{overflow-wrap:break-word}
  .ct-grid{grid-template-columns:minmax(0,1fr)!important}
  .stat-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:480px){
  .stat{padding:20px 14px!important}
  .stat .num{font-size:34px!important}
  .ev-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .ev-metric{padding:12px 8px!important}
  .ev-val{font-size:20px!important}
  .feature{padding:26px 18px!important}
  .fp{padding:18px}
  .fp strong{font-size:18px}
  .feature-copy .btn,.s-cta .btn,.svc-cta .btn,.svc-hero .btn{width:100%}
  .cs-num{font-size:56px}
  .cs-stats{gap:18px 28px}
}