/* Vetor Funcional · conceito "Grade de forças" (Diretor de Arte, 22/10/2026) */
@font-face{font-family:Manrope;src:url(/fonts/manrope-latin.woff2) format("woff2");font-weight:400 800;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/fonts/plexmono-400-latin.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--noite:#0E1E2A;--noite-2:#16293A;--gelo:#EEF4F7;--cinza:#9FB3C1;--branco:#FFF;--laranja:#F28C38;--linha:#5CC0F0;--papel:#F7FBFC;--marinho:#112839;--texto-2:#3E5566;--borda-campo:#68747C;--fio-escuro:rgba(238,244,247,.10);--fio-claro:rgba(14,30,42,.10);--f-texto:Manrope,Arial,sans-serif;--f-mono:"IBM Plex Mono",ui-monospace,monospace;--raio:0;--pad:1.875rem;--max:85rem;--s4:.25rem;--s10:.625rem;--s20:1.25rem;--s30:1.875rem;--s44:2.75rem;--s60:3.75rem;--s100:6.25rem;--t-display:clamp(2.5rem,5.9vw,5.3125rem);--t-h2:clamp(2.25rem,4.2vw,3.75rem);--t-peq:.875rem;--track:-.04em}
*,*::before,*::after{box-sizing:border-box}*{margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:4rem;-webkit-text-size-adjust:100%}
body{font-family:var(--f-texto);background:var(--noite);color:var(--gelo);font-size:1rem;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--linha);outline-offset:3px}
.pular{position:absolute;left:1rem;top:-60px;z-index:30;background:var(--branco);color:var(--noite);padding:.7rem 1rem}.pular:focus{top:1rem}
.wrap{max-width:var(--max);margin:0 auto}
.eyebrow,.mono{font-family:var(--f-mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.02em;line-height:1.4;font-weight:400}
/* nav em células */
.nav{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto;border-bottom:1px solid var(--fio-escuro);background:rgba(14,30,42,.94);backdrop-filter:blur(10px)}
.nav>*{display:flex;align-items:center;padding:0 var(--pad);min-height:3.5rem}
.marca{border-right:1px solid var(--fio-escuro);font-weight:600;letter-spacing:-.02em;gap:.6rem;text-decoration:none}
.marca small{font-family:var(--f-mono);font-size:.7rem;color:var(--cinza);font-weight:400;text-transform:uppercase}
.links{justify-content:center;gap:2rem;font-size:var(--t-peq);color:var(--cinza)}
.links a{text-decoration:none;padding:.5rem 0}.links a:hover{color:var(--gelo)}
.nav-cta{border-left:1px solid var(--fio-escuro);gap:0}
.menu-btn{display:none;width:3.5rem;height:3.5rem;background:transparent;border:0;border-left:1px solid var(--fio-escuro);color:var(--gelo);cursor:pointer;place-items:center}
.menu-btn svg{width:20px;height:20px}
/* botão Cadvel */
.btn{display:inline-flex;align-items:center;gap:var(--s20);padding:var(--s4) var(--s4) var(--s4) var(--s20);background:var(--branco);color:var(--noite);border-radius:var(--raio);text-decoration:none;font:600 var(--t-peq)/1.2 var(--f-texto);letter-spacing:-.01em;border:0;cursor:pointer;transition:transform .2s}
.btn i{width:var(--s44);height:var(--s44);background:var(--noite);display:grid;place-items:center;flex:none;transition:background .2s}
.btn i svg{width:1rem;height:1rem;stroke:var(--laranja);stroke-width:2;fill:none;transition:transform .2s}
.btn:hover i svg{transform:translateX(3px)}
.btn.sm{font-size:.8rem}.btn.sm i{width:2.25rem;height:2.25rem}
.claro .btn{background:var(--noite);color:var(--branco)}.claro .btn i{background:var(--branco)}.claro .btn i svg{stroke:var(--noite)}
.link{color:inherit;text-underline-offset:20%;text-decoration-thickness:1px;text-decoration-color:currentColor}
/* hero: visual sangra até a borda direita */
.hero{position:relative;border-bottom:1px solid var(--fio-escuro);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:44rem}
.hero-txt{padding:var(--s60) var(--pad) 9rem max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)));display:flex;flex-direction:column;gap:var(--s30);position:relative;z-index:2}
.sobre{color:var(--cinza)}
h1.eyebrow{color:var(--gelo);max-width:30rem}
.display{font-size:var(--t-display);font-weight:500;letter-spacing:var(--track);line-height:1;max-width:44rem;text-wrap:balance}
.sub{font-size:1.0625rem;line-height:1.45;color:var(--cinza);max-width:31rem}
.acoes{display:flex;align-items:center;gap:var(--s30);flex-wrap:wrap}
.hero-vis{position:relative;border-left:1px solid var(--fio-escuro);background:repeating-linear-gradient(135deg,rgba(238,244,247,.035) 0 1px,transparent 1px 14px),var(--noite-2)}
.vetores{position:absolute;inset:0;width:100%;height:100%}
.faixa{position:absolute;left:0;right:0;bottom:0;z-index:3;border-top:1px solid var(--fio-escuro);background:rgba(14,30,42,.82);backdrop-filter:blur(10px)}
.faixa ul{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.faixa li{padding:var(--s20) var(--pad);border-right:1px solid var(--fio-escuro)}
.faixa li:last-child{border-right:0}
.faixa li span{display:block;color:var(--cinza);margin-bottom:.25rem}
/* animação do diagrama: só SVG + CSS */
@media (prefers-reduced-motion:no-preference){
 .vetores .anim path{stroke-dasharray:1;stroke-dashoffset:1;animation:traco 1.4s cubic-bezier(.2,.7,.2,1) forwards}
 .vetores .anim path:nth-child(2){animation-delay:.25s}.vetores .anim path:nth-child(3){animation-delay:.5s}
 .vetores .forca path{stroke-dasharray:1;stroke-dashoffset:1;animation:traco 1s .9s cubic-bezier(.2,.7,.2,1) forwards}
 .vetores text{opacity:0;animation:surge .5s 1.5s forwards}
 .vetores .pulso{transform-origin:300px 280px;animation:pulso 2.8s 2s ease-in-out infinite}
}
@keyframes traco{to{stroke-dashoffset:0}}@keyframes surge{to{opacity:1}}
@keyframes pulso{0%,100%{opacity:.9;transform:scale(1)}50%{opacity:.35;transform:scale(1.8)}}
/* seções */
.sec{border-bottom:1px solid var(--fio-escuro)}
.sec .wrap{display:grid;grid-template-columns:minmax(0,.38fr) minmax(0,1fr)}
.sec .cel-a{padding:var(--s100) var(--pad);border-right:1px solid var(--fio-escuro)}
.sec .cel-b{padding:var(--s100) var(--pad)}
.claro{background:var(--papel);color:var(--marinho);border-bottom-color:var(--fio-claro)}
.claro .cel-a{border-right-color:var(--fio-claro)}
.num{font:400 .75rem/1 var(--f-mono);color:var(--laranja);display:inline-grid;place-items:center;width:2.25rem;height:2.25rem;border:1px solid var(--borda-campo);margin-bottom:var(--s20)}
.claro .num{color:var(--marinho);border-color:var(--fio-claro)}
.cel-a .eyebrow{color:var(--cinza);display:block}
.claro .cel-a .eyebrow{color:var(--texto-2)}
h2{font-size:var(--t-h2);font-weight:500;letter-spacing:var(--track);line-height:1;margin-bottom:var(--s30);text-wrap:balance;max-width:48rem}
h3{font-size:1.5rem;font-weight:500;letter-spacing:-.02em;line-height:1.15}
.texto p{color:var(--cinza);max-width:38rem;margin-bottom:1rem;font-size:1.0625rem}
.claro .texto p{color:var(--texto-2)}
.texto p strong{color:var(--gelo);font-weight:600}.claro .texto p strong{color:var(--marinho)}
.destaque{margin-top:var(--s30);padding-top:var(--s20);border-top:1px solid var(--marinho);font-size:1.4rem!important;line-height:1.3;color:var(--marinho)!important;font-weight:500;letter-spacing:-.02em}
.linhas{list-style:none;border-top:1px solid var(--fio-escuro);margin-top:var(--s20)}
.claro .linhas{border-top-color:var(--fio-claro)}
.linhas li{display:grid;grid-template-columns:2.25rem 1fr;gap:var(--s20);align-items:center;padding:var(--s20) 0;border-bottom:1px solid var(--fio-escuro);font-size:1.0625rem}
.claro .linhas li{border-bottom-color:var(--fio-claro)}
.linhas b{font:400 .75rem var(--f-mono);color:var(--laranja);border:1px solid var(--borda-campo);height:2.25rem;display:grid;place-items:center}
.claro .linhas b{color:var(--marinho);border-color:var(--fio-claro)}
.nota{margin-top:var(--s20);font-size:var(--t-peq);color:var(--texto-2)}
/* cards em grade */
.grade{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--fio-claro);border-left:1px solid var(--fio-claro);margin-top:var(--s30)}
.grade article{padding:var(--s30);border-right:1px solid var(--fio-claro);border-bottom:1px solid var(--fio-claro);display:flex;flex-direction:column;gap:.6rem}
.grade article>p{color:var(--texto-2)}
.grade details{margin-top:auto;padding-top:.6rem}
.grade summary{cursor:pointer;font:400 .75rem var(--f-mono);text-transform:uppercase;color:var(--marinho);min-height:2rem;display:flex;align-items:center;gap:.5rem;text-decoration:underline;text-underline-offset:20%}
.grade details p{margin-top:.4rem;color:var(--texto-2);font-size:.95rem}
.fecho{margin-top:var(--s30);font-size:1.4rem;font-weight:500;letter-spacing:-.02em;max-width:34rem;color:var(--marinho)}
/* dados */
.dados{border-top:1px solid var(--fio-escuro);margin-bottom:var(--s30)}
.dados div{display:grid;grid-template-columns:minmax(0,.45fr) minmax(0,1fr);gap:1rem;padding:var(--s20) 0;border-bottom:1px solid var(--fio-escuro)}
.dados dt{color:var(--cinza)}.dados dd{font-weight:500}
/* faq */
.faq details{border-bottom:1px solid var(--fio-claro)}
.faq details:first-child{border-top:1px solid var(--fio-claro)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;padding:var(--s20) 0;font-weight:500;font-size:1.125rem;min-height:44px;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 1.2rem/1 var(--f-mono);color:var(--marinho)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding-bottom:var(--s20);color:var(--texto-2);max-width:42rem}
/* #lista */
.lista-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.lista-intro{padding:var(--s100) var(--pad);border-right:1px solid var(--fio-escuro);display:flex;flex-direction:column;gap:var(--s30)}
.lista-intro .eyebrow{color:var(--cinza)}
.lista-intro h2{margin:0}
.lista-intro>p{color:var(--cinza);max-width:30rem}
.form{padding:var(--s100) var(--pad);background:var(--noite-2);display:flex;flex-direction:column;gap:var(--s20)}
.campos{display:grid;grid-template-columns:1fr 1fr;gap:var(--s20)}
.campo{display:flex;flex-direction:column;gap:.5rem}.campo.full{grid-column:1/-1}
.campo label{font:400 .75rem var(--f-mono);text-transform:uppercase;color:var(--cinza)}
.campo label em{font-style:normal;text-transform:none}
input,select{height:3rem;width:100%;background:transparent;border:1px solid var(--borda-campo);border-radius:0;color:var(--gelo);font:400 1rem var(--f-texto);padding:0 .875rem}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--cinza) 50%),linear-gradient(135deg,var(--cinza) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat}
select option{color:#000}
.check{display:grid;grid-template-columns:1.25rem 1fr;gap:.75rem;font-size:var(--t-peq);line-height:1.45}
.check input{width:1.25rem;height:1.25rem;padding:0;accent-color:var(--laranja)}
.check a{color:var(--gelo)}
.envio{display:flex;flex-direction:column;align-items:flex-start;gap:.75rem;margin-top:var(--s10)}
.envio small{font-size:.8125rem;color:var(--cinza)}
.erro{color:#FFB4A0;font-size:var(--t-peq);font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.status{padding:var(--s100) var(--pad);background:var(--noite-2);display:flex;flex-direction:column;gap:var(--s20);align-items:flex-start}
.status p{color:var(--cinza);max-width:32rem}.status a.link{color:var(--gelo)}
.status[hidden],.form[hidden]{display:none}
/* rodapé em células */
.rodape{border-top:1px solid var(--fio-escuro);font-size:var(--t-peq);color:var(--cinza)}
.rodape .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.rodape .wrap>div{padding:var(--s60) var(--pad);border-right:1px solid var(--fio-escuro);display:flex;flex-direction:column;gap:.6rem}
.rodape .wrap>div:last-child{border-right:0}
.rodape b{color:var(--gelo);font-weight:600}
.rodape a{color:var(--gelo);text-underline-offset:20%}
.rodape .fino{grid-column:1/-1;padding:var(--s20) var(--pad);border-top:1px solid var(--fio-escuro);font-size:.8rem}
@media (prefers-reduced-motion:no-preference){.js .rv{opacity:0;transform:translateY(12px);transition:opacity .5s,transform .5s}.js .rv.on{opacity:1;transform:none}}
@media (max-width:991px){
 .links{display:none}.nav{grid-template-columns:1fr auto auto}.nav-cta{padding:0 var(--s10)}
 .menu-btn{display:grid}
 .links.aberto{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;padding:0;background:var(--noite);border-bottom:1px solid var(--fio-escuro)}
 .links.aberto a{padding:1rem var(--pad);border-top:1px solid var(--fio-escuro);color:var(--gelo);font-size:1rem}
 .hero-grid,.lista-grid,.sec .wrap,.rodape .wrap{grid-template-columns:1fr}
 .hero-txt{padding:var(--s44) var(--pad)}
 .hero-vis{border-left:0;border-top:1px solid var(--fio-escuro);height:20rem}
 .faixa{position:static}.faixa ul{grid-template-columns:1fr}
 .faixa li{border-right:0;border-bottom:1px solid var(--fio-escuro);padding:.875rem var(--pad)}
 .faixa li:last-child{border-bottom:0}
 .sec .cel-a{border-right:0;padding:var(--s60) var(--pad) 0}.sec .cel-b{padding:var(--s30) var(--pad) var(--s60)}
 .lista-intro{border-right:0;border-bottom:1px solid var(--fio-escuro);padding:var(--s60) var(--pad)}
 .form,.status{padding:var(--s60) var(--pad)}
 .rodape .wrap>div{border-right:0;border-bottom:1px solid var(--fio-escuro);padding:var(--s30) var(--pad)}
}
@media (max-width:640px){.grade{grid-template-columns:1fr}.dados div{grid-template-columns:1fr;gap:.2rem}}
@media (max-width:479px){
 :root{--pad:1.25rem}
 .marca small{display:none}
 .nav-cta .btn span{display:none}.nav-cta .btn{padding:0}
 .campos{grid-template-columns:1fr}
 .acoes .btn,.envio .btn{width:100%;justify-content:space-between}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.nota.escuro{color:var(--cinza)}