@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/ibm-plex-sans-latin-400-normal.woff2?v=3b646991d300") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/ibm-plex-sans-latin-500-normal.woff2?v=0717336fb31f") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/ibm-plex-sans-latin-600-normal.woff2?v=8960851d691c") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/ibm-plex-sans-latin-700-normal.woff2?v=42e7b0c143c1") format("woff2")}
@font-face{font-family:"IBM Plex Sans Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/ibm-plex-sans-condensed-latin-700-normal.woff2?v=4768878c107d") format("woff2")}

:root{
  --brand:#2563EB; --brand-strong:#004AC6; --navy:#0F2A6B; --navy-deep:#0A1D4D;
  --soft:#DBE1FF; --paper:#FAF8FF; --ink:#131B2E; --muted:#47536B;
  --yellow:#FACC15; --green:#007D55; --red:#BA1A1A; --white:#fff;
  --line:rgba(19,27,46,.12); --bg:var(--paper); --strong:var(--brand-strong); --highlight:var(--yellow);
  --display:"IBM Plex Sans Condensed","IBM Plex Sans",system-ui,sans-serif;
  --text:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;
  --gutter:16px; --max:1200px;
  --ease:cubic-bezier(.16,1,.3,1);
  --chip-shadow:0 1px 2px rgba(10,29,77,.16),0 10px 24px -6px rgba(10,29,77,.38);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px;accent-color:var(--brand)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.6 var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:var(--yellow);color:var(--navy-deep)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:8px}
.on-light :focus-visible,.light :focus-visible{outline-color:var(--brand-strong)}
.skip-link{position:absolute;left:var(--s4);top:-80px;background:var(--yellow);color:var(--navy-deep);padding:var(--s3) var(--s4);border-radius:12px;font-weight:600;z-index:100;text-decoration:none}
.skip-link:focus{top:var(--s3)}
.wrap{width:100%;max-width:calc(var(--max) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.num{font-variant-numeric:tabular-nums}
.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Tipografia */
.display,.d1,.d2{font-family:var(--display);font-weight:700;letter-spacing:-.02em;text-wrap:balance}
.display{line-height:1.04}
.d1{font-size:clamp(2.75rem,10.5vw,5.25rem);line-height:1.04}
.d2{font-size:clamp(2.25rem,7.6vw,3.75rem);line-height:1.02}
.h3{font-family:var(--display);font-weight:700;font-size:clamp(1.75rem,5.4vw,2.5rem);line-height:1.08;letter-spacing:-.015em;text-wrap:balance}
.lead{font-size:1.125rem;line-height:1.55;max-width:56ch;text-wrap:pretty}
@media (min-width:900px){.lead{font-size:1.25rem}}

/* Botões */
.btn{background:var(--brand);color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:56px;padding:0 var(--s5);border-radius:16px;font:600 1rem/1 var(--text);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background-color .2s,color .2s,border-color .2s;white-space:nowrap}
.btn .icon{transition:transform .25s var(--ease)}
.btn:hover .icon{transform:translateX(3px)}
.btn:active{transform:translateY(1px) scale(.99)}
.btn:hover{background:var(--brand-strong)}
.btn-yellow{background:var(--yellow);color:var(--navy-deep);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px -8px rgba(10,29,77,.55)}
.btn-yellow:hover{background:#FFD83A;transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 16px 28px -10px rgba(10,29,77,.6)}
.btn-blue{background:var(--brand);color:#fff;box-shadow:0 10px 24px -10px rgba(37,99,235,.7)}
.btn-blue:hover{background:var(--brand-strong);transform:translateY(-2px)}
.btn-line{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-line:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-line-dark{background:transparent;color:var(--navy);border-color:rgba(15,42,107,.35)}
.btn-line-dark:hover{background:rgba(15,42,107,.06);border-color:var(--navy)}
.link{display:inline-flex;align-items:center;min-height:48px;min-width:48px;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;text-decoration-color:rgba(255,255,255,.5);transition:text-decoration-color .2s}
.link:hover{text-decoration-color:var(--yellow)}

/* Cabeçalho + hero */
.hero{background:var(--brand);color:#fff;position:relative;overflow:hidden;isolation:isolate;padding-top:72px}
.hero::before,.hero::after{content:"";position:absolute;border-radius:50%;border:1.5px solid rgba(255,255,255,.16);z-index:-1;pointer-events:none}
.hero::before{width:1100px;height:1100px;right:-380px;top:-260px}
.hero::after{width:700px;height:700px;right:-190px;top:-60px;background:rgba(255,255,255,.045)}
.top{position:absolute;left:0;right:0;top:0;z-index:30;color:#fff}
.top-wrap{display:flex;align-items:center;justify-content:space-between;min-height:72px}
.brand{display:inline-flex;align-items:center;gap:var(--s3);text-decoration:none;font:700 1.375rem/1 var(--text);letter-spacing:-.01em;min-height:48px}
.brand img{width:36px;height:36px;border-radius:10px}
.brand-name{font:inherit}
.nav-links{display:none;gap:var(--s2)}
.nav-links a{display:inline-flex;align-items:center;min-height:48px;padding:0 var(--s4);border-radius:12px;color:#fff;text-decoration:none;font-weight:500;transition:background-color .2s}
.nav-links a:hover{background:rgba(255,255,255,.14)}
.top-actions{display:none;align-items:center;gap:var(--s2)}
.login{display:inline-flex;align-items:center;min-height:48px;min-width:48px;justify-content:center;padding:0 var(--s4);border-radius:12px;font-weight:600;text-decoration:none;color:#fff;transition:background-color .2s}
.login:hover{background:rgba(255,255,255,.14)}
.btn-sm{min-height:48px;padding:0 var(--s5)}
.top .btn{background:var(--yellow);color:var(--navy-deep);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px -8px rgba(10,29,77,.55)}
.top .btn:hover{background:#FFD83A;transform:translateY(-2px)}
.menu-toggle{display:inline-flex;align-items:center;gap:var(--s3);min-height:48px;min-width:48px;padding:0 var(--s3) 0 var(--s4);border:0;border-radius:12px;background:transparent;color:#fff;font:600 1rem/1 var(--text);cursor:pointer;transition:background-color .2s}
.menu-toggle:hover{background:rgba(255,255,255,.14)}
.bars,.bars::before,.bars::after{display:block;width:22px;height:2px;border-radius:2px;background:currentColor}
.bars{position:relative}
.bars::before,.bars::after{content:"";position:absolute;left:0}
.bars::before{top:-7px}
.bars::after{top:7px}
.menu-toggle[aria-expanded="true"] .bars{background:transparent}
.menu-toggle[aria-expanded="true"] .bars::before{top:0;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .bars::after{top:0;transform:rotate(-45deg)}
.menu-panel{position:absolute;top:100%;left:var(--gutter);right:var(--gutter);display:grid;gap:var(--s2);padding:var(--s3) var(--s5) var(--s5);background:#fff;color:var(--ink);border-radius:20px;box-shadow:0 24px 48px -16px rgba(10,29,77,.5)}
.menu-panel[hidden]{display:none}
.menu-panel nav{display:grid}
.menu-panel nav a,.menu-panel .login{display:flex;align-items:center;justify-content:flex-start;min-height:48px;padding:0;color:var(--ink);font-weight:600;text-decoration:none}
.menu-panel .login:hover{background:none;color:var(--brand-strong)}
.menu-panel .btn{margin-top:var(--s2);background:var(--brand);color:#fff;box-shadow:none}
.menu-panel .btn:hover{background:var(--brand-strong)}
.nav-links a[aria-current="true"]{background:rgba(255,255,255,.14)}
@media (min-width:900px){.nav-links{display:flex}.top-actions{display:flex}.menu-toggle,.menu-panel{display:none!important}}

.hero-grid{display:grid;gap:var(--s6);padding-top:var(--s5)}
.hero-copy{display:grid;gap:var(--s5);align-content:center;padding-bottom:var(--s2)}
.hero-copy .ctas{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s4);align-items:center}
.hero-copy .micro{font-size:.9375rem;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4)}
.hero-copy .micro span{display:inline-flex;align-items:center;gap:var(--s2)}
.hero-copy .micro .icon{width:18px;height:18px;color:var(--yellow)}
.h1-sub{display:block;margin-top:var(--s4);font:600 clamp(1.125rem,4.2vw,1.5rem)/1.25 var(--text);letter-spacing:0}
.hl{background:var(--yellow);color:var(--navy-deep);padding:.02em .12em;margin:0 -.04em;border-radius:8px;box-decoration-break:clone;-webkit-box-decoration-break:clone}

/* Celular em CSS */
.phone{--w:200px;position:absolute;width:var(--w);padding:calc(var(--w)*.032);border-radius:calc(var(--w)*.16);background:#0B1220;box-shadow:0 0 0 1.5px #2B3652 inset,0 0 0 1px rgba(255,255,255,.06),0 2px 4px rgba(6,14,36,.3),0 30px 60px -18px rgba(6,14,36,.65),0 60px 90px -40px rgba(6,14,36,.5)}
.phone::before,.phone::after{content:"";position:absolute;width:3px;background:#1A2540;border-radius:2px}
.phone::before{left:-2px;top:16%;height:7%;box-shadow:0 calc(var(--w)*.2) 0 #1A2540}
.phone::after{right:-2px;top:24%;height:11%}
.phone .screen{position:relative;border-radius:calc(var(--w)*.128);overflow:hidden;background:#fff;aspect-ratio:585/1266}
.phone .screen img{width:100%;height:100%;object-fit:cover}
.phone .screen::after{content:"";position:absolute;left:50%;top:calc(var(--w)*.026);width:calc(var(--w)*.045);height:calc(var(--w)*.045);transform:translateX(-50%);border-radius:50%;background:#0B1220;box-shadow:0 0 0 calc(var(--w)*.012) rgba(11,18,32,.55)}
.phone .screen::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.14),rgba(255,255,255,0) 28%);}

/* Chips de UI */
.chip{position:absolute;display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--s4) var(--s2) var(--s2);background:#fff;color:var(--ink);border-radius:16px;box-shadow:var(--chip-shadow);font:500 .8125rem/1.25 var(--text);white-space:nowrap;z-index:5}
.chip b{display:block;font-weight:600;font-size:.875rem}
.chip small{display:block;color:var(--muted);font-size:.75rem}
.chip .ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex:none}
.chip .ic .icon{width:20px;height:20px}
.ic-green{background:#D8F3E7;color:var(--green)}
.ic-blue{background:var(--soft);color:var(--brand-strong)}
.ic-yellow{background:#FEF3C2;color:#7A5B00}
.ic-wa{background:#25D366;color:#fff}
.chip-pill{padding:var(--s2) var(--s3);gap:var(--s2);border-radius:999px}
.chip-pill .icon{width:18px;height:18px}

.stage{position:relative;container-type:inline-size;aspect-ratio:1/.86;width:100%;max-width:640px;margin-inline:auto;margin-top:var(--s2)}
.stage .p-main{--w:52cqw;left:24cqw;top:0;z-index:3}
.stage .p-left{--w:38cqw;left:1cqw;top:20cqw;z-index:2}
.stage .p-right{--w:38cqw;right:1cqw;top:13cqw;z-index:2}
.stage .c1{left:0;top:8cqw}
.stage .c2{right:0;top:50cqw}
.stage .c3{left:6cqw;top:62cqw}
.stage .chip{font-size:clamp(.6875rem,2.6cqw,.8125rem)}
.stage .chip b{font-size:clamp(.75rem,2.9cqw,.875rem)}
.stage .chip small{font-size:clamp(.6875rem,2.3cqw,.75rem)}
.stage .chip .ic{width:clamp(28px,6.4cqw,36px);height:clamp(28px,6.4cqw,36px);border-radius:10px}
.stage .chip .ic .icon{width:clamp(16px,3.6cqw,20px);height:clamp(16px,3.6cqw,20px)}
.stage .chip{padding:clamp(4px,1.2cqw,8px) clamp(10px,2.4cqw,16px) clamp(4px,1.2cqw,8px) clamp(4px,1.2cqw,8px);gap:clamp(8px,1.8cqw,12px)}

@media (min-width:900px){
  .stage .c1{left:-2cqw}.stage .c2{right:-2cqw}
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:end;gap:var(--s6);padding-top:var(--s7)}
  .hero-copy{padding-bottom:var(--s9)}
  .stage{margin-top:0}
}

/* Faixa de fatos */
.facts{background:var(--navy-deep);color:#fff}
.facts ul{display:grid;grid-template-columns:1fr 1fr}
.facts li{padding:var(--s5) var(--s4);display:flex;flex-direction:column;gap:var(--s1);border-bottom:1px solid rgba(255,255,255,.12)}
.facts li:nth-child(odd){border-right:1px solid rgba(255,255,255,.12)}
.facts li:nth-last-child(-n+2){border-bottom:0}
.facts strong{font:700 2.25rem/1 var(--display);letter-spacing:-.01em;color:var(--yellow)}
.facts span{font-size:.9375rem;color:#E4E9FF}
@media (min-width:900px){
  .facts ul{grid-template-columns:repeat(4,1fr)}
  .facts li{padding:var(--s6) var(--s5);border-bottom:0;border-right:1px solid rgba(255,255,255,.12)}
  .facts li:first-child{padding-left:0}
  .facts li:last-child{border-right:0}
  .facts li:nth-last-child(-n+2){border-bottom:0}
  .facts strong{font-size:3rem}
}

/* Seções */
section{position:relative}
.sec{padding-block:var(--s8)}
@media (min-width:900px){.sec{padding-block:var(--s10)}}
.sec-head{display:grid;gap:var(--s4);max-width:760px;margin-bottom:var(--s7)}
.sec-head p{color:var(--muted);font-size:1.125rem;max-width:56ch}
.light{color:var(--ink)}

/* Dores */
.pain-grid{display:grid;gap:var(--s6)}
.pain-photo{position:relative;border-radius:28px;overflow:hidden;aspect-ratio:4/3.4;background:var(--soft)}
.pain-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;transition:transform 1.2s var(--ease)}
.pain-photo:hover img{transform:scale(1.03)}
.pain-photo .chip{left:var(--s4);bottom:var(--s4)}
.pains{display:grid;gap:0;border-top:1px solid var(--line)}
.pains li{display:grid;grid-template-columns:auto 1fr;gap:var(--s4);padding:var(--s5) 0;border-bottom:1px solid var(--line);align-items:start}
.pains .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#FFE3E0;color:var(--red)}
.pains h3{font:700 1.375rem/1.2 var(--text);letter-spacing:-.01em;margin-bottom:var(--s1)}
.pains p{color:var(--muted)}
.pains p strong{color:var(--green);font-weight:600}
@media (min-width:900px){.pain-grid{grid-template-columns:1fr 1.02fr;gap:var(--s9);align-items:center}.pain-photo{aspect-ratio:1/.98}}

/* Recursos alternados */
.feat{display:grid;gap:var(--s6);align-items:center}
.feat + .feat{margin-top:var(--s9)}
.feat-copy{display:grid;gap:var(--s4);align-content:center}
.feat-copy p{color:var(--muted);font-size:1.0625rem;max-width:50ch}
.ticks{display:grid;gap:var(--s3);margin-top:var(--s2)}
.ticks li{display:flex;gap:var(--s3);align-items:flex-start;font-weight:500}
.ticks .icon{width:22px;height:22px;margin-top:1px;color:var(--green);background:#D8F3E7;border-radius:50%;padding:3px;stroke-width:2.25}
.panel{position:relative;container-type:inline-size;border-radius:28px;overflow:hidden;aspect-ratio:1/.98;isolation:isolate}
.panel .phone{top:auto}
.panel-navy{background:var(--navy)}
.panel-soft{background:var(--soft)}
.panel-yellow{background:var(--yellow)}
.panel-blue{background:var(--brand)}
.panel::before{content:"";position:absolute;border-radius:50%;z-index:-1;pointer-events:none}
.panel-navy::before{width:110cqw;height:110cqw;left:-20cqw;top:-30cqw;border:1.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.panel-soft::before{width:90cqw;height:90cqw;right:-25cqw;top:-20cqw;background:rgba(255,255,255,.65)}
.panel-yellow::before{width:100cqw;height:100cqw;left:-30cqw;bottom:-45cqw;border:1.5px solid rgba(15,42,107,.18)}
.panel .chip{font-size:clamp(.6875rem,2.6cqw,.875rem)}
.panel .chip b{font-size:clamp(.75rem,2.9cqw,.9375rem)}
.panel .chip small{font-size:clamp(.6875rem,2.3cqw,.8125rem)}
.panel .chip{padding:clamp(4px,1.2cqw,8px) clamp(10px,2.4cqw,16px) clamp(4px,1.2cqw,8px) clamp(4px,1.2cqw,8px);gap:clamp(8px,1.8cqw,12px)}
.panel .chip .ic{width:clamp(28px,6.4cqw,40px);height:clamp(28px,6.4cqw,40px);border-radius:10px}
.panel .chip .ic .icon{width:clamp(16px,3.6cqw,22px);height:clamp(16px,3.6cqw,22px)}
.pm{display:flex;gap:var(--s1);margin-top:var(--s1)}
.pm i{font-style:normal;font-weight:600;font-size:.6875rem;padding:2px 8px;border-radius:999px;background:var(--soft);color:var(--navy)}
.panel .pm i{font-size:clamp(.625rem,2.2cqw,.75rem)}

/* painel A: venda */
.pa .p1{--w:44cqw;left:7cqw;top:9cqw;z-index:2}
.pa .p2{--w:44cqw;right:6cqw;top:24cqw;z-index:1}
.pa .ca{left:4cqw;bottom:9cqw}
.pa .cb{right:5cqw;top:6cqw}
/* painel B: pix */
.pb .p1{--w:48cqw;left:26cqw;top:11cqw}
.pb .ca{left:4cqw;top:14cqw}
.pb .cb{right:3cqw;top:42cqw}
.pb .cc{left:3cqw;bottom:5cqw}
/* painel C: a prazo */
.pc .p1{--w:43cqw;left:6cqw;top:10cqw;z-index:1}
.pc .card{position:absolute;right:5cqw;bottom:8cqw;width:56cqw;border-radius:20px;overflow:hidden;background:#fff;box-shadow:var(--chip-shadow);z-index:2}
.pc .card img{width:100%;height:auto}
.pc .ca{right:4cqw;top:9cqw}
.pc .cb{left:30cqw;bottom:6cqw}
/* painel D: cobrança */
.pd img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 25%;z-index:-1}
.pd .chat{position:absolute;left:5cqw;bottom:6cqw;width:60cqw;border-radius:20px;overflow:hidden;background:#fff;box-shadow:var(--chip-shadow);z-index:3}
.pd .chat img{width:100%;aspect-ratio:780/630;object-fit:cover;object-position:50% 100%}
.pd .p1{--w:36cqw;right:5cqw;top:30cqw;z-index:2}
.pd .ca{left:5cqw;top:6cqw}

@media (min-width:900px){
  .feat{grid-template-columns:1fr 1.05fr;gap:var(--s9)}
  .feat.rev .feat-copy{order:2}
  .feat.rev{grid-template-columns:1.05fr 1fr}
  .panel{aspect-ratio:1/.92}
}

/* Bento */
.bento-sec{background:#fff}
.bento{display:grid;gap:var(--s4)}
.tile{position:relative;overflow:hidden;border-radius:28px;display:flex;flex-direction:column;justify-content:space-between;min-height:360px;isolation:isolate}
.tile .shot{margin-top:auto}
.tile-copy{position:relative;z-index:2;padding:var(--s5);display:grid;gap:var(--s2);max-width:34ch}
.tile .tag{font-size:.75rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.tile h3{font:700 1.75rem/1.1 var(--display);letter-spacing:-.01em;text-wrap:balance}
.tile p{font-size:.9375rem;line-height:1.5}
.tile .shot{position:relative;z-index:1;margin:var(--s2) 0 -40px var(--s5);border-radius:16px 0 0 16px;overflow:hidden;box-shadow:0 1px 2px rgba(10,29,77,.14),0 24px 40px -14px rgba(10,29,77,.5);transition:transform .5s var(--ease)}
.tile .shot img{width:100%;height:auto}
.tile:hover .shot{transform:translateY(-6px)}
.t-white{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.t-white .tag{color:var(--brand-strong)}
.t-white p{color:var(--muted)}
.t-blue{background:var(--brand);color:#fff}
.t-blue .tag{color:#fff}
.t-navy{background:var(--navy);color:#fff}
.t-navy .tag{color:var(--yellow)}
.t-soft{background:var(--soft);color:var(--navy-deep)}
.t-soft .tag{color:var(--brand-strong)}
.t-soft p{color:#2A3A66}
.t-clients .shot{flex:1;margin-top:var(--s5);min-height:260px}
.t-clients .shot img{height:100%;object-fit:cover;object-position:0 0}
.t-web .tile-copy{max-width:none}
.t-web .row{display:flex;flex-wrap:wrap;gap:var(--s2);padding:0 var(--s5) var(--s5);position:relative;z-index:2}
.t-web .row span{display:inline-flex;align-items:center;gap:var(--s2);padding:var(--s2) var(--s4) var(--s2) var(--s3);border-radius:999px;background:rgba(255,255,255,.14);font-weight:500;font-size:.9375rem;min-height:40px}
.t-web .row .icon{width:18px;height:18px;color:var(--yellow)}
.t-web .bigicon{position:absolute;right:-28px;top:-28px;width:180px;height:180px;border-radius:44px;background:rgba(255,255,255,.08);z-index:0;transform:rotate(12deg)}
@media (min-width:640px){
  .bento{grid-template-columns:repeat(2,1fr)}
  .tile{min-height:420px}
  .t-web{grid-column:span 2;min-height:240px}
}
@media (min-width:1040px){
  .bento{grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(0,auto)}
  .t-clients{grid-column:span 5;grid-row:span 2;min-height:560px}
  .t-stock{grid-column:span 7;min-height:300px;flex-direction:row;align-items:stretch}
  .t-stock .tile-copy{padding:var(--s6);align-content:start;flex:1}
  .t-stock .shot{width:52%;flex:none;margin:var(--s5) -12px 0 0;align-self:flex-start}
  .t-report{grid-column:span 4;min-height:340px}
  .t-web{grid-column:span 3;min-height:340px}
}

/* Público */
.who-sec{background:var(--brand);color:#fff;padding-block:var(--s7)}
.who-sec .sec-head{margin-bottom:var(--s5)}
.who-sec .sec-head p{color:#fff}
.who{display:grid;gap:var(--s3)}
.who-card{position:relative;border-radius:28px;overflow:hidden;display:grid;grid-template-columns:1fr 132px;align-items:stretch;min-height:208px;isolation:isolate}
.wc-copy{padding:var(--s5) 0 var(--s5) var(--s5);display:grid;gap:var(--s2);align-content:center}
.who-card .tag{font-size:.75rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.who-card h3{font:700 1.5rem/1.1 var(--display);letter-spacing:-.01em;text-wrap:balance}
.wc-stage{position:relative}
.wc-stage .phone{--w:116px;left:8px;top:var(--s5)}
.wc-stage .chip{display:none}
.wc-navy{background:var(--navy);color:#fff}
.wc-navy .tag{color:var(--yellow)}
.wc-soft{background:var(--soft);color:var(--navy-deep)}
.wc-soft .tag{color:var(--brand-strong)}
.wc-yellow{background:var(--yellow);color:var(--navy-deep)}
.wc-yellow .tag{color:var(--navy-deep)}
@media (min-width:760px){
  .who-sec{padding-block:var(--s8)}
  .who-sec .sec-head{margin-bottom:var(--s6)}
  .who{grid-template-columns:repeat(3,1fr);gap:var(--s4)}
  .who-card{display:flex;flex-direction:column;min-height:0}
  .wc-copy{padding:var(--s5) var(--s5) 0;align-content:start;min-height:112px}
  .who-card h3{font-size:1.75rem}
  .wc-stage{height:280px;margin-top:var(--s3)}
  .wc-stage .phone{--w:196px;left:50%;margin-left:-98px;top:0}
  .wc-stage .chip{display:flex;left:var(--s4);bottom:var(--s4);font-size:.8125rem}
}

/* Como começar */
.steps-sec{background:var(--navy);color:#fff;overflow:hidden}
.steps-grid{display:grid;gap:var(--s7)}
.steps{display:grid;gap:var(--s4);counter-reset:s}
.steps li{display:grid;grid-template-columns:64px 1fr;gap:var(--s4);padding:var(--s5);border-radius:24px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);align-items:start}
.steps .n{width:64px;height:64px;border-radius:20px;background:var(--yellow);color:var(--navy-deep);display:grid;place-items:center;font:700 2rem/1 var(--display)}
.steps h3{font:700 1.375rem/1.2 var(--text);letter-spacing:-.01em;margin-bottom:var(--s2)}
.steps p{color:#E4E9FF}
.steps-visual{position:relative;container-type:inline-size;min-height:300px;display:none}
@media (min-width:900px){
  .steps-grid{grid-template-columns:1.1fr .9fr;gap:var(--s9);align-items:center}
  .steps-visual{display:block;height:560px}
  .steps-visual .phone{--w:62cqw;left:19cqw;top:0}
  .steps-visual .chip{left:0;bottom:90px}
}

/* Planos */
.plans{display:grid;gap:var(--s4);align-items:stretch}
.plan.best{order:-1}
@media (min-width:900px){.plan.best{order:0}}
.plan{position:relative;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6) var(--s5);border-radius:28px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line)}
.plan h3{font:600 1.125rem/1 var(--text);color:var(--muted)}
.price{display:flex;align-items:baseline;gap:var(--s2);flex-wrap:wrap}
.price strong{font:700 3.25rem/1 var(--display);letter-spacing:-.02em}
.price span{color:var(--muted);font-size:.9375rem}
.plan .eq{color:var(--muted);font-size:.9375rem;flex:1}
.plan .after{font-size:.8125rem;color:var(--muted)}
.plan.best{background:var(--navy);color:#fff;box-shadow:0 30px 60px -30px rgba(15,42,107,.8)}
.plan.best h3,.plan.best .price span,.plan.best .eq,.plan.best .after{color:#E4E9FF}
.plan.best .price strong{font-size:4rem;color:#fff}
.badge{position:absolute;top:calc(var(--s3)*-1);left:var(--s5);background:var(--yellow);color:var(--navy-deep);font-weight:700;font-size:.8125rem;padding:6px 14px;border-radius:999px;box-shadow:0 6px 14px -4px rgba(10,29,77,.4)}
.plan .btn{width:100%;margin-top:var(--s2)}
.included{margin-top:var(--s7);padding:var(--s6) var(--s5);border-radius:28px;background:var(--soft);display:grid;gap:var(--s5)}
.included h3{font:700 1.5rem/1.15 var(--display);color:var(--navy-deep)}
.included ul{display:grid;gap:var(--s3)}
.included li{display:flex;gap:var(--s3);align-items:flex-start;font-weight:500;color:var(--navy-deep)}
.included .icon{color:var(--brand-strong);width:22px;height:22px;margin-top:1px;stroke-width:2.25}
.example{font-size:.9375rem;color:var(--muted);margin-top:var(--s5);max-width:72ch}
@media (min-width:900px){
  .plans{grid-template-columns:1fr 1fr 1.18fr;align-items:center}
  .plan.best{padding:var(--s8) var(--s6)}
  .included{grid-template-columns:.8fr 1.6fr;padding:var(--s7)}
  .included ul{grid-template-columns:1fr 1fr;gap:var(--s4) var(--s6)}
}

/* FAQ */
.faq-grid{display:grid;gap:var(--s6)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--s4);min-height:64px;padding:var(--s3) 0;font:600 1.125rem/1.35 var(--text);letter-spacing:-.005em;transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--brand-strong)}
.faq summary::after{content:"";width:40px;height:40px;border-radius:50%;flex:none;--bar:var(--brand-strong);background:linear-gradient(var(--bar),var(--bar)) center/14px 2px no-repeat,linear-gradient(var(--bar),var(--bar)) center/2px 14px no-repeat,var(--soft);transition:transform .35s var(--ease),background-color .2s}
.faq details[open] summary::after{transform:rotate(45deg);--bar:#fff;background-color:var(--brand)}
.faq details p{padding:0 var(--s7) var(--s5) 0;color:var(--muted);max-width:62ch}
@media (min-width:900px){.faq-grid{grid-template-columns:.75fr 1.25fr;gap:var(--s9)}.faq-head{position:sticky;top:96px;align-self:start}}

.faq-sec{background:var(--soft)}
.faq-sec .faq details{border-color:rgba(15,42,107,.2)}
.faq-sec .faq summary::after{background-color:#fff}
.faq-sec .faq details[open] summary::after{background-color:var(--brand)}
.faq-sec .faq details p{color:#2A3A66}
.faq-sec :focus-visible{outline-color:var(--navy)}

/* CTA final */
.cta{padding-block:var(--s8);background:var(--navy)}
@media (min-width:900px){.cta{padding-block:var(--s9)}}
.cta-box{position:relative;overflow:hidden;isolation:isolate;border-radius:32px;background:var(--brand);color:#fff;padding:var(--s7) var(--s5) 0;display:grid;gap:var(--s6)}
.cta-box::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;border:1.5px solid rgba(255,255,255,.18);right:-220px;top:-180px;z-index:-1}
.cta-box::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.06);right:-90px;top:-60px;z-index:-1}
.cta-copy{display:grid;gap:var(--s5);justify-items:start}
.cta-visual{position:relative;container-type:inline-size;height:260px}
.cta-visual .phone{--w:54cqw;left:23cqw;top:0}
.cta-visual .phone.l{--w:40cqw;left:2cqw;top:30px}
.cta-visual .phone.r{--w:40cqw;left:auto;right:2cqw;top:44px}
.cta-visual .phone.m{z-index:2}
@media (min-width:900px){
  .cta-box{grid-template-columns:1.1fr .9fr;padding:var(--s9) var(--s9) 0;align-items:center}
  .cta-copy{padding-bottom:var(--s9)}
  .cta-visual{height:440px;align-self:end}
}

/* Rodapé */
.site-foot{background:var(--navy-deep);color:#E4E9FF;padding-block:var(--s8) var(--s9)}
.foot-grid{display:grid;gap:var(--s6)}
.site-foot .brand{color:#fff}
.foot-brand p{max-width:44ch;margin-top:var(--s3)}
.foot-links{display:flex;flex-wrap:wrap;gap:0 var(--s5);align-content:start}
.foot-links a,.foot-legal a,.cookie-preferences{display:inline-flex;align-items:center;min-height:48px;min-width:48px;color:#fff;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.35);transition:text-decoration-color .2s}
.foot-links a:hover,.foot-legal a:hover,.cookie-preferences:hover{text-decoration-color:var(--yellow)}
.foot-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.site-foot .btn{background:var(--yellow);color:var(--navy-deep);min-height:48px;padding:0 var(--s5)}
.site-foot .btn:hover{background:#FFD83A}
.site-foot .login{text-decoration:none}
.foot-legal{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s5);align-items:center;margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid rgba(255,255,255,.14);font-size:.9375rem}
.foot-legal p{margin:0}
.cookie-preferences{background:none;border:0;padding:0;font:inherit;cursor:pointer}
.foot-credit{margin-top:var(--s3);font-size:.8125rem;color:#C9D3F5}
@media (min-width:900px){.foot-grid{grid-template-columns:1.2fr 1fr;align-items:start}.foot-actions{justify-content:flex-end;grid-column:1/-1}.foot-grid{grid-template-columns:1.2fr 1fr auto}.foot-actions{grid-column:auto}}

/* Vídeo de demonstração */
.demo-sec{background:var(--soft);color:var(--navy-deep)}
.demo-grid{display:grid;gap:var(--s6);align-items:center}
.demo-copy{display:grid;gap:var(--s4);justify-items:start}
.demo-copy p{color:#2A3A66;font-size:1.125rem;max-width:44ch}
.video-frame{position:relative;width:fit-content;max-width:100%;margin-inline:auto;padding:10px;background:var(--navy);border-radius:36px;box-shadow:0 30px 60px -24px rgba(10,29,77,.6)}
.video-frame video{display:block;width:auto;max-width:100%;height:min(72svh,640px);aspect-ratio:9/16;border-radius:27px;object-fit:contain;background:var(--navy)}
.player{position:absolute;left:18px;right:18px;bottom:18px;z-index:1;display:flex;align-items:center;gap:4px;min-height:52px;padding:4px 6px;background:rgba(10,29,77,.88);border-radius:14px;color:#fff}
.pbtn{flex:none;display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;border-radius:10px;background:transparent;cursor:pointer}
.pbtn:hover{background:rgba(255,255,255,.14)}
.pbtn svg{display:block;width:22px;height:22px}
.pbtn svg[hidden]{display:none}
#sound-btn .snd-off{display:none}
#sound-btn[aria-pressed="false"] .snd-on{display:none}
#sound-btn[aria-pressed="false"] .snd-off{display:block}
.prange{min-width:0;height:48px;margin:0;background:transparent;accent-color:#fff;cursor:pointer}
.volume{flex:none;width:72px}
.progress{flex:1}
.ptime{flex:none;padding:0 4px;font-size:.8125rem;font-weight:600;white-space:nowrap}
.pbtn:focus-visible,.prange:focus-visible,.vbtn-big:focus-visible{outline:3px solid #fff;outline-offset:2px}
.video-frame video:focus-visible{outline:3px solid var(--yellow);outline-offset:-3px}
.vbtn-big{position:absolute;left:50%;top:50%;z-index:1;display:grid;place-items:center;width:72px;height:72px;padding:0;border:2px solid #fff;border-radius:50%;background:var(--navy);transform:translate(-50%,-50%);cursor:pointer}
.vbtn-big:hover{background:var(--brand-strong)}
.vbtn-big svg{width:30px;height:30px}
.vbtn-big[hidden]{display:none}
.no-video .player,.no-video .vbtn-big{display:none}
@media (max-width:479px){.ptime{display:none}.volume{width:56px}}
@media (min-width:1024px){
  .demo-grid{grid-template-columns:.7fr 1.3fr;gap:var(--s9)}
  .video-frame{width:100%;margin:0;padding:0;border-radius:24px}
  .video-frame video{width:100%;height:auto;aspect-ratio:16/9;border-radius:24px}
  .player{left:16px;right:16px;bottom:16px}
}

/* Movimento: um momento autoral na dobra; o resto só responde ao toque */
@media (prefers-reduced-motion:no-preference){
  .stage .phone,.stage .chip{animation:rise .9s var(--ease) both}
  .stage .p-main{animation-delay:.05s}
  .stage .p-left{animation-delay:.18s}
  .stage .p-right{animation-delay:.28s}
  .stage .c1{animation:pop .6s var(--ease) .55s both}
  .stage .c2{animation:pop .6s var(--ease) .75s both}
  .stage .c3{animation:pop .6s var(--ease) .95s both}
  .js .panel .chip{opacity:0;transform:translateY(10px) scale(.96);transition:opacity .5s var(--ease),transform .6s var(--ease)}
  .js .panel.in .chip{opacity:1;transform:none}
  .js .panel.in .chip:nth-of-type(2){transition-delay:.12s}
  .js .panel.in .chip:nth-of-type(3){transition-delay:.24s}
  @keyframes rise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
  @keyframes pop{from{opacity:0;transform:translateY(8px) scale(.92)}to{opacity:1;transform:none}}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation:none!important}
}

/* The header, footer, colors, buttons and fonts come directly from the landing. */
.blog-body { background: var(--bg); }
.blog-body .top { position: relative; background: var(--brand); }
.blog-body .site-foot { padding-block: 48px 32px; }
.blog-main a:not(.btn) { color: var(--strong); text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.blog-main a:not(.btn):hover { color: var(--navy); }
.blog-main .btn { color: #fff; }
.blog-main .btn:hover { color: #fff; }
.blog-menu > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; border-radius: 12px; color: #fff; font-weight: 600; }
.blog-menu > summary::-webkit-details-marker { display: none; }
.blog-menu > summary:hover { background: rgba(255, 255, 255, .14); }
.blog-menu-panel { color: var(--ink); }
.blog-menu-panel a { color: var(--ink); font-weight: 600; text-decoration: none; }
.blog-menu-panel .btn { color: #fff; background: var(--brand); }
.blog-menu-panel .login { color: var(--ink); }
.blog-main { padding-top: 24px; padding-bottom: 64px; }
.blog-menu { position: absolute; top: 12px; right: 16px; z-index: 31; }
.blog-menu > summary { padding: 10px 14px; min-height: 48px; border: 0; font-size: 1rem; }
.blog-menu-panel { position: absolute; top: 56px; right: 0; z-index: 31; min-width: min(330px, calc(100vw - 32px)); background: var(--white); padding: 16px 24px; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 48px -16px rgba(10, 29, 77, .5); }
.blog-menu-panel nav { display: grid; }
.blog-menu-panel a { display: inline-flex; align-items: center; min-height: 48px; }
.blog-menu-panel .btn { margin-top: 8px; }
.blog-menu-panel .login { padding-left: 0; }
.breadcrumbs { font-size: .9375rem; margin-bottom: 32px; }
.breadcrumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0 12px; }
.breadcrumbs li { display: inline-flex; align-items: center; min-height: 44px; gap: 12px; }
.breadcrumbs li + li::before { content: '/'; color: var(--muted); }
.breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; }
.blog-intro { max-width: 780px; margin-bottom: 28px; }
.blog-intro h1 { font-size: clamp(2.5rem, 7vw, 4.5rem); margin-bottom: 18px; }
.blog-intro p { font-size: 1.2rem; color: var(--muted); }
.category-nav { display: flex; gap: 8px 12px; flex-wrap: wrap; margin-bottom: 32px; }
.blog-main .category-nav a { color: var(--ink); text-decoration: none; font-weight: 500; }
.category-nav a { display: inline-flex; align-items: center; min-height: 48px; padding: 4px 16px; border: 1px solid var(--line); border-radius: 999px; background: var(--white); }
.post-list { display: grid; gap: 24px; }
.post-card { padding: 24px 0; border-top: 2px solid var(--line); overflow-wrap: anywhere; }
.post-card h2 { margin: 12px 0; font: 700 1.75rem/1.1 var(--display); letter-spacing: -.01em; text-wrap: balance; }
.blog-main .post-card h2 a { display: inline-flex; align-items: center; min-height: 48px; color: var(--navy); text-decoration: none; }
.post-card h2 a:hover { text-decoration: underline; }
.post-card p { color: var(--muted); }
.post-meta { color: var(--muted); font-size: .9375rem; }
.post-meta a { display: inline-flex; align-items: center; min-height: 44px; }
.read-link { display: inline-flex; align-items: center; min-height: 48px; margin-top: 12px; }
.pagination { display: flex; gap: 12px; flex-wrap: wrap; margin: 36px 0; }
.pagination a { display: inline-flex; min-width: 48px; min-height: 48px; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 10px; }
.pagination a[aria-current] { background: var(--brand); color: var(--white); }
.blog-article { max-width: 760px; margin-inline: auto; overflow-wrap: anywhere; }
.article-intro h1 { font: 700 clamp(2.25rem, 6vw, 3.5rem)/1.05 var(--display); letter-spacing: -.02em; text-wrap: balance; margin: 12px 0 20px; }
.article-description { color: var(--muted); font-size: 1.25rem; margin-bottom: 12px; }
.article-toc { background: var(--soft); padding: 24px; border-radius: 24px; margin: 28px 0 36px; }
.article-toc h2 { font-size: 1.25rem; color: var(--navy); }
.article-toc ol { padding-left: 22px; margin-bottom: 0; list-style: decimal; }
.article-toc a { display: inline-block; padding: 10px 0; }
.article-toc li.toc-level-3 { margin-left: 16px; }
.prose { font-size: 1.125rem; line-height: 1.8; }
.prose > * + * { margin-top: 20px; }
.prose h2 { font: 700 clamp(1.75rem, 4.5vw, 2.25rem)/1.1 var(--display); letter-spacing: -.01em; margin-top: 44px; color: var(--navy); scroll-margin-top: 90px; }
.prose h3 { font-size: 1.4rem; line-height: 1.3; margin-top: 32px; scroll-margin-top: 90px; }
.prose ul, .prose ol { padding-left: 24px; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li + li { margin-top: 10px; }
.prose blockquote { margin-inline: 0; padding: 16px 22px; border-left: 4px solid var(--brand); background: var(--white); }
.prose table { width: 100%; display: block; overflow-x: auto; border-collapse: collapse; font-size: 1rem; }
.prose th, .prose td { padding: 12px; border: 1px solid var(--line); text-align: left; min-width: 120px; }
.prose pre { padding: 20px; overflow: auto; background: var(--soft); }
.prose code { overflow-wrap: anywhere; }
.article-faq { margin-top: 44px; }
.article-faq details { border-bottom: 1px solid var(--line); }
.article-faq details:first-of-type { border-top: 1px solid var(--line); }
.article-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 8px 0; font-weight: 600; font-size: 1.125rem; cursor: pointer; list-style: none; }
.article-faq summary::-webkit-details-marker { display: none; }
.article-faq summary::after { content: "+"; flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--soft); color: var(--strong); font-size: 1.5rem; font-weight: 500; line-height: 1; }
.article-faq details[open] summary::after { content: "−"; background: var(--brand); color: #fff; }
.article-faq details p { padding: 0 0 20px; color: var(--muted); max-width: 62ch; }
.article-faq h2 { margin-bottom: 20px; }
.blog-cta { margin: 40px 0; padding: 32px 24px; background: var(--soft); border-radius: 28px; color: var(--navy-deep); }
.blog-cta h2 { font: 700 2rem/1.1 var(--display); }
.blog-cta p { margin: 16px 0 24px; }
.blog-cta .plans-link { display: flex; align-items: center; min-height: 48px; margin-top: 12px; }
.related { margin-top: 48px; }
.related > h2 { margin-bottom: 24px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (min-width: 700px) { .post-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 36px; } }
@media (min-width: 900px) { .blog-main { padding-top: 32px; } .blog-menu { display: none; } }