@charset "UTF-8";
*, *::before, *::after{ box-sizing:border-box; }
:root{
--verde:#84BC25;
--verde-escuro:#679405;
--verde-suave:#F0F7E1;
--papel:#FFFFFF;
--papel-2:#F3F5F8;
--papel-3:#EBEEF3;
--tinta:#131829;
--tinta-2:#59607A;
--tinta-3:#8B92A8;
--linha:#E7E9EF;
--linha-forte:#D6DAE4;
--raio:10px; --raio-m:14px; --raio-g:18px;
--sombra:0 1px 3px rgba(17,24,39,.07), 0 1px 2px rgba(17,24,39,.04);
--sombra-m:0 6px 18px rgba(17,24,39,.08);
--fonte:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
--display:"Outfit",var(--fonte);
--largura:1180px;
}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
margin:0; background:var(--papel); color:var(--tinta);
font-family:var(--fonte); font-size:16px; line-height:1.6;
-webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
.lp-dentro{ width:100%; max-width:var(--largura); margin:0 auto; padding:0 20px; }
.claro{ background:var(--papel); color:var(--tinta); position:relative; }
.parede{ background:var(--papel-2); color:var(--tinta); position:relative;
border-top:1px solid var(--linha); border-bottom:1px solid var(--linha); }
.parede::before{
content:""; position:absolute; inset:0; pointer-events:none;
background:
radial-gradient(780px 520px at 10% -10%, rgba(132,188,37,.07), transparent 62%),
radial-gradient(680px 460px at 94% 4%, rgba(132,188,37,.05), transparent 60%);
}
.parede > *{ position:relative; }
.secao{ padding:clamp(60px, 7.5vw, 94px) 0; }
.secao-cabeca{ max-width:64ch; }
.secao-cabeca.centro{ margin-left:auto; margin-right:auto; text-align:center; }
.secao-cabeca.centro .rotulo{ justify-content:center; }
.secao-cabeca.centro .chamada{ margin-left:auto; margin-right:auto; }
.secao-cabeca h2 + .chamada{ margin-top:16px; }
.rotulo{
display:inline-flex; align-items:center; gap:9px;
font-family:var(--display); font-size:12px; font-weight:600;
letter-spacing:.14em; text-transform:uppercase; color:var(--tinta-3);
margin:0 0 16px;
}
.rotulo::before{
content:""; width:9px; height:9px; flex:0 0 9px;
background:var(--verde); border-radius:50% 50% 50% 2px;
}
h1, h2, h3{ font-family:var(--display); font-weight:600; letter-spacing:-.022em;
line-height:1.12; margin:0; color:var(--tinta); text-wrap:balance; }
h1{ font-size:clamp(33px, 5.6vw, 56px); font-weight:500; }
h2{ font-size:clamp(26px, 3.8vw, 38px); }
h3{ font-size:clamp(17px, 2vw, 20px); }
.chamada{ font-size:clamp(15.5px, 1.8vw, 18px); color:var(--tinta-2); line-height:1.6; max-width:62ch; }
.botao{
display:inline-flex; align-items:center; justify-content:center; gap:10px;
padding:14px 28px; border:1px solid transparent; border-radius:999px; cursor:pointer;
font-family:var(--display); font-size:16px; font-weight:600;
color:#fff; text-decoration:none; white-space:nowrap;
background:var(--verde-escuro);
transition:background .15s ease;
}
.botao:hover{ background:var(--verde); color:#fff; }
.botao:focus-visible{ outline:2px solid var(--verde-escuro); outline-offset:3px; }
.botao-g{ padding:17px 36px; font-size:17px; }
.link-discreto{
font-size:15px; color:var(--tinta-2); text-decoration:none;
border-bottom:1px solid var(--linha-forte); padding-bottom:2px;
transition:border-color .15s, color .15s;
}
.link-discreto:hover{ color:var(--tinta); border-bottom-color:var(--verde); }
.ico{ width:22px; height:22px; flex:0 0 22px; color:var(--verde-escuro); }
.ico svg{ width:100%; height:100%; display:block; }
.cartao{
background:var(--papel); border:1px solid var(--linha);
border-radius:var(--raio-m); box-shadow:var(--sombra);
}
.lp-topo{
position:sticky; top:0; z-index:40;
background:rgba(255,255,255,.92); backdrop-filter:blur(12px);
border-bottom:1px solid var(--linha);
}
.lp-topo-dentro{ display:flex; align-items:center; gap:16px; height:66px; }
.lp-topo-marca img{ height:auto; width:auto; max-height:26px; max-width:100%; }
.lp-topo-fim{ margin-left:auto; display:flex; align-items:center; gap:20px; }
.lp-topo .botao{ padding:10px 20px; font-size:15px; }
@media (max-width: 560px){
.lp-topo-fim .link-discreto{ display:none; }
.lp-topo-dentro{ height:58px; }
}
.lp-hero{ padding:clamp(56px, 7.5vw, 96px) 0 clamp(40px, 5vw, 60px); text-align:center; }
.lp-hero h1{ margin:0 auto; max-width:16ch; }
.lp-hero h1 em{ font-style:normal; color:var(--verde-escuro); white-space:nowrap; }
.lp-hero .chamada{ margin:20px auto 0; text-align:center; }
.lp-hero-acoes{ display:flex; align-items:center; justify-content:center; gap:22px;
flex-wrap:wrap; margin-top:30px; }
.lp-hero-nota{ margin:16px 0 0; font-size:13.5px; color:var(--tinta-3); }
.lp-demo{ padding:clamp(44px, 6vw, 72px) 0; }
.lp-demo-caixa{ max-width:1020px; margin:0 auto; }
#demonstracao{
position:relative; aspect-ratio:16/9; width:100%;
border-radius:var(--raio-g); overflow:hidden;
background:var(--papel);
border:1px solid var(--linha-forte);
box-shadow:0 18px 44px rgba(17,24,39,.10), 0 2px 6px rgba(17,24,39,.05);
}
#demonstracao > img,
#demonstracao > video{
position:absolute; inset:0; display:block;
width:100%; height:100%; object-fit:cover; object-position:top center;
border:0; background:var(--papel);
}
.lp-demo-legenda{
margin:18px 0 0; text-align:center; font-size:13.5px; color:var(--tinta-3);
}
.trilho{
position:relative; margin:44px 0 0;
display:grid; gap:12px; grid-template-columns:1fr;
}
@media (min-width: 760px){ .trilho{ grid-template-columns:repeat(4, 1fr); gap:16px; } }
.trilho::before{
content:""; position:absolute; z-index:0; pointer-events:none;
left:50%; top:12px; bottom:12px; width:1px; transform:translateX(-50%);
background:var(--linha-forte);
}
@media (min-width: 760px){
.trilho::before{
left:7%; right:7%; top:50%; bottom:auto; width:auto; height:1px; transform:none;
background:var(--linha-forte);
}
}
.trilho-item{
position:relative; z-index:1; background:var(--papel);
border:1px solid var(--linha); border-radius:var(--raio-m);
padding:22px 18px; text-align:center;
display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px;
min-height:116px; box-shadow:var(--sombra);
}
.trilho-item img{ height:auto; width:auto; max-height:23px; max-width:88%; }
.trilho-item span{ font-size:13px; color:var(--tinta-3); line-height:1.4; }
.garantias{ display:grid; gap:18px; margin:36px 0 0; padding:0; list-style:none; }
@media (min-width: 760px){ .garantias{ grid-template-columns:repeat(3, 1fr); gap:26px; } }
.garantias li{ display:flex; gap:12px; align-items:flex-start; text-align:left;
font-size:15px; color:var(--tinta-2); line-height:1.5; }
.garantias b{ display:block; color:var(--tinta); font-family:var(--display);
font-size:16px; font-weight:600; margin:0 0 3px; }
.passos{ display:grid; gap:16px; margin:42px 0 0; padding:0; list-style:none; }
@media (min-width: 860px){ .passos{ grid-template-columns:repeat(3, 1fr); gap:20px; } }
.passo{
position:relative; background:var(--papel); border:1px solid var(--linha);
border-radius:var(--raio-g); padding:28px 26px 26px; box-shadow:var(--sombra);
display:flex; flex-direction:column; gap:10px; min-height:196px;
}
.passo-topo{ display:flex; align-items:center; gap:12px; }
.passo-n{
font-family:var(--display); font-size:38px; font-weight:700; line-height:1;
margin:0; letter-spacing:-.04em; color:var(--verde);
}
.passo-topo .ico{ width:24px; height:24px; flex-basis:24px; margin-left:auto; color:var(--tinta-3); }
.passo h3{ margin:0; }
.passo p{ margin:auto 0 0; color:var(--tinta-2); font-size:15px; }
.apps{ display:grid; gap:18px; margin:42px 0 0; }
@media (min-width: 900px){ .apps{ grid-template-columns:repeat(2, 1fr); gap:20px; } }
.app{
--c:var(--verde);
position:relative; overflow:hidden;
background:var(--papel); border:1px solid var(--linha);
border-radius:var(--raio-g); padding:0 30px 28px; box-shadow:var(--sombra);
display:flex; flex-direction:column;
transition:border-color .15s ease, box-shadow .15s ease;
}
.app::before{
content:""; position:absolute; top:0; left:0; right:0; height:3px;
background:var(--c);
}
.app:hover{ border-color:var(--linha-forte); box-shadow:var(--sombra-m); }
.app > *{ position:relative; z-index:1; }
@media (min-width: 900px){ .app-duplo{ grid-column:1 / -1; } }
.app-duplo-metades{ display:grid; gap:26px; padding-top:30px; }
@media (min-width: 720px){ .app-duplo .app-duplo-metades{ grid-template-columns:1fr 1fr; gap:38px; } }
.app-logo{ align-self:flex-start; height:auto; width:auto;
max-height:32px; max-width:100%; margin:0 0 14px; }
.app-frase{ font-family:var(--display); font-size:clamp(18px, 2vw, 21px); font-weight:500;
line-height:1.25; margin:0 0 18px; color:var(--c); letter-spacing:-.01em; max-width:22ch; }
.app-lista{ list-style:none; margin:0; padding:0 150px 0 0; display:grid; gap:11px; }
.app-lista li{ position:relative; padding-left:22px; font-size:15px; color:var(--tinta-2); line-height:1.5; }
.app-lista li::before{
content:""; position:absolute; left:2px; top:.6em; width:7px; height:7px;
background:var(--c); border-radius:50% 50% 50% 2px;
}
.app-duplo .app-lista{ padding-right:0; }
@media (min-width: 720px){
.app-duplo .app-duplo-metades > div:last-child .app-lista{ padding-right:160px; }
}
@media (max-width: 719px){
.app-duplo .app-duplo-metades > div:last-child .app-lista{ padding-right:96px; }
}
.app-pessoa{
position:absolute; right:-24px; bottom:-12px; width:182px; height:auto;
z-index:0; pointer-events:none; user-select:none;
-webkit-mask-image:linear-gradient(to bottom, #000 64%, transparent 99%);
mask-image:linear-gradient(to bottom, #000 64%, transparent 99%);
}
@media (max-width: 520px){
.app{ padding:0 22px 24px; }
.app-duplo-metades{ padding-top:26px; }
.app-pessoa{ width:136px; right:-18px; }
.app-lista{ padding-right:94px; }
}
.fluxo{ display:grid; gap:12px; margin:42px 0 0; padding:0; list-style:none; }
@media (min-width: 900px){ .fluxo{ grid-template-columns:repeat(4, 1fr); gap:30px; } }
.fluxo li{ position:relative; }
.fluxo-ponto{
position:relative; height:100%; padding:24px 22px;
background:var(--papel); border:1px solid var(--linha);
border-radius:var(--raio-m); box-shadow:var(--sombra); overflow:hidden;
}
.fluxo-ponto::before{
content:""; position:absolute; top:0; left:0; right:0; height:3px;
background:var(--pc, var(--verde));
}
.fluxo-ponto b{ display:block; font-family:var(--display); font-size:16.5px; font-weight:600;
color:var(--pc, var(--tinta)); margin:0 0 4px; letter-spacing:-.01em; }
.fluxo-ponto span{ font-size:14.5px; color:var(--tinta-2); line-height:1.5; }
.fluxo li:not(:last-child)::after{
content:""; position:absolute; z-index:2;
left:50%; bottom:-12px; transform:translateX(-50%) rotate(90deg);
width:10px; height:10px;
border-right:2px solid var(--linha-forte); border-top:2px solid var(--linha-forte);
}
@media (min-width: 900px){
.fluxo li:not(:last-child)::after{
left:auto; right:-20px; bottom:auto; top:50%; transform:translateY(-50%) rotate(45deg);
}
.fluxo li:not(:last-child)::before{
content:""; position:absolute; top:50%; right:-30px; width:30px; height:1px;
background:var(--linha-forte);
}
}
.lp-junto-fim{
margin:32px 0 0; display:inline-flex; align-items:center; gap:10px;
font-family:var(--display); font-size:16px; font-weight:500; color:var(--tinta);
padding:11px 20px; border-radius:999px;
border:1px solid var(--linha); background:var(--papel); box-shadow:var(--sombra);
}
.quem-grade{ display:grid; gap:34px; align-items:center; }
@media (min-width: 900px){ .quem-grade{ grid-template-columns:1fr minmax(300px, 400px); gap:56px; } }
.quem-texto p{ color:var(--tinta-2); font-size:16px; margin:16px 0 0; max-width:60ch; }
.numeros{ display:flex; gap:40px; flex-wrap:wrap; margin:30px 0 0; padding:26px 0 0;
border-top:1px solid var(--linha); }
.numeros div{ min-width:140px; }
.numeros b{ display:block; font-family:var(--display); font-size:clamp(30px, 3.6vw, 38px);
font-weight:700; line-height:1; letter-spacing:-.03em; color:var(--verde-escuro); }
.numeros span{ display:block; margin-top:7px; font-size:14px; color:var(--tinta-2); line-height:1.4; }
.donos{ position:relative; display:flex; justify-content:center; }
.donos figure{
margin:0; width:52%; position:relative;
border-radius:var(--raio-g); overflow:hidden;
background:var(--papel-2); border:1px solid var(--linha);
box-shadow:var(--sombra);
}
.donos figure:nth-child(2){ margin-left:-20px; margin-top:32px; }
.donos img{ width:100%; height:auto; }
.donos figcaption{
position:absolute; left:0; right:0; bottom:0; padding:20px 14px 12px;
font-family:var(--display); font-weight:600; font-size:14px; color:var(--tinta); text-align:center;
background:linear-gradient(to top, rgba(255,255,255,.96) 62%, rgba(255,255,255,0));
}
.donos figcaption small{ display:block; font-weight:400; font-size:11.5px;
color:var(--tinta-3); letter-spacing:.04em; text-transform:uppercase; }
@media (max-width: 520px){
.donos{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.donos figure{ width:100%; }
.donos figure:nth-child(2){ margin:0; }
}
.perguntas{ display:grid; gap:14px; margin:40px 0 0; padding:0; list-style:none; }
@media (min-width: 720px){
.perguntas{ grid-template-columns:repeat(2, 1fr); gap:16px; }
.perguntas li:last-child{ grid-column:1 / -1; }
}
.perguntas li{
background:var(--papel); border:1px solid var(--linha); border-radius:var(--raio-m);
padding:22px 24px; display:flex; gap:13px; align-items:flex-start;
box-shadow:var(--sombra); transition:border-color .15s ease;
}
.perguntas li:hover{ border-color:var(--linha-forte); }
.perguntas .ico{ margin-top:1px; width:20px; height:20px; flex-basis:20px; }
.perguntas b{ display:block; font-family:var(--display); font-size:16px; font-weight:600;
color:var(--tinta); margin:0 0 3px; }
.perguntas span{ display:block; color:var(--tinta-2); font-size:15px; }
.lp-fim{ padding:clamp(60px, 8vw, 96px) 0; }
.lp-fim-painel{
position:relative; max-width:860px; margin:0 auto; overflow:hidden;
padding:clamp(36px, 5vw, 56px) clamp(24px, 5vw, 56px);
background:var(--papel); border:1px solid var(--linha);
border-radius:var(--raio-g); box-shadow:var(--sombra-m);
}
.lp-fim-painel::before{
content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
background:var(--verde);
}
.lp-fim-painel h2{ max-width:18ch; }
.lp-fim-painel .chamada{ margin:16px 0 0; }
.lp-fim-acoes{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:28px; }
.lp-rodape{ background:var(--papel-3); border-top:1px solid var(--linha); padding:34px 0 30px; }
.lp-rodape-dentro{ display:grid; gap:18px; }
@media (min-width: 760px){
.lp-rodape-dentro{ grid-template-columns:1fr auto; align-items:center; }
}
.lp-rodape-marca{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.lp-rodape-marca img{ height:auto; width:auto; max-height:24px; max-width:100%; }
.lp-rodape-marca span{ font-size:13.5px; color:var(--tinta-3); }
.lp-rodape-links{ display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap;
font-size:14px; color:var(--tinta-3); }
.lp-rodape-links a{ color:var(--tinta-2); text-decoration:none; }
.lp-rodape-links a:hover{ color:var(--tinta); text-decoration:underline; }
.lp-rodape-links .sep{ color:var(--linha-forte); }
body{ display:flex; flex-direction:column; }
body > .lp-rodape{ order:1; }