/* site.css · a casca do site institucional da Move Data.
   Consome só token do Design System. Os únicos valores novos são de layout. */

:root{
  --site-max:1200px;
  --nav-h:64px;
}

body{background:var(--bg)}
.wrap{width:100%; max-width:var(--site-max); margin-inline:auto; padding-inline:var(--gutter)}
.sec{position:relative; padding-block:var(--s-10)}
.sec--tight{padding-block:var(--s-9)}
.sec--sunk{background:var(--bg-sunk)}
.sec-head{display:grid; gap:var(--s-4); margin-bottom:var(--s-8); max-width:760px}
.sec-head .t-h1{max-width:24ch}

/* ===================== navegação ===================== */
.nav{position:fixed; inset:0 0 auto 0; height:var(--nav-h); z-index:var(--z-nav);
  border-bottom:1px solid transparent;
  transition:background var(--t-slow) var(--ease), border-color var(--t-slow)}
.nav.solida{background:color-mix(in srgb, var(--bg) 78%, transparent);
  backdrop-filter:blur(var(--blur-vidro)); -webkit-backdrop-filter:blur(var(--blur-vidro));
  border-bottom-color:var(--border)}
.nav-marca img{transition:opacity var(--t-base)}
.nav.sem-marca .nav-marca img{opacity:0}
.nav.clara{background:rgba(255,255,255,.82); border-bottom-color:rgba(15,19,76,.08);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px)}
.nav.clara .nav-links a{color:var(--paper-text)}
.nav.clara .nav-links a:hover{background:rgba(15,19,76,.06)}
.nav .marca-clara{display:none}
.nav.clara .marca-escura{display:none}
.nav.clara .marca-clara{display:block}
.nav.clara .nav-menu{color:var(--paper-text)}
.nav .wrap{height:100%; display:flex; align-items:center; gap:var(--s-6)}
.nav-marca img{height:26px; width:auto}
.nav-links{display:flex; gap:var(--s-1); margin-left:auto; list-style:none; padding:0}
.nav-links a{display:block; padding:10px 14px; border-radius:var(--r-pill);
  font-size:var(--fs-ui); color:var(--text-2); transition:color var(--t-fast), background var(--t-fast)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--text); background:var(--state-hover)}
.nav-menu{display:none; margin-left:auto}
.nav-menu svg{width:20px; height:20px}
@media (max-width:900px){
  .nav-links{display:none; position:fixed; top:var(--nav-h); left:0; right:0; flex-direction:column;
    padding:var(--s-4) var(--gutter) var(--s-6); background:var(--bg); border-bottom:1px solid var(--border)}
  .nav.aberta .nav-links{display:flex}
  .nav.aberta{background:var(--bg)}
  .nav-links a{padding:14px 4px; font-size:var(--fs-lead); border-radius:0;
    border-bottom:1px solid var(--border)}
  .nav-menu{display:inline-flex}
  .nav .btn--primary{display:none}
}

/* ===================== o método · os quatro pilares ===================== */
.pilares{list-style:none; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s-3)}
.pilares li{display:grid; gap:var(--s-2); align-content:start; padding:var(--s-5); border:1px solid var(--border);
  border-radius:var(--r-cartao); background:var(--surface)}
.pilares i{width:14px; height:14px; border-radius:3px; margin-bottom:var(--s-3)}
.pilares h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.pilares p{font-size:var(--fs-sm); color:var(--text-2); line-height:1.6}
@media (max-width:1000px){ .pilares{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:600px){ .pilares{grid-template-columns:1fr} }

/* ===================== o percurso · cinco movimentos ===================== */
.percurso{display:grid; gap:var(--s-3)}
.conducao{display:grid; grid-template-columns:1fr 3fr 1fr; gap:var(--s-2)}
.conducao span{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-3); padding:var(--s-2) var(--s-3);
  border:1px solid var(--border); border-radius:var(--r-pill); text-align:center}
.conducao .move{color:var(--accent); border-color:var(--accent-ring)}
.movs{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:var(--s-2); list-style:none; padding:0}
.mov{background:var(--surface); border:1px solid var(--border); border-radius:var(--r-cartao);
  padding:var(--s-5); display:flex; flex-direction:column; gap:var(--s-2); min-height:100%}
.mov .n{font-family:var(--font-mono); font-size:var(--fs-sm); color:var(--accent-good)}
.mov h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.mov .pilar{display:flex; align-items:center; gap:var(--s-2); font-family:var(--font-mono);
  font-size:var(--fs-micro); letter-spacing:.14em; text-transform:uppercase; color:var(--text-3)}
.mov .pilar i{width:8px; height:8px; border-radius:2px; flex:none}
.mov p{font-size:var(--fs-sm); color:var(--text-2); line-height:1.55; margin-top:auto; padding-top:var(--s-3);
  border-top:1px solid var(--border)}
.mov p small{display:block; font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-weak); margin-bottom:var(--s-1)}
.mov .quem{display:none; font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent)}
.catraca-linha{display:flex; align-items:center; gap:var(--s-3); margin-top:var(--s-2);
  font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-good)}
.catraca-linha::before{content:""; flex:1; height:1px; background:var(--grad-cool); opacity:.7}
.catraca-linha svg{width:16px; height:16px; flex:none}
.percurso-notas{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-4); margin-top:var(--s-6)}
.percurso-notas p{font-size:var(--fs-sm); color:var(--text-2); line-height:1.6; max-width:52ch}
.percurso-notas strong{color:var(--text); font-weight:var(--fw-med)}
@media (max-width:1000px){
  .movs{grid-template-columns:1fr}
  .conducao{display:none}
  .mov .quem{display:block; grid-column:2}
  .mov{display:grid; grid-template-columns:auto 1fr; column-gap:var(--s-4)}
  .mov .n{grid-row:1 / span 2}
  .mov p{grid-column:2}
  .percurso-notas{grid-template-columns:1fr}
}

/* ===================== a catraca ===================== */
.catraca{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:var(--s-8); align-items:start}
.catraca .claim{border-top:0; padding-top:0}
.catraca .claim h3{max-width:18ch}
.herdadas{list-style:none; padding:0; border:1px solid var(--border); border-radius:var(--r-cartao);
  background:var(--surface); overflow:hidden}
.herdadas li{display:flex; align-items:center; gap:var(--s-4); padding:var(--s-5);
  border-bottom:1px solid var(--border); font-size:var(--fs-lead); font-weight:var(--fw-light)}
.herdadas li:last-child{border-bottom:0}
.herdadas li b{font-family:var(--font-mono); font-weight:var(--fw-book); font-size:var(--fs-sm);
  color:var(--accent-good)}
.herdadas li svg{width:18px; height:18px; color:var(--accent-good); margin-left:auto; flex:none}
.fronteira{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-2); margin-top:var(--s-8)}
.fronteira div{border:1px solid var(--border); border-radius:var(--r-cartao); padding:var(--s-6)}
.fronteira h3{font-weight:var(--fw-air); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.fronteira p{margin-top:var(--s-3); font-size:var(--fs-sm); color:var(--text-2); max-width:44ch}
@media (max-width:900px){ .catraca,.fronteira{grid-template-columns:1fr} .catraca{gap:var(--s-6)} }

/* ===================== prova ===================== */
.provas{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:var(--s-8)}
.provas .claim h3{font-size:clamp(24px,2.4vw,34px)}
@media (max-width:900px){ .provas{grid-template-columns:1fr} }

/* ===================== portfólio ===================== */
.produtos{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-3)}
.produto{position:relative; display:flex; flex-direction:column; gap:var(--s-4); min-height:340px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-cartao-alto);
  padding:var(--s-6); overflow:hidden; transition:border-color var(--t-base), transform var(--t-base) var(--ease)}
a.produto:hover{border-color:var(--border-strong); transform:translateY(-2px)}
.produto--mdesk{grid-column:1 / -1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:var(--s-8); row-gap:var(--s-4); align-items:start}
.produto--mdesk .produto-marca{grid-column:1}
.produto--mdesk h3{grid-column:1}
.produto--mdesk p{grid-column:2; grid-row:1 / span 2; align-self:end}
.produto--mdesk .edicoes{grid-column:2}
.produto--mdesk .rodape{grid-column:1 / -1; margin-top:var(--s-5)}
.produto-marca{height:44px; display:flex; align-items:center}
.produto-marca img{height:100%; width:auto; max-width:100%; object-fit:contain; object-position:left}
.produto-marca--mdesk{height:52px}
.produto-marca--easydoor{height:72px}
.produto-marca--mlink{height:40px}
.produto-nome{font-weight:var(--fw-air); font-size:clamp(34px,3.4vw,48px); letter-spacing:-.03em; line-height:1}
.produto h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2); max-width:20ch}
.produto h3 b{font-family:var(--font-mono); font-weight:var(--fw-air); color:var(--accent-good)}
.produto p{font-size:var(--fs-sm); color:var(--text-2); max-width:46ch}
.produto .rodape{margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--s-3);
  flex-wrap:wrap}
.produto .ir{display:inline-flex; align-items:center; gap:var(--s-2); font-size:var(--fs-ui); color:var(--accent)}
.produto .ir svg{width:15px; height:15px}
.edicoes{display:flex; flex-wrap:wrap; gap:var(--s-2)}
.edicoes span{font-size:var(--fs-sm); padding:6px 12px; border:1px solid var(--border-strong);
  border-radius:var(--r-pill); color:var(--text-2)}
.selo-casas{display:inline-flex; align-items:center; gap:var(--s-2); font-family:var(--font-mono);
  font-size:var(--fs-micro); letter-spacing:.14em; text-transform:uppercase; color:var(--text-3)}
.selo-casas i{font-style:normal; color:var(--accent)}
.produto--breve .produto-marca{opacity:.6}
.marca-dagua{position:absolute; right:-6%; top:22%; transform:rotate(-12deg);
  font-family:var(--font-mono); font-size:clamp(40px,5vw,72px); font-weight:var(--fw-air);
  letter-spacing:.08em; text-transform:uppercase; color:var(--text); opacity:.05;
  pointer-events:none; white-space:nowrap}
.breve{display:inline-flex; align-items:center; gap:var(--s-2); font-family:var(--font-mono);
  font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--warn)}
.breve::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--warn)}
@media (max-width:1000px){ .produtos{grid-template-columns:1fr} .produto{min-height:0}
  .produto--mdesk{grid-template-columns:1fr} .produto--mdesk > *{grid-column:1 !important; grid-row:auto !important} }

/* ===================== públicos ===================== */
.publicos{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3)}
.publico{display:flex; flex-direction:column; gap:var(--s-4); padding:var(--s-7) var(--s-6);
  border:1px solid var(--border); border-radius:var(--r-cartao-alto); background:var(--surface);
  transition:border-color var(--t-base), transform var(--t-base) var(--ease)}
a.publico:hover{border-color:var(--accent-ring); transform:translateY(-2px)}
.publico h3{font-weight:var(--fw-air); font-size:var(--fs-h1); letter-spacing:var(--tr-h1); line-height:1.1}
.publico h3 b{font-family:var(--font-mono); font-weight:var(--fw-air); color:var(--accent-good)}
.publico p{font-size:var(--fs-body); color:var(--text-2); max-width:44ch}
.publico .ir{margin-top:auto; display:inline-flex; align-items:center; gap:var(--s-2); color:var(--accent);
  font-size:var(--fs-ui)}
.publico .ir svg{width:15px; height:15px}
@media (max-width:900px){ .publicos{grid-template-columns:1fr} }

/* ===================== chamada final ===================== */
.chamada{position:relative; overflow:hidden; text-align:center}
.chamada .wrap{position:relative; z-index:var(--z-raised); display:grid; justify-items:center; gap:var(--s-5)}
.chamada .t-h1{max-width:20ch}
.chamada .t-lead{margin-inline:auto}
.chamada .contatos{display:flex; flex-wrap:wrap; justify-content:center; gap:var(--s-5);
  font-family:var(--font-mono); font-size:var(--fs-sm); color:var(--text-3)}
.chamada .contatos a:hover{color:var(--accent)}

/* ===================== rodapé ===================== */
.rodape-site{border-top:1px solid var(--border); padding-block:var(--s-8) var(--s-7); background:var(--bg-sunk)}
.rodape-site .wrap{display:grid; grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr)); gap:var(--s-7)}
.rodape-site img{height:24px; width:auto; margin-bottom:var(--s-4)}
.rodape-site p,.rodape-site li{font-size:var(--fs-sm); color:var(--text-3); line-height:1.7}
.rodape-site ul{list-style:none; padding:0}
.rodape-site a:hover{color:var(--text)}
.rodape-site .t-label{margin-bottom:var(--s-3)}
.rodape-fim{grid-column:1 / -1; padding-top:var(--s-5); border-top:1px solid var(--border);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--s-3)}
@media (max-width:900px){ .rodape-site .wrap{grid-template-columns:1fr} }

/* toque */
@media (pointer:coarse){ .btn{min-height:44px} }

/* =====================================================================
   PÁGINAS INTERNAS
   ===================================================================== */
.pagina-topo{position:relative; padding-top:calc(var(--nav-h) + var(--s-9)); padding-bottom:var(--s-9); overflow:hidden}
.pagina-topo .wrap{position:relative; z-index:var(--z-raised); display:grid; gap:var(--s-5)}
.pagina-topo h1{max-width:20ch}
.pagina-topo h1 b{font-family:var(--font-mono); font-weight:var(--fw-air); color:var(--accent-good)}

/* ---- produtos · ficha por produto ---- */
.ficha{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:var(--s-8); align-items:start;
  padding-block:var(--s-9); border-top:1px solid var(--border)}
.ficha-id{display:grid; gap:var(--s-4); position:sticky; top:calc(var(--nav-h) + var(--s-6))}
.ficha-id .produto-nome{font-size:clamp(44px,5vw,72px)}
.ficha-id .produto-marca{height:64px}
.ficha--breve .produto-marca{opacity:.6}
.ficha-id .produto-marca--mdesk{height:60px}
.ficha-id .produto-marca--easydoor{height:96px}
.ficha-id .produto-marca--mlink{height:52px}
.ficha-id p{font-size:var(--fs-body); color:var(--text-2); max-width:44ch}
.ficha-id .acoes{display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-3)}
.ficha .claim:first-child{border-top:0; padding-top:0}
.ficha--breve{position:relative; overflow:hidden}
.ficha--breve .produto-nome{opacity:.34}
.ficha--breve .marca-dagua{top:30%; right:2%; font-size:clamp(56px,9vw,140px); opacity:.04}
.breve-texto{display:grid; gap:var(--s-4); align-content:start}
.breve-texto h2{font-weight:var(--fw-air); font-size:var(--fs-h1); letter-spacing:var(--tr-h1); max-width:20ch}
@media (max-width:900px){ .ficha{grid-template-columns:1fr; gap:var(--s-6)} .ficha-id{position:static} }

/* ---- agências · degraus ---- */
.degrau{display:grid; grid-template-columns:120px minmax(0,1fr); gap:var(--s-7); padding-block:var(--s-9);
  border-top:1px solid var(--border)}
.degrau-n{font-family:var(--font-mono); font-weight:var(--fw-air); font-size:clamp(48px,5vw,72px);
  color:var(--accent-good); line-height:1}
.degrau-n small{display:block; margin-top:var(--s-3); font-size:var(--fs-micro); letter-spacing:.18em;
  text-transform:uppercase; color:var(--text-3)}
.degrau-corpo{display:grid; gap:var(--s-5); min-width:0}
.degrau-corpo h2{font-weight:var(--fw-air); font-size:var(--fs-h1); letter-spacing:var(--tr-h1); max-width:22ch}
.degrau-corpo h2 b{font-family:var(--font-mono); font-weight:var(--fw-air); color:var(--accent-good)}
.degrau-corpo > p{font-size:var(--fs-lead); font-weight:var(--fw-light); color:var(--text-2); max-width:var(--measure-lead)}
.telas{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-3); margin-top:var(--s-3)}
.telas figure{display:grid; gap:var(--s-3)}
.telas img{width:100%; height:auto; border-radius:var(--r-palco); border:1px solid var(--border)}
.telas figcaption{font-size:var(--fs-sm); color:var(--text-2)}
.telas figcaption b{display:block; font-family:var(--font-mono); font-weight:var(--fw-book); font-size:var(--fs-micro);
  letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin-bottom:var(--s-1)}
.antes-depois{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3)}
.antes-depois div{border:1px solid var(--border); border-radius:var(--r-cartao); padding:var(--s-5)}
.antes-depois .depois{border-color:var(--accent-ring)}
.antes-depois ul{list-style:none; padding:0; display:grid; gap:var(--s-3); margin-top:var(--s-4)}
.antes-depois li{font-size:var(--fs-sm); color:var(--text-2); padding-left:var(--s-5); position:relative}
.antes-depois li::before{content:""; position:absolute; left:0; top:.6em; width:10px; height:1px; background:var(--text-weak)}
.antes-depois .depois li::before{background:var(--accent-good)}
@media (max-width:900px){
  .degrau{grid-template-columns:1fr; gap:var(--s-4)}
  .telas,.antes-depois{grid-template-columns:1fr}
}

/* ---- sobre · duas casas ---- */
.casas{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3)}
.casa{display:flex; flex-direction:column; gap:var(--s-4); padding:var(--s-7) var(--s-6);
  border:1px solid var(--border); border-radius:var(--r-cartao-alto); background:var(--surface)}
.casa-logo{height:40px; display:flex; align-items:center}
.casa-logo img{height:100%; width:auto}
.casa h3{font-weight:var(--fw-air); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.casa p{font-size:var(--fs-sm); color:var(--text-2); max-width:52ch; line-height:1.65}
.casa blockquote{margin:auto 0 0; padding-top:var(--s-4); border-top:1px solid var(--border);
  font-weight:var(--fw-light); font-size:var(--fs-lead); color:var(--text)}
.casa blockquote small{display:block; margin-top:var(--s-2); font-family:var(--font-mono); font-size:var(--fs-micro);
  letter-spacing:.16em; text-transform:uppercase; color:var(--text-weak)}
.casa .papel{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent)}
@media (max-width:900px){ .casas{grid-template-columns:1fr} }

/* ---- sobre · os três ---- */
.time{position:relative}
.time-fotos{position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-3);
  align-items:end; padding-top:var(--s-6)}
.pessoa-foto{position:relative; display:grid; justify-items:center}
.pessoa-foto img{width:min(100%,300px); height:auto; position:relative; z-index:1;
  -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent); mask-image:linear-gradient(180deg,#000 72%,transparent)}
.pessoa-foto .selo{position:relative; z-index:2; margin-top:calc(var(--s-6) * -1); display:inline-flex; align-items:center; gap:var(--s-2);
  padding:6px 12px; border-radius:var(--r-selo); border:1px solid var(--border-strong);
  background:var(--surface-raised); font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-2)}
.pessoa-foto .selo i{width:7px; height:7px; border-radius:50%; flex:none}
.selo--move i{background:var(--brand-azul)}
.selo--bratecon i{background:var(--text-3)}
.uniao{display:grid; grid-template-columns:1fr 2fr; gap:var(--s-3); margin-top:var(--s-5)}
.uniao span{position:relative; padding-top:var(--s-4); text-align:center; font-family:var(--font-mono); font-size:var(--fs-micro);
  letter-spacing:.18em; text-transform:uppercase; color:var(--text-3)}
.uniao span::before{content:""; position:absolute; left:8%; right:8%; top:0; height:10px;
  border:1px solid var(--border-strong); border-top:0; border-radius:0 0 6px 6px}
.uniao .tudo{grid-column:1 / -1; color:var(--accent)}
.uniao .tudo::before{left:4%; right:4%; border-color:var(--accent-ring)}
.bios{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-6); margin-top:var(--s-8)}
.bio{display:grid; gap:var(--s-3); align-content:start; min-width:0}
.bio .t-label{color:var(--accent)}
.bio h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.bio h4{font-weight:var(--fw-med); font-size:var(--fs-ui); color:var(--text)}
.bio p{font-size:var(--fs-sm); color:var(--text-2); line-height:1.65}
.bio .tags{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-weak)}
@media (max-width:900px){
  .time-fotos{grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-1)}
  .pessoa-foto .selo{font-size:9px; padding:4px 8px; letter-spacing:.08em}
  .bios{grid-template-columns:1fr}
}

/* sobre · princípios da parceria e o "sem silos" */
.principios{list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-6); margin-bottom:var(--s-7);
  font-weight:var(--fw-light); font-size:clamp(20px,2vw,28px); letter-spacing:-.02em}
.principios li:nth-child(1){color:var(--accent)}
.principios li:nth-child(2){color:var(--text)}
.principios li:nth-child(3){color:var(--accent-good)}
.sem-silos{display:grid; gap:var(--s-3); margin-top:var(--s-7); padding:var(--s-6); border-left:2px solid var(--accent);
  background:linear-gradient(90deg, var(--accent-weak), transparent 70%); border-radius:0 var(--r-cartao) var(--r-cartao) 0}
.sem-silos p{font-weight:var(--fw-light); font-size:clamp(18px,1.6vw,23px); line-height:1.5; color:var(--text); max-width:60ch}
.time-nota{margin-top:var(--s-5); text-align:center; font-weight:var(--fw-light); font-size:var(--fs-lead); color:var(--text-2)}

/* ===================== sobre · as pessoas em vidro, sobre a rede ===================== */
.time-sec{position:relative; overflow:hidden; isolation:isolate; background:var(--bg-sunk); padding-block:var(--s-10)}
.time-nuvem{position:absolute; z-index:-2; width:min(1100px,120vw); left:50%; top:46%; translate:-50% -50%; opacity:.75;
  pointer-events:none; filter:saturate(1.1); animation:nuvem 26s var(--ease-io) infinite alternate}
@keyframes nuvem{0%{transform:rotate(-8deg) scale(1)}50%{transform:rotate(6deg) scale(1.12) translateX(4%)}100%{transform:rotate(14deg) scale(.96) translateX(-3%)}}
.time-rede{position:absolute; inset:0; z-index:-1; width:100%; height:100%; pointer-events:none}
.time-sec .sec-head{margin-bottom:var(--s-9)}
.pessoas{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-5); perspective:1400px}
.pessoa{position:relative; display:grid; grid-template-rows:auto 1fr; border-radius:var(--r-cartao-alto); margin-top:72px;
  background:linear-gradient(165deg, rgba(243,245,250,.08), rgba(243,245,250,.02) 40%, rgba(16,19,27,.35)),
    rgba(16,19,27,.42);
  backdrop-filter:blur(18px) saturate(1.2); -webkit-backdrop-filter:blur(18px) saturate(1.2);
  box-shadow:inset 0 1px 0 rgba(243,245,250,.10), 0 40px 90px -40px rgba(0,0,0,.9);
  transform-style:preserve-3d; transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform 500ms var(--ease), box-shadow var(--t-slow)}
/* a borda de vidro, com o roxo acendendo na ponta */
.pessoa::before{content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(150deg, #8E4FBE 0%, rgba(95,44,132,.55) 14%, rgba(243,245,250,.14) 34%, rgba(243,245,250,.04) 70%, rgba(21,171,216,.25) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude}
.pessoa-luz{position:absolute; left:-10%; top:-12%; width:70%; height:46%; border-radius:50%; pointer-events:none; z-index:0;
  background:radial-gradient(circle, rgba(142,79,190,.55), rgba(95,44,132,.18) 45%, transparent 70%); filter:blur(30px);
  opacity:.75; transition:opacity var(--t-slow)}
.pessoa:hover .pessoa-luz{opacity:1}
.pessoa:hover{box-shadow:inset 0 1px 0 rgba(243,245,250,.14), 0 50px 110px -40px rgba(95,44,132,.6)}
.pessoa-retrato{position:relative; z-index:1; height:340px; margin-top:-72px; display:flex; justify-content:center; align-items:flex-end;
  transform:translateZ(40px)}
.pessoa-retrato img{height:100%; width:auto; max-width:none;
  -webkit-mask-image:linear-gradient(180deg,#000 78%,transparent); mask-image:linear-gradient(180deg,#000 78%,transparent);
  filter:drop-shadow(0 24px 30px rgba(0,0,0,.55))}
.pessoa-info{position:relative; z-index:1; display:grid; gap:var(--s-2); align-content:start; padding:var(--s-5) var(--s-6) var(--s-6);
  border-top:1px solid rgba(243,245,250,.08); transform:translateZ(20px)}
.pessoa-info .selo{justify-self:start; display:inline-flex; align-items:center; gap:var(--s-2); padding:5px 11px; border-radius:var(--r-selo);
  border:1px solid var(--border-strong); background:rgba(10,12,18,.6); font-family:var(--font-mono); font-size:var(--fs-micro);
  letter-spacing:.14em; text-transform:uppercase; color:var(--text-2); margin-bottom:var(--s-2)}
.pessoa-info .selo i{width:7px; height:7px; border-radius:50%}
.pessoa-info h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.pessoa-cargo{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--accent)}
.pessoa-info h4{font-weight:var(--fw-med); font-size:var(--fs-ui); color:var(--text); margin-top:var(--s-3)}
.pessoa-info p{font-size:var(--fs-sm); line-height:1.65; color:var(--text-2)}
.pessoa-info .tags{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.14em; text-transform:uppercase; color:var(--text-weak); margin-top:var(--s-2)}
@media (max-width:1000px){
  .pessoas{grid-template-columns:1fr; gap:var(--s-9); max-width:520px; margin-inline:auto}
  .pessoa{transform:none}
}
@media (prefers-reduced-motion:reduce){ .time-nuvem{animation:none} .pessoa{transform:none} }

/* sobre · a chamada final com a lâmpada do site antigo */
.ideia{position:relative; overflow:hidden; background:var(--bg-sunk)}
.ideia-grade{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:var(--s-8); align-items:center}
.ideia-lampada{position:relative; justify-self:center; width:min(340px,70vw)}
.ideia-lampada img{position:relative; z-index:1; width:100%; height:auto; transform:rotate(-8deg);
  filter:brightness(var(--acende,.75)) drop-shadow(0 0 calc(var(--acende,0) * 40px) rgba(245,214,140,.35));
  transition:filter 1.2s var(--ease)}
.ideia-brilho{position:absolute; left:50%; top:40%; width:120%; aspect-ratio:1; translate:-50% -50%; border-radius:50%; z-index:0;
  background:radial-gradient(circle, rgba(255,214,150,.38), rgba(211,32,100,.16) 35%, rgba(95,44,132,.12) 55%, transparent 70%);
  opacity:var(--acende,0); filter:blur(20px); transition:opacity 1.2s var(--ease)}
.ideia.on{--acende:1}
.ideia-texto{display:grid; gap:var(--s-5); justify-items:start}
.ideia .contatos{display:flex; flex-wrap:wrap; gap:var(--s-5); font-family:var(--font-mono); font-size:var(--fs-sm); color:var(--text-3)}
@media (max-width:900px){ .ideia-grade{grid-template-columns:1fr; text-align:left} .ideia-lampada{width:min(240px,60vw)} }

/* =====================================================================
   HERO DAS SUBPÁGINAS · mesma família da home, sem prender o scroll
   ===================================================================== */
.topo{min-height:min(82svh,820px); display:flex; flex-direction:column; justify-content:center; padding-bottom:var(--s-6)}
.topo .wrap.topo-grade{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s-7); align-items:center; flex:1}
.topo-texto{display:grid; gap:var(--s-5); align-content:center}
.topo h1{max-width:13ch; font-weight:var(--fw-light); letter-spacing:-.045em}
.topo-visual{position:relative; height:min(520px,58svh); perspective:1400px}
.topo-visual [data-prof]{transition:translate 600ms var(--ease)}
.pagina-topo .wrap.topo-rodape,.topo-rodape{display:flex; align-items:center; justify-content:space-between; gap:var(--s-4); margin-top:var(--s-6);
  padding-top:var(--s-4); border-top:1px solid var(--border); position:relative; z-index:var(--z-raised);
  font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--text-3)}
.topo-rodape .cine-trilho{display:flex}
.topo-rodape .cine-trilho i{width:110px; height:2px; background:var(--border-strong); overflow:hidden}
.topo-rodape .cine-trilho b{display:block; height:100%; background:var(--grad-brand); transform-origin:left; transform:scaleX(0);
  animation:trilho 1.6s var(--ease) .5s forwards}
@keyframes trilho{to{transform:scaleX(1)}}

/* produtos · as quatro marcas em planos de vidro, em escada */
.pilha{position:absolute; inset:0; transform-style:preserve-3d}
.vidro-plano{position:absolute; width:min(300px,72%); height:150px; display:flex; flex-direction:column; justify-content:space-between;
  padding:var(--s-5) var(--s-5); border-radius:var(--r-cartao-alto);
  left:calc(var(--i) * 13%); top:calc(var(--i) * 21%); z-index:calc(4 - var(--i));
  background:linear-gradient(160deg, rgba(243,245,250,.09), rgba(243,245,250,.02)), rgba(16,19,27,.6);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(243,245,250,.1), 0 30px 70px -30px rgba(0,0,0,.9);
  transform:rotateY(-22deg) rotateX(8deg) translateZ(calc(var(--i) * -40px));
  animation:plano-entra 1s var(--ease) both; animation-delay:calc(.25s + var(--i) * .12s)}
.vidro-plano::before{content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(150deg, #8E4FBE, rgba(243,245,250,.14) 30%, rgba(243,245,250,.04) 70%, rgba(21,171,216,.3));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude}
.vidro-plano img{height:44px; width:auto; max-width:80%; object-fit:contain; object-position:left}
.vidro-plano span{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--text-3)}
.vidro-plano--breve img{opacity:.55}
.vidro-plano--breve span{color:var(--warn)}
@keyframes plano-entra{from{opacity:0; transform:rotateY(-40deg) rotateX(18deg) translateZ(-260px) translateY(40px)}}

/* agências · a tela do painel com os três setores ligados a ela */
.fios{position:absolute; inset:0; width:100%; height:100%; overflow:visible}
.fios path{fill:none; stroke:rgba(21,171,216,.5); stroke-width:1.2; stroke-dasharray:4 6;
  animation:fio 14s linear infinite}
@keyframes fio{to{stroke-dashoffset:-200}}
.tela{position:absolute; margin:0; z-index:1; left:12%; top:18%; width:78%; border-radius:var(--r-palco); overflow:hidden;
  border:1px solid var(--border-strong); box-shadow:0 50px 100px -40px rgba(0,0,0,.95), 0 0 0 1px rgba(142,79,190,.25), 0 0 80px -20px rgba(95,44,132,.45);
  transform:rotateY(-16deg) rotateX(6deg); animation:tela-entra 1.1s var(--ease) .2s both}
.tela img{display:block; width:100%; height:auto}
.tela-brilho{position:absolute; inset:0; background:linear-gradient(115deg, transparent 30%, rgba(243,245,250,.14) 45%, transparent 60%);
  transform:translateX(-100%); animation:brilho 6s var(--ease-io) 1.4s infinite}
@keyframes brilho{0%{transform:translateX(-100%)} 40%,100%{transform:translateX(100%)}}
@keyframes tela-entra{from{opacity:0; transform:rotateY(-36deg) rotateX(14deg) translateY(30px) scale(.94)}}
.setor{position:absolute; z-index:2; display:inline-flex; align-items:center; gap:var(--s-2); padding:10px 16px; border-radius:var(--r-pill);
  font-size:var(--fs-sm); color:var(--text); border:1px solid var(--border-strong);
  background:color-mix(in srgb, var(--surface-raised) 72%, transparent); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  box-shadow:var(--e-2); animation:sobeEntra .8s var(--ease) both}
.setor i{width:9px; height:9px; border-radius:2px}
.setor--a{left:2%; top:10%; animation-delay:.7s}
.setor--b{right:0; top:22%; animation-delay:.85s}
.setor--c{left:6%; bottom:6%; animation-delay:1s}
.base-uma{position:absolute; right:4%; bottom:6%; font-family:var(--font-mono); font-size:var(--fs-sm); letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-3); animation:sobeEntra .8s var(--ease) 1.15s both}
.base-uma b{font-weight:var(--fw-book); font-size:28px; color:var(--accent-good); margin-right:6px}

/* sobre · o símbolo em volume sobre a nuvem do site antigo */
.topo-nuvem{position:absolute; width:120%; left:50%; top:50%; translate:-50% -50%; opacity:.85; pointer-events:none;
  animation:nuvem 26s var(--ease-io) infinite alternate}
.topo-orbitas{position:absolute !important; display:block !important; inset:6% 10%; opacity:.7}
.topo-orbitas i{position:absolute; inset:0; border:1px solid var(--border); border-radius:50%}
.topo-orbitas i:nth-child(2){inset:14%}
.topo-orbitas i:nth-child(3){inset:-8%; border-style:dashed; border-color:rgba(243,245,250,.05)}
.topo-simbolo{position:absolute; left:21%; top:12%; width:min(300px,58%); height:auto;
  filter:drop-shadow(0 40px 50px rgba(0,0,0,.6)); animation:simbolo-entra 1.2s var(--ease) .2s both}
.topo-simbolo.flutua{animation:simbolo-entra 1.2s var(--ease) .2s both, flutua 7s var(--ease-io) 1.4s infinite}
@keyframes simbolo-entra{from{opacity:0; transform:scale(.7) rotate(-12deg)}}
.topo-data{position:absolute; right:2%; bottom:8%; display:grid; gap:2px; padding:12px 16px; border-radius:var(--r-md);
  font-size:var(--fs-sm); color:var(--text-2); border:1px solid var(--border-strong);
  background:color-mix(in srgb, var(--surface-raised) 72%, transparent); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  animation:sobeEntra .8s var(--ease) .9s both}
.topo-data b{font-family:var(--font-mono); font-weight:var(--fw-med); color:var(--accent-good)}

@media (max-width:900px){
  .topo{min-height:0}
  .topo .wrap.topo-grade{grid-template-columns:1fr; gap:var(--s-6)}
  .topo-visual{height:340px}
  .topo-rodape span:first-child,.topo-rodape span:last-child{display:none}
  .pagina-topo .wrap.topo-rodape{justify-content:center}
  .vidro-plano{height:118px; width:min(240px,70%)}
  .vidro-plano img{height:34px}
}
@media (prefers-reduced-motion:reduce){
  .vidro-plano,.tela,.setor,.base-uma,.topo-simbolo,.topo-data{animation:none !important}
  .fios path,.tela-brilho,.topo-nuvem{animation:none}
  .topo-rodape .cine-trilho b{animation:none; transform:none}
}

/* título das subpáginas no mesmo desenho da home: duas linhas, a segunda recua em cinza */
.topo-titulo{font-weight:var(--fw-light); font-size:clamp(38px,4vw,62px); line-height:.98; letter-spacing:-.045em}
.topo-titulo span{display:block; white-space:nowrap}
.topo-titulo span + span{color:rgba(243,245,250,.72)}
.topo-titulo b{font-family:var(--font-mono); font-weight:var(--fw-book); letter-spacing:-.06em; color:var(--accent-good)}
@media (max-width:600px){ .topo-titulo{font-size:clamp(34px,10vw,48px)} .topo-titulo span{white-space:normal} }

/* home · 03 · o que fica com quem */
.dono{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3)}
.dono-lado{display:grid; gap:var(--s-4); align-content:start; padding:var(--s-7) var(--s-6); border-radius:var(--r-cartao-alto);
  border:1px solid var(--border); background:var(--surface)}
.dono-lado--seu{border-color:color-mix(in srgb, var(--accent-good) 35%, transparent);
  background:linear-gradient(160deg, rgba(44,236,168,.07), transparent 55%), var(--surface)}
.dono-rotulo{display:inline-flex; align-items:center; gap:var(--s-2); font-family:var(--font-mono); font-size:var(--fs-micro);
  letter-spacing:.18em; text-transform:uppercase; color:var(--text-2)}
.dono-rotulo i{width:8px; height:8px; border-radius:50%; background:var(--accent)}
.dono-lado--seu .dono-rotulo{color:var(--accent-good)}
.dono-lado--seu .dono-rotulo i{background:var(--accent-good)}
.dono-lado h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2); max-width:22ch}
.dono-lado ul{list-style:none; padding:0; display:grid; gap:var(--s-3); margin-top:var(--s-2)}
.dono-lado li{display:flex; gap:var(--s-3); align-items:flex-start; font-size:var(--fs-body); line-height:1.55; color:var(--text-2)}
.dono-lado li svg{width:16px; height:16px; flex:none; margin-top:3px; color:var(--accent)}
.dono-lado--seu li svg{color:var(--accent-good)}
.dono-fim{margin-top:var(--s-7); font-weight:var(--fw-light); font-size:clamp(20px,1.8vw,26px); line-height:1.45; color:var(--text); max-width:52ch}
@media (max-width:900px){ .dono{grid-template-columns:1fr} .dono-lado{padding:var(--s-6) var(--s-5)} }

/* home · 03 · inteligência acumulada: o fluxo */
.acumulo .sec-head{max-width:820px}
.acumulo .topo-titulo{font-size:clamp(36px,4.4vw,68px)}
.fluxo{list-style:none; padding:0; display:grid; grid-template-columns:.7fr 1.15fr 1.15fr .7fr; gap:var(--s-6); position:relative; counter-reset:f}
.fluxo::before{content:""; position:absolute; left:4%; right:4%; top:46px; height:1px;
  background:linear-gradient(90deg, rgba(243,245,250,.12), var(--brand-azul) 30%, var(--brand-menta) 70%, rgba(243,245,250,.12))}
.fluxo::after{content:""; position:absolute; top:42px; left:4%; width:9px; height:9px; border-radius:50%; background:var(--text);
  box-shadow:0 0 14px 3px rgba(21,171,216,.7); animation:dado 5.5s var(--ease-io) infinite}
@keyframes dado{0%{left:4%; opacity:0} 8%{opacity:1} 92%{opacity:1} 100%{left:95%; opacity:0}}
.fluxo > li{position:relative; display:grid; gap:var(--s-3); align-content:start}
.fluxo-n{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--text-3)}
.fluxo-ponta{padding-top:var(--s-9)}
.fluxo-ponta::before{content:""; position:absolute; top:40px; left:0; width:13px; height:13px; border-radius:3px; transform:rotate(45deg);
  border:1px solid var(--border-strong); background:var(--bg)}
.fluxo-ponta--fim::before{background:var(--accent-good); border-color:var(--accent-good)}
.fluxo-ponta h3{font-weight:var(--fw-light); font-size:var(--fs-h3); letter-spacing:-.01em}
.fluxo-ponta p{font-size:var(--fs-sm); line-height:1.6; color:var(--text-2)}
.fluxo-etapa{padding:var(--s-6); border-radius:var(--r-cartao-alto); z-index:1;
  background:linear-gradient(165deg, color-mix(in srgb, var(--c) 10%, transparent), transparent 55%), var(--surface);
  border:1px solid color-mix(in srgb, var(--c) 40%, transparent); box-shadow:0 40px 80px -50px color-mix(in srgb, var(--c) 60%, transparent)}
.fluxo-topo{display:flex; align-items:center; justify-content:space-between; gap:var(--s-3)}
.fluxo-etapa .fluxo-n{width:38px; height:38px; display:grid; place-items:center; border-radius:50%; font-size:var(--fs-sm); letter-spacing:0;
  color:var(--text); border:1px solid var(--c); background:color-mix(in srgb, var(--c) 18%, var(--bg))}
.estado{font-family:var(--font-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; padding:5px 9px; border-radius:var(--r-selo);
  border:1px solid var(--border-strong); color:var(--text-2)}
.estado[data-estado="disponivel"]{color:var(--accent-good); border-color:color-mix(in srgb, var(--accent-good) 45%, transparent)}
.estado[data-estado="demonstracao"]{color:var(--warn); border-color:color-mix(in srgb, var(--warn) 45%, transparent)}
.fluxo-etapa h3{font-weight:var(--fw-light); font-size:clamp(24px,2vw,30px); letter-spacing:-.025em; margin-top:var(--s-2)}
.fluxo-etapa dl{display:grid; gap:var(--s-2); margin:0}
.fluxo-etapa dt{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--text-weak); margin-top:var(--s-2)}
.fluxo-etapa dd{margin:0; font-size:var(--fs-sm); line-height:1.6; color:var(--text-2)}
.fluxo-etapa dt:nth-of-type(2){color:var(--c)}
.fluxo-etapa dd:last-of-type{color:var(--text)}
.fluxo-etapa dd b{font-family:var(--font-mono); font-weight:var(--fw-med); color:var(--accent-good)}
.criterios{list-style:none; padding:var(--s-3); margin-top:var(--s-2); display:grid; gap:6px; border-radius:var(--r-md);
  background:rgba(7,8,13,.6); border:1px solid var(--border)}
.criterios li{display:flex; align-items:center; gap:var(--s-2); font-family:var(--font-mono); font-size:var(--fs-xs); color:var(--text-2)}
.criterios i{width:8px; height:8px; border-radius:50%}
.criterios i[data-s="ok"]{background:var(--ok)} .criterios i[data-s="at"]{background:var(--warn)} .criterios i[data-s="cr"]{background:var(--err)}
.criterios-nota{font-size:var(--fs-xs); color:var(--text-weak)}
.fronteira-nova{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-3); margin-top:var(--s-9)}
.fronteira-nova > div{display:grid; gap:var(--s-3); align-content:start; padding:var(--s-6); border-radius:var(--r-cartao-alto); border:1px solid var(--border); background:var(--surface)}
.fronteira-nova h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.fronteira-nova p{font-size:var(--fs-sm); line-height:1.65; color:var(--text-2); max-width:52ch}
.fronteira-sua{border-color:color-mix(in srgb, var(--accent-good) 35%, transparent) !important;
  background:linear-gradient(160deg, rgba(44,236,168,.07), transparent 55%), var(--surface) !important}
.fronteira-sua .dono-rotulo{color:var(--accent-good)} .fronteira-sua .dono-rotulo i{background:var(--accent-good)}
@media (max-width:1100px){
  .fluxo{grid-template-columns:1fr; gap:var(--s-4); padding-left:28px}
  .fluxo::before{left:6px; right:auto; top:0; bottom:0; width:1px; height:auto;
    background:linear-gradient(180deg, rgba(243,245,250,.12), var(--brand-azul) 25%, var(--brand-menta) 75%, rgba(243,245,250,.12))}
  .fluxo::after{display:none}
  .fluxo-ponta{padding-top:0}
  .fluxo-ponta::before{left:-28px; top:4px}
  .fronteira-nova{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){ .fluxo::after{display:none} }

/* home · 03 · o fluxo em uma linha, levando para a página de Agências */
.acumulo .fronteira-nova{margin-top:var(--s-5)}
.acumulo .fronteira-nova h3{font-size:var(--fs-h3); font-weight:var(--fw-book)}
.fluxo-mini{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:var(--s-5); padding:var(--s-5) var(--s-6);
  border-radius:var(--r-cartao-alto); border:1px solid var(--border-strong); background:var(--surface);
  transition:border-color var(--t-base), transform var(--t-base) var(--ease)}
.fluxo-mini:hover{border-color:var(--accent-ring); transform:translateY(-2px)}
.fluxo-mini-rotulo{font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--text-3)}
.fluxo-mini-trilho{display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-2) var(--s-3); font-size:var(--fs-sm); color:var(--text-2)}
.fluxo-mini-trilho i{width:22px; height:1px; background:var(--border-strong); position:relative}
.fluxo-mini-trilho i::after{content:""; position:absolute; right:0; top:-3px; border:3.5px solid transparent; border-left-color:var(--border-strong)}
.fluxo-mini-trilho b{font-weight:var(--fw-med); color:var(--text); padding:5px 10px; border-radius:var(--r-selo);
  border:1px solid color-mix(in srgb, var(--c) 50%, transparent); background:color-mix(in srgb, var(--c) 12%, transparent)}
.fluxo-mini-ir{display:inline-flex; align-items:center; gap:var(--s-2); font-size:var(--fs-ui); color:var(--accent); white-space:nowrap}
.fluxo-mini-ir svg{width:15px; height:15px}
@media (max-width:1000px){ .fluxo-mini{grid-template-columns:1fr; gap:var(--s-3)} }
/* agências · o fluxo completo dentro do degrau 02 */
.degrau .fluxo{margin-top:var(--s-4)}
.degrau .fluxo{grid-template-columns:repeat(2,minmax(0,1fr))}
.degrau .fluxo::before,.degrau .fluxo::after{display:none}
.degrau .fluxo-ponta{padding-top:0}
.degrau .fluxo-ponta::before{display:none}
.sub-degrau{display:grid; gap:var(--s-2); margin-top:var(--s-5); padding-top:var(--s-6); border-top:1px solid var(--border)}
.sub-degrau .t-label{color:var(--accent)}
.sub-degrau h3{font-weight:var(--fw-light); font-size:var(--fs-h2); letter-spacing:var(--tr-h2)}
.sub-degrau p{font-size:var(--fs-body); color:var(--text-2); max-width:60ch}
.degrau .fluxo .fluxo-ponta{padding:var(--s-5); border-radius:var(--r-cartao); border:1px dashed var(--border-strong)}
.degrau .fluxo{align-items:start}
.degrau .fluxo .fluxo-ponta{grid-column:1 / -1; display:grid; grid-template-columns:auto 1fr; column-gap:var(--s-5); row-gap:var(--s-1);
  align-items:baseline; padding:var(--s-4) var(--s-5)}
.degrau .fluxo .fluxo-ponta .fluxo-n{grid-row:1 / span 2}
.degrau .fluxo .fluxo-ponta--fim{border-style:solid; border-color:color-mix(in srgb, var(--accent-good) 40%, transparent)}
.degrau .fluxo .fluxo-ponta--fim .fluxo-n{color:var(--accent-good)}
@media (max-width:1100px){ .degrau .fluxo{grid-template-columns:1fr; padding-left:0} .degrau .fluxo .fluxo-ponta{grid-template-columns:1fr} .degrau .fluxo .fluxo-ponta .fluxo-n{grid-row:auto} }

/* =====================================================================
   AGÊNCIAS · prévia animada do Mdesk validando uma pasta
   Cores do próprio Mdesk dentro da janela (azul #2563EB sobre noite),
   e a voz da Move em volta dela.
   ===================================================================== */
.demo-mdesk{--md-azul:#3B82F6; --md-azul-f:#2563EB; --md-noite:#0B1222; --md-sup:#111A2E; --md-borda:rgba(148,178,255,.14);
  display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,.75fr); gap:var(--s-7); align-items:start; margin-top:var(--s-6)}
.dm-janela{position:relative; margin:0; border-radius:18px; overflow:hidden; background:var(--md-noite); border:1px solid var(--md-borda);
  box-shadow:0 60px 120px -50px rgba(37,99,235,.45), 0 30px 60px -30px rgba(0,0,0,.9)}
.dm-barra{display:flex; align-items:center; gap:var(--s-4); padding:12px 16px; border-bottom:1px solid var(--md-borda); background:#0A1020}
.dm-luzes{display:flex; gap:6px} .dm-luzes i{width:9px; height:9px; border-radius:50%; background:rgba(148,178,255,.18)}
.dm-barra img{height:18px; width:auto}
.dm-trilha{font-size:12px; color:#8EA3C8} .dm-trilha i{font-style:normal; opacity:.5; margin-inline:4px} .dm-trilha b{color:#E6EDFB; font-weight:500}
.dm-estado{margin-left:auto; font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; padding:5px 10px;
  border-radius:999px; border:1px solid var(--md-borda); color:#8EA3C8; transition:all .4s}
.dm-estado[data-estado="lendo"],.dm-estado[data-estado="conferindo"]{color:var(--md-azul); border-color:rgba(59,130,246,.5)}
.dm-estado[data-estado="validado"]{color:var(--ok); border-color:color-mix(in srgb, var(--ok) 55%, transparent); background:var(--ok-bg)}
.dm-corpo{display:grid; grid-template-columns:200px 1fr; min-height:420px}
.dm-lado{position:relative; padding:var(--s-5) var(--s-4); border-right:1px solid var(--md-borda); background:#0A1020}
.dm-rotulo{display:block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:#6F84AB; margin-bottom:var(--s-3)}
.dm-pasta{list-style:none; padding:0; display:grid; gap:6px}
.dm-pasta li{display:flex; align-items:center; gap:8px; font-size:12px; color:#C9D5EE; padding:7px 9px; border-radius:8px;
  border:1px solid transparent; opacity:0; transform:translateY(8px); transition:opacity .4s, transform .4s var(--ease), background .3s, border-color .3s}
.dm-pasta li svg{width:14px; height:14px; color:#6F84AB; flex:none}
.dm-pasta li.on{opacity:1; transform:none}
.dm-pasta li.lendo{background:rgba(59,130,246,.12); border-color:rgba(59,130,246,.35)}
.dm-pasta li.lendo svg{color:var(--md-azul)}
.dm-pasta li.ok svg{color:var(--ok)}
.dm-meio{display:grid; grid-template-columns:1fr 1.15fr; gap:var(--s-4); padding:var(--s-5)}
.dm-card{position:relative; padding:var(--s-4); border-radius:12px; background:var(--md-sup); border:1px solid var(--md-borda); transition:border-color .4s, box-shadow .4s}
.dm-card.ativo{border-color:rgba(59,130,246,.55); box-shadow:0 0 0 3px rgba(59,130,246,.12)}
.dm-leitura dl{display:grid; grid-template-columns:auto 1fr; gap:8px 12px; margin:0 0 var(--s-4); font-size:12px}
.dm-leitura dt{color:#6F84AB}
.dm-leitura dd{margin:0; color:#E6EDFB; font-family:var(--font-mono); min-height:1.2em; border-bottom:1px dashed rgba(148,178,255,.18)}
.dm-leitura dd.cursor::after{content:"▌"; color:var(--md-azul); animation:pulse .9s infinite}
.dm-planilha{position:relative; display:flex; align-items:center; gap:8px; padding:10px; border-radius:8px; font-size:12px; color:#8EA3C8;
  border:1px dashed var(--md-borda); transition:all .4s}
.dm-planilha svg{width:16px; height:16px; flex:none}
.dm-planilha b{margin-left:auto; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; opacity:0; transition:opacity .4s}
.dm-planilha.on{border-style:solid; border-color:color-mix(in srgb, var(--ok) 50%, transparent); background:var(--ok-bg); color:#E6EDFB}
.dm-planilha.on svg,.dm-planilha.on b{color:var(--ok); opacity:1}
.dm-crit{list-style:none; padding:0; display:grid; gap:6px}
.dm-crit li{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:8px 10px; border-radius:8px;
  border:1px solid var(--md-borda); background:rgba(10,16,32,.6); transition:background .35s, border-color .35s}
.cr-ic{width:18px; height:18px; border-radius:50%; border:1.5px solid rgba(148,178,255,.25); display:grid; place-items:center; font-size:11px; font-weight:700}
.cr-txt{display:grid; gap:1px; min-width:0} .cr-txt b{font-size:12px; font-weight:500; color:#E6EDFB}
.cr-txt small{font-size:10.5px; color:#6F84AB; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.cr-st{font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:#6F84AB; padding:3px 7px; border-radius:999px; border:1px solid var(--md-borda)}
.dm-crit li.conferindo{border-color:rgba(59,130,246,.5)} .dm-crit li.conferindo .cr-ic{border-color:var(--md-azul); border-top-color:transparent; animation:spin .7s linear infinite}
.dm-crit li.conferindo .cr-st{color:var(--md-azul); border-color:rgba(59,130,246,.5)}
.dm-crit li.ok{background:rgba(44,236,168,.06); border-color:rgba(44,236,168,.3)}
.dm-crit li.ok .cr-ic{background:var(--ok); border-color:var(--ok); color:#06281c} .dm-crit li.ok .cr-ic::after{content:"✓"}
.dm-crit li.ok .cr-st{color:var(--ok); border-color:rgba(44,236,168,.4)}
.dm-crit li.alerta{background:rgba(245,165,36,.08); border-color:rgba(245,165,36,.45)}
.dm-crit li.alerta .cr-ic{background:var(--warn); border-color:var(--warn); color:#2a1a00} .dm-crit li.alerta .cr-ic::after{content:"!"}
.dm-crit li.alerta .cr-st{color:var(--warn); border-color:rgba(245,165,36,.5)} .dm-crit li.alerta small{color:var(--warn)}
.dm-resultado{position:relative; display:grid; grid-template-columns:repeat(3,auto) 1fr; align-items:center; gap:var(--s-5);
  padding:var(--s-4) var(--s-5); border-top:1px solid var(--md-borda); background:#0A1020}
.dm-cont{display:grid; gap:0} .dm-cont b{font-family:var(--font-mono); font-size:22px; font-weight:500; line-height:1}
.dm-cont small{font-size:10.5px; color:#6F84AB} .c-ok{color:var(--ok)} .c-at{color:var(--warn)} .c-cr{color:var(--err)}
.dm-final{justify-self:end; display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; font-size:13px; font-weight:500;
  color:#06281c; background:var(--ok); opacity:0; transform:scale(.92); transition:opacity .5s, transform .5s var(--spring)}
.dm-final svg{width:16px; height:16px}
.dm-resultado.on .dm-final{opacity:1; transform:none}
.dm-prog{position:absolute; left:0; right:0; bottom:0; height:2px; background:rgba(148,178,255,.08)}
.dm-prog i{display:block; height:100%; width:0; background:linear-gradient(90deg, var(--md-azul-f), var(--ok)); transition:width .6s var(--ease)}
.dm-janela figcaption{position:absolute; right:14px; bottom:-26px; font-size:11px; color:var(--text-weak)}
/* os números que ligam a tela à lista ao lado */
.dm-marca{position:absolute; top:-10px; right:-10px; z-index:3; width:24px; height:24px; border-radius:50%; display:grid; place-items:center;
  font-family:var(--font-mono); font-size:10px; color:var(--text-2); background:var(--bg); border:1px solid var(--border-strong); transition:all .35s}
.dm-lado > .dm-marca{top:10px; right:10px}
.dm-resultado > .dm-marca{top:-12px; left:20px; right:auto}
.dm-marca.ativa{color:var(--bg); background:var(--text); border-color:var(--text); box-shadow:0 0 0 5px rgba(243,245,250,.12)}
/* a lista técnica, no estilo de ficha */
.dm-spec{list-style:none; padding:0; border-top:1px solid var(--text)}
.dm-spec li{display:grid; grid-template-columns:28px 1fr auto; column-gap:var(--s-3); row-gap:4px; padding:var(--s-4) 0; border-bottom:1px solid var(--border);
  opacity:.45; transition:opacity .4s}
.dm-spec li.ativa{opacity:1}
.sp-n{font-family:var(--font-mono); font-size:11px; color:var(--text-3); padding-top:3px}
.sp-t{font-family:var(--font-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--text); padding-top:3px}
.sp-v{font-weight:var(--fw-med); font-size:var(--fs-lead); color:var(--text); font-variant-numeric:tabular-nums}
.dm-spec li.ativa .sp-v{color:var(--accent-good)}
.dm-spec p{grid-column:2 / -1; font-size:var(--fs-sm); line-height:1.55; color:var(--text-2)}
.dm-fecho{margin-top:var(--s-8); font-weight:var(--fw-light); font-size:clamp(20px,1.8vw,26px); line-height:1.45; max-width:58ch}
.dm-acoes{margin-top:var(--s-5)}
@media (max-width:1100px){ .demo-mdesk{grid-template-columns:1fr} }
@media (max-width:760px){
  .dm-corpo{grid-template-columns:1fr} .dm-lado{border-right:0; border-bottom:1px solid var(--md-borda)}
  .dm-pasta{grid-template-columns:1fr 1fr} .dm-meio{grid-template-columns:1fr; padding:var(--s-4)}
  .dm-resultado{grid-template-columns:repeat(3,auto); row-gap:var(--s-3)} .dm-final{grid-column:1 / -1; justify-self:start}
  .dm-trilha{display:none}
}
/* ajuste de respiro: a janela ganha largura e os rótulos param de quebrar */
.demo-mdesk{grid-template-columns:minmax(0,1fr) 290px; gap:var(--s-6)}
.dm-corpo{grid-template-columns:172px 1fr}
.dm-meio{grid-template-columns:.85fr 1.15fr; gap:var(--s-3); padding:var(--s-4)}
.dm-leitura dl{grid-template-columns:1fr; gap:2px}
.dm-leitura dt{font-size:10.5px; margin-top:6px}
.dm-crit li{gap:8px; padding:7px 9px}
.cr-txt b{font-size:11.5px; line-height:1.3}
.cr-st{font-size:8.5px; padding:3px 6px; letter-spacing:.06em}
.dm-spec p{font-size:13px}
@media (max-width:1100px){ .demo-mdesk{grid-template-columns:1fr} }
@media (max-width:760px){ .dm-corpo{grid-template-columns:1fr} .dm-meio{grid-template-columns:1fr} }
.dm-corpo{grid-template-columns:186px 1fr}
.dm-pasta li{font-size:11.5px; white-space:nowrap} .dm-pasta li span{overflow:hidden; text-overflow:ellipsis}
@media (max-width:760px){ .dm-corpo{grid-template-columns:1fr} .dm-pasta li{white-space:normal} }

/* =====================================================================
   HOME · 03 inteligência acumulada: a regra sobe, o dado fica
   ===================================================================== */
.acum{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:var(--s-7); align-items:center; margin-top:var(--s-6)}
.acum-palco{margin:0; padding:var(--s-4); border-radius:20px; border:1px solid var(--border);
  background:radial-gradient(60% 60% at 50% 50%, rgba(21,171,216,.08), transparent 70%), rgba(255,255,255,.015)}
.acum-palco svg{display:block; width:100%; height:auto; overflow:visible}
.ac-fios line{stroke:rgba(243,245,250,.12); stroke-width:1; stroke-dasharray:3 5}
.ac-fios .ac-fio-d{transition:opacity .6s} .acum:not(.d-on) .ac-fio-d{opacity:0}
.ac-caixa{fill:#10141f; stroke:rgba(243,245,250,.14); stroke-width:1; transition:stroke .4s, fill .4s}
.ac-nome{fill:var(--text); font:500 14px var(--font-ui)}
.ac-sub{fill:var(--text-3); font:400 10.5px var(--font-ui)}
.ac-dados rect{fill:rgba(243,245,250,.22); transition:fill .4s}
.ac-inst.fica .ac-dados rect{fill:rgba(243,245,250,.55)}
.ac-pips circle{fill:var(--brand-azul); transition:transform .4s var(--spring)}
.ac-pips circle.novo{fill:var(--brand-menta)}
.ac-alerta{opacity:0; transition:opacity .3s} .ac-alerta circle{fill:var(--warn)}
.ac-alerta text{fill:#2a1a00; font:700 13px var(--font-ui); text-anchor:middle}
.ac-inst.alerta .ac-alerta{opacity:1} .ac-inst.alerta .ac-caixa{stroke:var(--warn)}
.ac-inst.ok .ac-caixa{stroke:color-mix(in srgb, var(--brand-menta) 60%, transparent)}
.ac-nova{opacity:0; transition:opacity .7s, transform .7s var(--ease)} .acum.d-on .ac-nova{opacity:1}
.ac-nova .ac-caixa{stroke-dasharray:4 4}
.ac-miolo{fill:#0d1424; stroke:var(--brand-azul); stroke-width:1.5; transition:stroke .4s}
.ac-nucleo.pulsa .ac-miolo{stroke:var(--brand-menta)}
.ac-n-rot{fill:var(--text); font:500 15px var(--font-ui); text-anchor:middle}
.ac-n-cont{fill:var(--brand-azul); font:500 11px var(--font-mono); letter-spacing:.06em; text-anchor:middle}
.ac-nucleo.pulsa .ac-n-cont{fill:var(--brand-menta)}
.ac-aneis circle{fill:none; stroke:var(--brand-azul); stroke-opacity:.35; stroke-width:1.2; stroke-dasharray:14 6}
.ac-aneis circle.novo{stroke:var(--brand-menta); stroke-opacity:.9; animation:acAnel .8s var(--spring) both}
@keyframes acAnel{from{transform:scale(.6); opacity:0} to{transform:none; opacity:1}}
.ac-token{fill:var(--brand-azul); opacity:0; filter:drop-shadow(0 0 6px var(--brand-azul))}
.ac-ecos circle{fill:var(--brand-menta); filter:drop-shadow(0 0 6px var(--brand-menta))}
.acum-passos{list-style:none; padding:0; border-top:1px solid var(--border)}
.acum-passos li{display:grid; grid-template-columns:34px 1fr; gap:var(--s-3); padding:var(--s-4) 0; border-bottom:1px solid var(--border); opacity:.4; transition:opacity .4s}
.acum-passos li.on{opacity:1}
.acum-passos span{font-family:var(--font-mono); font-size:11px; color:var(--text-3); padding-top:4px}
.acum-passos li.on span{color:var(--brand-menta)}
.acum-passos p{font-size:var(--fs-body,16px); line-height:1.5; color:var(--text)}
.acum-legenda{display:grid; gap:var(--s-3); margin-top:var(--s-5); font-size:13px; line-height:1.5; color:var(--text-2)}
.acum-legenda span{display:grid; grid-template-columns:auto 1fr; column-gap:10px} .acum-legenda b{color:var(--text); font-weight:500; margin-right:6px}
.acum-legenda span{display:block; padding-left:20px; position:relative}
.acum-legenda i{position:absolute; left:0; top:5px; width:10px; height:10px}
.lg-regra{border-radius:50%; background:var(--brand-azul)} .lg-dado{border-radius:2px; background:rgba(243,245,250,.55)}
.acum-link{display:inline-flex; align-items:center; gap:8px; margin-top:var(--s-5); color:var(--brand-azul); font-size:15px}
.acum-link svg{width:16px; height:16px; transition:transform .3s var(--ease)} .acum-link:hover svg{transform:translateX(4px)}
@media (max-width:980px){ .acum{grid-template-columns:1fr} }
.ac-leg{fill:var(--text-3); font:400 9.5px var(--font-mono); letter-spacing:.08em; text-transform:uppercase}
.ac-inst.fica .ac-leg-d{fill:var(--text)}
.ac-inst.fica .ac-caixa{fill:#141a28}

/* =====================================================================
   HOME · 06 para quem: a dor puxa a tecnologia, que converge no segmento
   ===================================================================== */
.conv{position:relative; display:grid; grid-template-columns:1.15fr .9fr .8fr; gap:clamp(40px,6vw,96px); margin-top:var(--s-7)}
.conv-fios{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible}
.conv-fios path{fill:none; stroke:rgba(243,245,250,.07); stroke-width:1; transition:stroke .45s, stroke-width .45s}
.conv-fios path.on{stroke:var(--brand-azul); stroke-width:1.5}
.conv-fios path.on.fim{stroke:var(--brand-menta)}
.conv-col{position:relative; z-index:1; display:grid; gap:var(--s-3); align-content:center}
.conv-rot{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--text-3); margin-bottom:var(--s-2)}
.conv-dor{all:unset; box-sizing:border-box; cursor:pointer; display:grid; grid-template-columns:28px 1fr; gap:8px; padding:var(--s-4); border-radius:14px;
  border:1px solid var(--border); background:#0e121b; color:var(--text-2); font-size:15px; line-height:1.45; transition:all .4s}
.conv-dor span{font-family:var(--font-mono); font-size:11px; color:var(--text-3); padding-top:3px}
.conv-dor:hover,.conv-dor:focus-visible{border-color:var(--border-strong)}
.conv-dor.on{color:var(--text); border-color:color-mix(in srgb, var(--warn) 55%, transparent); background:rgba(245,165,36,.06)}
.conv-dor.on span{color:var(--warn)}
.conv-tech{padding:var(--s-3) var(--s-4); border-radius:999px; border:1px solid var(--border); background:#0e121b; display:grid; transition:all .4s}
.conv-tech b{font-weight:500; font-size:15px; color:var(--text-2)} .conv-tech small{font-size:12px; color:var(--text-3); max-height:0; overflow:hidden; opacity:0; transition:all .4s}
.conv-tech.on{border-color:var(--brand-azul); background:rgba(21,171,216,.08); border-radius:16px}
.conv-tech.on b{color:var(--text)} .conv-tech.on small{max-height:40px; opacity:1; margin-top:2px}
.conv-seg{padding:var(--s-4); border-radius:14px; border:1px solid var(--border); background:#0e121b; display:grid; gap:2px; transition:all .4s}
.conv-seg small{font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3)}
.conv-seg b{font-weight:500; font-size:18px; color:var(--text-2)}
.conv-seg.on{border-color:var(--brand-menta); background:rgba(44,236,168,.07); box-shadow:0 0 0 4px rgba(44,236,168,.07)}
.conv-seg.on b{color:var(--text)} .conv-seg.on small{color:var(--brand-menta)}
.conv-acoes{display:flex; flex-wrap:wrap; gap:var(--s-4) var(--s-7); margin-top:var(--s-7)}
.conv-acoes .ir{display:inline-flex; align-items:center; gap:8px; color:var(--brand-azul); font-size:15px}
.conv-acoes .ir svg{width:16px; height:16px}
@media (max-width:900px){
  .conv{grid-template-columns:1fr; gap:var(--s-6)} .conv-fios{display:none}
  .conv-techs{grid-template-columns:1fr 1fr} .conv-techs .conv-rot,.conv-segs .conv-rot{grid-column:1/-1}
  .conv-segs{grid-template-columns:1fr 1fr}
  .conv-tech{border-radius:14px}
}
/* altura fixa nas tecnologias: os fios não se desalinham quando uma acende */
.conv-tech{border-radius:16px; gap:2px}
.conv-tech small,.conv-tech.on small{max-height:none; opacity:1; margin:0; color:var(--text-3); line-height:1.4}
.conv-tech.on small{color:var(--text-2)}

/* =====================================================================
   CASE · página de cliente (dor, solução, resultado, perguntas)
   ===================================================================== */
.case-ficha{align-self:center; justify-self:end; width:min(100%,420px); padding:var(--s-5) var(--s-6); border-radius:18px;
  border:1px solid var(--border); background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.01)); backdrop-filter:blur(12px)}
.case-ficha dl{display:grid; grid-template-columns:auto 1fr; gap:0 var(--s-4); margin:0}
.case-ficha dt,.case-ficha dd{padding:12px 0; border-bottom:1px solid var(--border); margin:0}
.case-ficha dt{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); padding-top:15px}
.case-ficha dd{font-size:15px; color:var(--text)}
.case-ficha dt:last-of-type,.case-ficha dd:last-of-type{border-bottom:0}
.case-bloco{padding-block:clamp(64px,10vh,120px)}
.case-bloco + .case-bloco{border-top:1px solid var(--border)}
.case-grade{display:grid; grid-template-columns:160px minmax(0,1fr); gap:var(--s-7)}
.case-grade > div:last-child{max-width:860px}
.case-n{font-weight:var(--fw-light,200); font-size:56px; line-height:1; color:var(--text); position:sticky; top:110px; align-self:start}
.case-n small{display:block; margin-top:10px; font-family:var(--font-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--accent-good)}
.case-bloco h2{font-weight:var(--fw-light,300); font-size:clamp(30px,3.6vw,48px); line-height:1.1; letter-spacing:-.02em; margin-bottom:var(--s-5)}
.case-voz{font-size:clamp(20px,1.9vw,26px); font-weight:300; line-height:1.5; color:var(--text); padding-left:var(--s-5); border-left:2px solid var(--brand-magenta); margin-bottom:var(--s-6)}
.case-custos,.case-lista{list-style:none; padding:0; border-top:1px solid var(--border)}
.case-custos li,.case-lista li{padding:var(--s-4) 0; border-bottom:1px solid var(--border); color:var(--text-2); line-height:1.55}
.case-custos b,.case-lista b{color:var(--text); font-weight:500}
.case-sub{margin:var(--s-7) 0 var(--s-3); font-family:var(--font-mono); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--brand-azul); font-weight:400}
.esteira{list-style:none; padding:0; margin:var(--s-5) 0; display:grid; grid-template-columns:repeat(7,1fr); gap:6px; counter-reset:e}
.esteira li{position:relative; padding:14px 12px; border-radius:12px; border:1px solid var(--border); background:#0e121b; transition:all .4s; counter-increment:e}
.esteira li::before{content:"0" counter(e); display:block; font-family:var(--font-mono); font-size:10px; color:var(--text-3); margin-bottom:8px}
.esteira b{display:block; font-weight:500; font-size:14px; color:var(--text-2)}
.esteira small{display:block; font-size:11.5px; font-weight:400; color:var(--text-3); margin-top:3px; line-height:1.35}
.esteira li.on{border-color:var(--brand-azul); background:rgba(21,171,216,.08)} .esteira li.on b{color:var(--text)}
.esteira li.feito{border-color:color-mix(in srgb, var(--brand-menta) 45%, transparent)} .esteira li.feito::before{color:var(--brand-menta)}
.esteira li:last-child.on,.esteira li:last-child.feito{border-color:var(--brand-menta); background:rgba(44,236,168,.08)}
.case-sistemas{display:grid; grid-template-columns:1fr 1fr; gap:var(--s-4)}
.case-sistemas article{padding:var(--s-5); border-radius:16px; border:1px solid var(--border); background:#0e121b}
.case-sistemas h4{font-weight:500; font-size:19px; line-height:1.3; margin:var(--s-2) 0 var(--s-3); color:var(--text)}
.case-sistemas p{font-size:14.5px; line-height:1.6; color:var(--text-2)}
.case-numeros{display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--text)}
.case-numeros > div{display:grid; gap:6px; padding:var(--s-5) var(--s-5) var(--s-5) 0; border-bottom:1px solid var(--border)}
.case-numeros > div:nth-child(odd){border-right:1px solid var(--border)} .case-numeros > div:nth-child(even){padding-left:var(--s-5)}
.case-numeros b{font-weight:200; font-size:clamp(44px,5vw,68px); line-height:1; color:var(--accent-good); font-variant-numeric:tabular-nums}
.case-numeros span{font-size:15px; color:var(--text); line-height:1.45}
.case-numeros small{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; color:var(--text-3)}
.case-destaque{margin:var(--s-6) 0; padding:var(--s-5) var(--s-6); border-radius:16px; border:1px solid color-mix(in srgb, var(--brand-menta) 40%, transparent); background:rgba(44,236,168,.05)}
.case-destaque p{margin-top:var(--s-2); font-size:17px; line-height:1.55; color:var(--text)}
.case-datas{list-style:none; padding:0; border-left:1px solid var(--border); margin-top:var(--s-6)}
.case-datas li{position:relative; display:grid; grid-template-columns:72px 1fr; gap:var(--s-4); padding:10px 0 10px var(--s-5); color:var(--text-2); font-size:15px}
.case-datas li::before{content:""; position:absolute; left:-4px; top:17px; width:7px; height:7px; border-radius:50%; background:var(--brand-azul)}
.case-datas span{font-family:var(--font-mono); font-size:11.5px; color:var(--brand-azul); padding-top:2px}
.faq{border-top:1px solid var(--border)}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item summary{list-style:none; cursor:pointer; padding:var(--s-5) 40px var(--s-5) 0; position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+"; position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:22px; font-weight:200; color:var(--text-2); transition:transform .3s}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq-item h3{font-weight:400; font-size:clamp(17px,1.5vw,20px); line-height:1.4; color:var(--text); margin:0}
.faq-item p{padding:0 0 var(--s-5); max-width:70ch; font-size:15.5px; line-height:1.65; color:var(--text-2)}
@media (max-width:980px){ .esteira{grid-template-columns:repeat(4,1fr)} }
@media (max-width:860px){
  .case-grade{grid-template-columns:1fr; gap:var(--s-4)} .case-n{position:static; font-size:40px}
  .case-sistemas,.case-numeros{grid-template-columns:1fr}
  .case-numeros > div:nth-child(odd){border-right:0} .case-numeros > div:nth-child(even){padding-left:0}
  .case-ficha{justify-self:stretch}
}
@media (max-width:560px){ .esteira{grid-template-columns:1fr 1fr} .case-datas li{grid-template-columns:1fr; gap:2px} }
.case-link{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:var(--s-5); margin-top:var(--s-5); padding:var(--s-5) var(--s-6);
  border-radius:16px; border:1px solid color-mix(in srgb, var(--brand-menta) 35%, transparent); background:rgba(44,236,168,.04); transition:border-color .3s, background .3s}
.case-link b{font-weight:400; font-size:clamp(17px,1.5vw,21px); color:var(--text)}
.case-link .ir{display:inline-flex; align-items:center; gap:8px; color:var(--brand-menta); font-size:15px}
.case-link .ir svg{width:16px; height:16px; transition:transform .3s var(--ease)}
.case-link:hover{border-color:var(--brand-menta); background:rgba(44,236,168,.07)} .case-link:hover .ir svg{transform:translateX(4px)}
@media (max-width:760px){ .case-link{grid-template-columns:1fr; gap:var(--s-2)} }
.case-nota{margin-top:var(--s-5); font-family:var(--font-mono); font-size:11.5px; letter-spacing:.06em; color:var(--text-3)}

/* =====================================================================
   HOME · 04 clientes: faixa de marcas em movimento e um card por case
   As marcas entram como texto até chegarem os arquivos: troca-se o
   <span class="marca-txt"> por <img> sem mexer no resto.
   ===================================================================== */
.marcas{position:relative; display:flex; overflow:hidden; margin:var(--s-7) 0 var(--s-6); padding-block:var(--s-5);
  border-block:1px solid var(--border);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent)}
.marcas-trilho{list-style:none; margin:0; padding:0; display:flex; flex:none; align-items:center; gap:clamp(48px,6vw,96px); padding-right:clamp(48px,6vw,96px);
  animation:marcasAnda 45s linear infinite}
.marcas:hover .marcas-trilho{animation-play-state:paused}
@keyframes marcasAnda{to{transform:translateX(-100%)}}
.marcas li{flex:none; display:flex; align-items:center; height:48px; opacity:.55; filter:grayscale(1); transition:opacity .3s, filter .3s}
.marcas li:hover{opacity:1; filter:none}
.marcas img{height:36px; width:auto; display:block}
.marca-txt{font-weight:600; font-size:clamp(20px,2vw,26px); letter-spacing:-.02em; color:var(--text); white-space:nowrap}
.clientes-cases{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-4)}
.cliente-case{display:flex; flex-direction:column; gap:var(--s-2); padding:var(--s-6) var(--s-5); border-radius:18px; border:1px solid var(--border);
  background:linear-gradient(170deg, rgba(255,255,255,.035), rgba(255,255,255,.008)); transition:border-color .3s, transform .3s var(--ease)}
.cliente-case:hover{border-color:var(--border-strong); transform:translateY(-3px)}
.cc-marca{font-size:22px; margin-bottom:var(--s-3)} .cc-marca img{height:32px; width:auto}
.cc-setor{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--brand-azul)}
.cliente-case h3{font-weight:300; font-size:clamp(21px,1.8vw,26px); line-height:1.2; letter-spacing:-.01em; color:var(--text); margin:var(--s-2) 0}
.cliente-case p{font-size:14.5px; line-height:1.6; color:var(--text-2); flex:1}
.cc-ir{display:inline-flex; align-items:center; gap:8px; margin-top:var(--s-4); color:var(--brand-menta); font-size:15px}
.cc-ir svg{width:16px; height:16px; transition:transform .3s var(--ease)} .cc-ir:hover svg{transform:translateX(4px)}
.cc-breve{margin-top:var(--s-4); font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3)}
@media (max-width:980px){ .clientes-cases{grid-template-columns:1fr 1fr} }
@media (max-width:640px){ .clientes-cases{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){
  .marcas{-webkit-mask-image:none; mask-image:none} .marcas-trilho{animation:none; flex-wrap:wrap; justify-content:center; flex:1}
  .marcas-trilho[aria-hidden]{display:none}
}
.case-faixa{border-block:1px solid var(--border); background:rgba(255,255,255,.015)}
.case-faixa dl{display:grid; grid-template-columns:repeat(5,1fr); gap:0; margin:0 auto}
.case-faixa dl > div{padding:var(--s-5) var(--s-4) var(--s-5) 0; border-right:1px solid var(--border)}
.case-faixa dl > div + div{padding-left:var(--s-4)} .case-faixa dl > div:last-child{border-right:0}
.case-faixa dt{font-family:var(--font-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-3); margin-bottom:6px}
.case-faixa dd{margin:0; font-size:14.5px; line-height:1.45; color:var(--text)}
@media (max-width:980px){ .case-faixa dl{grid-template-columns:1fr 1fr} .case-faixa dl > div{border-right:0; border-bottom:1px solid var(--border); padding-left:0 !important} }
@media (max-width:560px){ .case-faixa dl{grid-template-columns:1fr} }
.pagina-topo.topo--case .topo-titulo{font-size:clamp(34px,3.3vw,48px)} .topo--case .topo-texto{position:relative; z-index:2}

/* =====================================================================
   AGÊNCIAS · 00 entender: conta pública e conta privada
   ===================================================================== */
.contas{margin-top:var(--s-6)}
.contas-abas{display:inline-flex; padding:4px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.02); margin-bottom:var(--s-5)}
.contas-abas button{all:unset; cursor:pointer; padding:10px 20px; border-radius:999px; font-size:14.5px; color:var(--text-2); transition:all .3s}
.contas-abas button[aria-selected="true"]{background:var(--text); color:var(--bg)}
.contas-abas button:focus-visible{outline:2px solid var(--brand-azul); outline-offset:2px}
.contas-grade{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:var(--s-6); align-items:start}
.contas [data-modo]:not(button):not(.contas){display:none}
.contas[data-modo="publica"] [data-modo="publica"]:not(button),.contas[data-modo="privada"] [data-modo="privada"]:not(button){display:revert}
.contas-rot{display:block; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-3); margin-bottom:var(--s-3)}
.contas-fluxo ol{list-style:none; padding:0; margin:0; counter-reset:f; border-left:1px solid var(--border)}
.contas-fluxo li{position:relative; counter-increment:f; padding:10px 0 10px var(--s-5); font-size:15.5px; color:var(--text); animation:contaEntra .5s var(--ease) both}
.contas-fluxo li::before{content:"0" counter(f); position:absolute; left:-15px; top:9px; width:28px; height:22px; border-radius:6px; display:grid; place-items:center;
  font-family:var(--font-mono); font-size:10px; color:var(--brand-azul); background:var(--bg); border:1px solid var(--border)}
.contas-fluxo li:nth-child(2){animation-delay:.06s} .contas-fluxo li:nth-child(3){animation-delay:.12s} .contas-fluxo li:nth-child(4){animation-delay:.18s} .contas-fluxo li:nth-child(5){animation-delay:.24s} .contas-fluxo li:nth-child(6){animation-delay:.3s}
.contas-fluxo li:last-child{color:var(--brand-menta)} .contas-fluxo li:last-child::before{color:var(--brand-menta); border-color:color-mix(in srgb, var(--brand-menta) 45%, transparent)}
@keyframes contaEntra{from{opacity:0; transform:translateX(-8px)} to{opacity:1; transform:none}}
.contas-ve{margin-top:var(--s-5); padding:var(--s-4); border-radius:12px; border:1px solid var(--border); font-size:14.5px; line-height:1.55; color:var(--text-2)}
.contas-ve b{color:var(--text); font-weight:500}
.contas-painel{position:relative; margin:0; padding:var(--s-5); border-radius:18px; border:1px solid var(--border); background:#0d111a;
  box-shadow:0 50px 100px -50px rgba(21,171,216,.35)}
.contas-painel figcaption{margin-top:var(--s-4); font-size:11px; color:var(--text-weak)}
.cp-tela{animation:contaEntra .5s var(--ease) both}
.cp-topo{display:flex; justify-content:space-between; align-items:baseline; gap:var(--s-3); margin-bottom:var(--s-4)}
.cp-topo b{font-weight:500; font-size:17px; color:var(--text)} .cp-topo span{font-family:var(--font-mono); font-size:10.5px; color:var(--text-3)}
.cp-barra{position:relative; height:30px; border-radius:999px; background:rgba(255,255,255,.06); overflow:hidden}
.cp-barra i{position:absolute; inset:0 auto 0 0; width:0; border-radius:999px; background:linear-gradient(90deg, var(--brand-azul), var(--warn)); transition:width 1.4s var(--ease)}
.contas.vivo .cp-barra i{width:var(--v)}
.cp-barra em{position:absolute; inset:0; display:grid; place-items:center; font-style:normal; font-weight:600; font-size:14px; color:#fff}
.cp-alerta{margin:var(--s-3) 0 var(--s-4); font-size:13px; color:var(--warn)}
.cp-kpis{display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--border); margin-bottom:var(--s-4)}
.cp-kpis div{padding:var(--s-3) 0; display:grid; gap:2px} .cp-kpis div + div{padding-left:var(--s-3); border-left:1px solid var(--border)}
.cp-kpis small{font-family:var(--font-mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-3)}
.cp-kpis b{font-weight:400; font-size:clamp(17px,1.6vw,22px); color:var(--text); font-variant-numeric:tabular-nums}
.cp-mix{display:flex; gap:var(--s-4); font-size:12.5px; color:var(--text-2); margin-bottom:var(--s-3)}
.cp-mix i{display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:6px; vertical-align:-1px}
.cp-mix span:first-child i,.b-m{background:var(--brand-azul)} .cp-mix span:last-child i,.b-p{background:var(--brand-magenta)}
.cp-mes{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(12,1fr); gap:6px; height:120px; align-items:end}
.cp-mes li{display:grid; grid-template-rows:1fr auto; height:100%}
.cp-mes li{grid-template-columns:1fr 1fr; column-gap:2px; align-items:end}
.cp-mes i{display:block; height:0; border-radius:3px 3px 0 0; transition:height 1s var(--ease)}
.contas.vivo .cp-mes i{height:var(--h)}
.cp-mes span{grid-column:1 / -1; text-align:center; font-family:var(--font-mono); font-size:9.5px; color:var(--text-3); padding-top:4px}
.cp-margem{list-style:none; padding:0; margin:0 0 var(--s-2); display:grid; gap:var(--s-3)}
.cp-margem li{display:grid; grid-template-columns:80px 1fr 48px; align-items:center; gap:var(--s-3); font-size:13.5px; color:var(--text-2)}
.cp-margem i{height:12px; border-radius:999px; background:var(--brand-menta); width:0; transition:width 1.2s var(--ease)}
.contas.vivo .cp-margem i{width:var(--v)}
.cp-margem b{font-weight:500; color:var(--text); text-align:right; font-variant-numeric:tabular-nums}
.cp-margem li.baixa i{background:var(--warn)} .cp-margem li.baixa b{color:var(--warn)}
@media (max-width:980px){ .contas-grade{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ .contas-fluxo li,.cp-tela{animation:none} .cp-barra i,.cp-mes i,.cp-margem i{transition:none} }
.nota-faturamento{margin-top:var(--s-4); padding:var(--s-4) var(--s-5); border-left:2px solid var(--brand-menta); background:rgba(44,236,168,.04); border-radius:0 12px 12px 0; font-size:15px; line-height:1.55; color:var(--text-2); max-width:68ch}
.nota-faturamento b{color:var(--text); font-weight:500}

/* =====================================================================
   HOME · 05 portfólio em trilho: cards verticais, rolagem lateral
   ===================================================================== */
.trilho-produtos{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(300px, calc((100% - 2 * var(--s-3)) / 3.3)); gap:var(--s-3);
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-left:0; padding-bottom:var(--s-3); scrollbar-width:none; overscroll-behavior-x:contain}
.trilho-produtos::-webkit-scrollbar{display:none}
.trilho-produtos .produto{scroll-snap-align:start; min-height:520px; padding:var(--s-6) var(--s-5)}
.trilho-produtos .produto h3{font-size:clamp(24px,2vw,30px); line-height:1.15}
.trilho-produtos .produto p{font-size:14.5px; line-height:1.6}
.trilho-produtos .edicoes span{font-size:12px; padding:4px 10px}
.produto-tipo{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--brand-azul)}
.produto-wordmark{font-weight:600; font-size:30px; letter-spacing:-.03em; color:var(--text)} .produto-wordmark b{font-weight:600; color:var(--accent-good)}
.produto-marca--kardapo img{filter:brightness(1.45) saturate(1.1)}
.produto-status{display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--brand-menta)}
.produto-status::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--brand-menta); box-shadow:0 0 0 4px rgba(44,236,168,.15)}
.trilho-ctrl{display:flex; align-items:center; gap:var(--s-4); margin-top:var(--s-5)}
.trilho-ctrl button{all:unset; cursor:pointer; width:44px; height:44px; border-radius:50%; border:1px solid var(--border-strong); display:grid; place-items:center; color:var(--text); transition:all .25s}
.trilho-ctrl button:hover{background:var(--text); color:var(--bg)} .trilho-ctrl button:focus-visible{outline:2px solid var(--brand-azul); outline-offset:2px}
.trilho-ctrl button[disabled]{opacity:.3; pointer-events:none}
.trilho-ctrl svg{width:18px; height:18px}
.trilho-barra{flex:1; height:2px; background:var(--border); border-radius:2px; overflow:hidden}
.trilho-barra i{display:block; height:100%; width:30%; background:linear-gradient(90deg, var(--brand-azul), var(--brand-menta)); transition:transform .3s var(--ease), width .3s}
@media (max-width:700px){ .trilho-produtos{grid-auto-columns:82%} .trilho-produtos .produto{min-height:480px} }
.trilho-produtos{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent)}
.produto-status--evolui{color:var(--brand-azul)} .produto-status--evolui::before{background:var(--brand-azul); box-shadow:0 0 0 4px rgba(21,171,216,.15)}
.vidro-plano .produto-wordmark{font-size:24px} .vidro-plano .vp-kardapo{height:30px; width:auto; filter:brightness(1.45)} .ficha .produto-marca--kardapo img{height:40px; width:auto}
.vidro-plano .produto-wordmark{font-family:var(--font-ui); text-transform:none; letter-spacing:-.03em; font-weight:600; color:var(--text); font-size:26px} .vidro-plano .produto-wordmark b{font-family:var(--font-ui); letter-spacing:-.03em; font-weight:600}