/* =========================================================================
   Dossie Rudder: folha do blog.
   Tokens identicos aos do index.html. Se mexer em cor la, mexa aqui tambem.
   Gramatica propria: capa escura, corpo com indice pegajoso a esquerda,
   blocos citaveis em cartao. Nada montado com fio.
   ========================================================================= */

:root{
  --navy:#05316B;
  --navy-deep:#04234C;
  --navy-night:#03182F;
  --navy-abyss:#020D1B;

  --ink:#0E1A28;
  --ink-2:#3A4C61;
  --ink-3:#54637A;

  --paper:#FCFBF8;
  --stone:#F0ECE3;
  --stone-2:#E4DCCD;
  --edge:#DED5C4;

  --brass:#8E6220;
  --brass-mid:#B98436;
  --ochre:#C08B3A;
  --brass-glow:#E3B667;

  --on-dark:#EDF2F9;
  --on-dark-2:#A9BED9;
  --on-dark-3:#859CBD;
  --d-surface:#062243;
  --d-edge:#123763;

  --shell:1580px;
  --gut:clamp(20px,5vw,64px);
  --sec:clamp(64px,7vw,108px);

  --r:3px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --lift:0 24px 60px -34px rgba(9,30,60,.45);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Archivo",Arial,sans-serif;font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}

.shell{max-width:var(--shell);margin:0 auto;width:100%;padding-left:var(--gut);padding-right:var(--gut)}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:12px 18px;z-index:200}
.skip:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--ochre);outline-offset:3px}

/* ---------------------------- papeis tipograficos ---------------------------- */
.dxl{font-family:"Spectral",Georgia,serif;font-weight:400;font-size:clamp(38px,5.4vw,72px);line-height:1.04;letter-spacing:-.03em;margin:0;text-wrap:balance}
.dlg{font-family:"Spectral",Georgia,serif;font-weight:400;font-size:clamp(27px,3.1vw,42px);line-height:1.12;letter-spacing:-.028em;margin:0;max-width:20ch;text-wrap:balance}
.dmd{font-family:"Spectral",Georgia,serif;font-weight:500;font-size:clamp(22px,2.3vw,30px);line-height:1.2;letter-spacing:-.024em;margin:0;text-wrap:balance}
.dsm{font-family:"Spectral",Georgia,serif;font-weight:500;font-size:clamp(19px,1.8vw,23px);line-height:1.26;letter-spacing:-.02em;margin:0;text-wrap:balance}
.meta{font-family:"Archivo",Arial,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin:0}
.meta--glow{color:var(--brass-glow)}
.fig{font-family:"Archivo",Arial,sans-serif;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums;line-height:.86}
.dek{font-family:"Spectral",Georgia,serif;font-weight:300;font-size:clamp(17px,1.5vw,21px);line-height:1.55;color:var(--ink-2);margin:0}
.dek--dark{color:var(--on-dark-2)}

/* ========================= MASTHEAD =========================
   Menu pedido pelo cliente em 10/11/2026: Solucoes (Financeiras, Tributarias,
   Societarias), Como trabalhamos, Quem somos, Conteudos e Contato.
   Bloco IGUAL no index.html e no blog/blog.css: mudou num, mude no outro. */
.mast{position:fixed;top:0;left:0;right:0;z-index:90;transition:background-color .3s var(--ease),box-shadow .3s var(--ease)}
.mast .in{display:flex;align-items:center;gap:14px;height:80px}
.mast .brand{display:flex;align-items:center;flex:none;text-decoration:none}
.mast .brand img{height:29px;width:auto}
.mast .brand .l-dark{display:none}
/* Grupo Studio no cabeçalho (pedido do Tiago em 12/11/2026): "Unidade" + logo oficial V1, um pouco menor que a marca da Rudder, separado por uma linha fina */
.mast .gs-head{display:flex;align-items:center;gap:10px;flex:none;margin-left:18px;padding-left:18px;height:30px;border-left:1px solid rgba(255,255,255,.32)}
.mast .gs-un{font-family:"Archivo",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-3)}
.mast .gs-head img{height:24px;width:auto;display:block}
.mast .gs-head .g-dark{display:none}
.mast.solid .gs-head,.mast.open .gs-head{border-left-color:var(--stone-2)}
.mast.solid .gs-un,.mast.open .gs-un{color:var(--ink-2)}
.mast.solid .gs-head .g-light,.mast.open .gs-head .g-light{display:none}
.mast.solid .gs-head .g-dark,.mast.open .gs-head .g-dark{display:block}

.mast .btn{flex:none;padding:11px 18px;font-size:12.5px}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav-a{
  display:inline-flex;align-items:center;gap:7px;padding:10px 12px;border:0;background:none;cursor:pointer;
  font-family:"Archivo",Arial,sans-serif;font-size:13px;font-weight:500;letter-spacing:.01em;
  color:var(--on-dark-2);text-decoration:none;border-radius:var(--r);transition:color .2s var(--ease);
}
.nav-a:hover,.nav-sub.open .nav-tg{color:var(--on-dark)}
.nav-tg svg{width:10px;height:6px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .25s var(--ease)}
.nav-sub{position:relative}
.nav-sub:hover .nav-tg svg,.nav-sub.open .nav-tg svg{transform:rotate(180deg)}
.sub{
  position:absolute;top:100%;left:-6px;min-width:310px;padding:8px;display:none;
  background:var(--paper);border-radius:var(--r);box-shadow:0 26px 60px -30px rgba(9,30,60,.55),0 0 0 1px rgba(9,30,60,.05);
}
.nav-sub:hover .sub,.nav-sub:focus-within .sub,.nav-sub.open .sub{display:grid}
.sub a{display:grid;gap:3px;padding:12px 14px;border-radius:var(--r);text-decoration:none;transition:background-color .2s var(--ease)}
.sub a:hover,.sub a:focus-visible{background:var(--stone)}
.sub b{font-family:"Archivo",Arial,sans-serif;font-size:14px;font-weight:600;color:var(--ink)}
.sub span{font-family:"Archivo",Arial,sans-serif;font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.mast.solid{background:rgba(252,251,248,.94);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(222,213,196,.9)}
.mast.solid .brand .l-light{display:none}
.mast.solid .brand .l-dark{display:block}
.mast.solid .nav-a{color:var(--ink-2)}
.mast.solid .nav-a:hover,.mast.solid .nav-sub.open .nav-tg{color:var(--ink)}
.mast.solid .btn-out-d{color:var(--navy);border-color:var(--stone-2)}
.mast.solid .btn-out-d:hover{border-color:var(--navy);background:rgba(5,49,107,.05)}
.burger{display:none;width:44px;height:44px;flex:none;border-radius:var(--r);background:transparent;border:1px solid #1D4576;cursor:pointer;align-items:center;justify-content:center;padding:0}
.mast.solid .burger,.mast.open .burger{border-color:var(--stone-2)}
.burger i{display:block;width:18px;height:1.6px;background:var(--on-dark);position:relative;transition:background .2s}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:18px;height:1.6px;background:inherit;transition:transform .3s var(--ease)}
.burger i::before{top:-6px}
.burger i::after{top:6px}
.mast.solid .burger i,.mast.solid .burger i::before,.mast.solid .burger i::after{background:var(--ink)}
.mast.open .burger i{background:transparent}
.mast.open .burger i::before{transform:translateY(6px) rotate(45deg);background:var(--ink)}
.mast.open .burger i::after{transform:translateY(-6px) rotate(-45deg);background:var(--ink)}
.drawer{display:none;background:var(--paper);padding:6px var(--gut) 26px;max-height:calc(100dvh - 66px);overflow:auto}
.drawer a{display:block;font-family:"Archivo",Arial,sans-serif;font-size:17px;font-weight:500;color:var(--ink);text-decoration:none;padding:13px 0}
.drawer a + a{box-shadow:inset 0 1px 0 var(--stone-2)}
.drawer .dw-k{margin:12px 0 2px;font-family:"Archivo",Arial,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.drawer .dw-sub{padding-left:14px;font-size:16px;color:var(--ink-2)}
.drawer .btn{margin-top:18px;box-shadow:none}
@media (max-width:1120px){
  .nav{display:none}
  .mast .btn{margin-left:auto}
  .burger{display:flex}
  .mast .in{height:66px}
  .mast.open{background:var(--paper);box-shadow:0 30px 60px -40px rgba(9,30,60,.6)}
  .mast.open .brand .l-light{display:none}
  .mast.open .brand .l-dark{display:block}
  .mast.open .btn-out-d{color:var(--navy);border-color:var(--stone-2)}
  .mast.open .drawer{display:block}
}
@media (max-width:520px){
  .mast .in{gap:10px}
  .mast .brand img{height:24px}
  .mast .gs-head{margin-left:11px;padding-left:11px;gap:7px;height:26px}
  .mast .gs-head img{height:19px}
  .mast .gs-un{font-size:8.5px;letter-spacing:.16em}

  .mast .btn{padding:10px 12px;font-size:11.5px;letter-spacing:.01em}
}
@media (max-width:470px){.mast .in > .btn{display:none}.mast .burger{margin-left:auto}}

/* barra de leitura: so no post, so quando ha progresso */
.prog{position:fixed;top:0;left:0;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--ochre);z-index:95;transition:transform .08s linear}

/* ---------------------------- botoes ---------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:"Archivo",Arial,sans-serif;font-size:14px;font-weight:600;letter-spacing:.015em;
  padding:15px 26px;border-radius:var(--r);text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);
}
.btn-ochre{background:var(--ochre);color:#211503;border-color:var(--ochre)}
.btn-ochre:hover{background:var(--brass-glow);border-color:var(--brass-glow)}
.btn-navy{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-navy:hover{background:var(--navy-deep);border-color:var(--navy-deep)}
.btn-out-d{color:var(--on-dark);border-color:#1D4576;background:transparent}
.btn-out-d:hover{border-color:var(--on-dark)}
.btn-block{width:100%}

/* link de leitura: sublinhado que cresce, unica motricidade de hover da pagina */
.ln{
  display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  font-family:"Archivo",Arial,sans-serif;font-size:13.5px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--brass);position:relative;padding-bottom:3px;
}
.ln::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(.24);transform-origin:0 50%;transition:transform .4s var(--ease)}
.ln:hover::after{transform:scaleX(1)}
.ln--glow{color:var(--brass-glow)}
.ln svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5}

/* ---------------------------- secoes ---------------------------- */
.sec{padding-top:var(--sec);padding-bottom:var(--sec)}
.sec--stone{background:var(--stone)}
.sec--dark{background:var(--navy-night);color:var(--on-dark);position:relative;overflow:clip}
.sec--dark .dek{color:var(--on-dark-2)}

/* leme estrutural, cortado pela borda */
.wm{position:absolute;pointer-events:none;color:#5B85BE;opacity:.055}
.wm svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.1}

/* ---------------------------- capa do indice ---------------------------- */
.plate{position:relative;min-height:min(78vh,640px);display:flex;align-items:flex-end;background:var(--navy-abyss);overflow:clip}
.plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92}
.plate::after{content:"";position:absolute;inset:0;background:
  linear-gradient(104deg,rgba(2,13,27,.95) 0%,rgba(2,13,27,.87) 34%,rgba(2,13,27,.40) 100%),
  linear-gradient(to top,rgba(2,13,27,.76) 0%,rgba(2,13,27,.12) 44%,rgba(2,13,27,0) 72%)}
.plate .in{position:relative;z-index:2;width:100%;padding-top:clamp(120px,14vw,180px);padding-bottom:clamp(44px,5vw,72px)}
.plate .dxl{color:var(--on-dark);max-width:22ch}
.plate .dek{color:var(--on-dark-2);max-width:54ch;margin-top:clamp(18px,2vw,26px)}
.rail{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:clamp(20px,2.4vw,30px)}
.rail span{font-family:"Archivo",Arial,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-glow)}
.rail i{display:block;width:3px;height:3px;border-radius:50%;background:currentColor;color:var(--on-dark-3);opacity:.7}
.rail .q{color:var(--on-dark-3)}

/* ---------------------------- destaque ---------------------------- */
.feat{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:start}
@media (max-width:920px){.feat{grid-template-columns:minmax(0,1fr);gap:22px}}
.feat .no{display:block;font-size:clamp(56px,8vw,104px);color:var(--stone-2);margin-bottom:10px}
.feat .lead{font-family:"Archivo",Arial,sans-serif;font-size:15.5px;line-height:1.7;color:var(--ink-2);margin:18px 0 0;max-width:62ch}
.feat .ln{margin-top:clamp(20px,2.4vw,28px)}

/* ---------------------------- indice de artigos ----------------------------
   Triptico desigual, nao grade de cartao igual: o primeiro ocupa a coluna
   larga e as duas linhas, os outros dois empilham na coluna estreita. */
.posts{
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  grid-auto-rows:minmax(0,1fr);gap:10px;margin-top:clamp(30px,3.6vw,46px);
}
@media (max-width:880px){.posts{grid-template-columns:minmax(0,1fr)}}
.pc{
  background:var(--paper);border-radius:var(--r);padding:clamp(24px,2.8vw,38px);
  display:flex;flex-direction:column;gap:14px;text-decoration:none;color:inherit;
  box-shadow:0 1px 1px rgba(9,30,60,.04);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.pc:hover{transform:translateY(-3px);box-shadow:var(--lift)}
.pc .top{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.pc .no{font-size:clamp(26px,3vw,40px);color:var(--stone-2);flex:none}
.pc p{margin:0;font-family:"Archivo",Arial,sans-serif;font-size:15px;line-height:1.65;color:var(--ink-2);max-width:56ch}
.pc .ln{margin-top:auto;padding-top:8px}
/* o primeiro pesa mais: coluna larga, duas linhas, fundo marinho */
.pc--big{grid-row:span 2;background:var(--navy);color:var(--on-dark);justify-content:flex-start}
@media (max-width:880px){.pc--big{grid-row:auto}}
.pc--big .dmd{color:var(--on-dark);max-width:17ch}
.pc--big p{color:var(--on-dark-2);max-width:48ch}
.pc--big{position:relative;overflow:clip}
/* o vazio da coluna larga vira massa tipografica: a cifra desce e encosta no canto */
.pc--big .no{position:absolute;right:.02em;bottom:-.14em;font-size:clamp(120px,15vw,230px);color:#0B3F80;pointer-events:none}
.pc--big > *:not(.top){position:relative;z-index:1}
@media (max-width:880px){.pc--big .no{position:static;font-size:clamp(26px,3vw,40px);color:#1D4576}}
.pc--big .meta{color:var(--brass-glow)}
.pc--big .ln{color:var(--brass-glow)}

/* ---------------------------- capa do post ---------------------------- */
.cover{background:var(--navy-night);color:var(--on-dark);position:relative;overflow:clip;
  padding-top:clamp(120px,13vw,172px);padding-bottom:clamp(46px,5.4vw,78px)}
.cover .wm{top:-34%;right:-10%;width:min(50vw,620px);aspect-ratio:1}
.cover .in{position:relative;z-index:2}
.cover .dxl{color:var(--on-dark);max-width:18ch;font-size:clamp(33px,4.6vw,60px)}
.cover .dek{color:var(--on-dark-2);max-width:60ch;margin-top:clamp(18px,2vw,26px)}
.crumb{font-family:"Archivo",Arial,sans-serif;font-size:12px;color:var(--on-dark-3);margin:0 0 clamp(20px,2.4vw,30px)}
.crumb a{color:var(--on-dark-2);text-decoration:none;border-bottom:1px solid rgba(169,190,217,.35)}
.crumb a:hover{color:var(--on-dark);border-color:currentColor}

/* ---------------------------- corpo do artigo ---------------------------- */
.art{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(24px,4vw,70px);align-items:start}
@media (max-width:1000px){.art{grid-template-columns:minmax(0,1fr);gap:30px}}
.toc{position:sticky;top:104px}
@media (max-width:1000px){.toc{position:static;background:var(--stone);border-radius:var(--r);padding:22px 24px}}
.toc h2{font-family:"Archivo",Arial,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin:0 0 16px}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.toc li{counter-increment:t;margin-bottom:11px}
.toc a{
  display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px;text-decoration:none;
  font-family:"Archivo",Arial,sans-serif;font-size:14px;line-height:1.45;color:var(--ink-3);
  transition:color .25s var(--ease);
}
.toc a::before{content:counter(t,decimal-leading-zero);font-weight:600;font-variant-numeric:tabular-nums;color:var(--stone-2)}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--ink);font-weight:600}
.toc a.on::before{color:var(--ochre)}

.body{max-width:66ch}
.body > h2{
  font-family:"Spectral",Georgia,serif;font-weight:500;font-size:clamp(24px,2.5vw,34px);
  line-height:1.16;letter-spacing:-.026em;margin:clamp(44px,5vw,66px) 0 18px;scroll-margin-top:110px;text-wrap:balance;
}
.body > h2:first-child{margin-top:0}
.body > h3{font-family:"Archivo",Arial,sans-serif;font-size:17px;font-weight:600;color:var(--ink);margin:30px 0 10px}
.body > p{font-family:"Spectral",Georgia,serif;font-weight:400;font-size:18.5px;line-height:1.72;color:var(--ink-2);margin:0 0 20px}
.body > p > b,.body > p > strong{font-weight:600;color:var(--ink)}
.body > p > a,.body > li > a{color:var(--brass);text-decoration:none;border-bottom:1px solid rgba(142,98,32,.4)}
.body > p > a:hover,.body > li > a:hover{border-color:var(--brass)}
.body > ul{margin:0 0 22px;padding-left:0;list-style:none}
.body > ul > li{
  position:relative;padding-left:22px;margin-bottom:11px;
  font-family:"Archivo",Arial,sans-serif;font-size:16px;line-height:1.66;color:var(--ink-2);
}
.body > ul > li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;border-radius:50%;background:var(--ochre)}
.body > ul > li > b{font-weight:600;color:var(--ink)}

/* bloco citavel: tem que fazer sentido recortado do texto */
.box{background:var(--stone);border-radius:var(--r);padding:clamp(22px,2.6vw,32px);margin:clamp(26px,3vw,38px) 0}
.box .k{display:block;font-family:"Archivo",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin-bottom:12px}
.box p{margin:0 0 12px;font-family:"Archivo",Arial,sans-serif;font-size:16px;line-height:1.68;color:var(--ink)}
.box p:last-child{margin:0}
.box b{font-weight:600}
.box--navy{background:var(--navy);color:var(--on-dark)}
.box--navy .k{color:var(--brass-glow)}
.box--navy p{color:var(--on-dark)}

/* cifra: a unica peca de escala grande dentro do corpo */
.cif{margin:clamp(30px,3.4vw,46px) 0;display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:clamp(16px,2.4vw,34px);align-items:center}
@media (max-width:620px){.cif{grid-template-columns:minmax(0,1fr);gap:10px}}
.cif .n{font-family:"Archivo",Arial,sans-serif;font-weight:800;letter-spacing:-.045em;font-size:clamp(46px,7vw,92px);line-height:.84;color:var(--navy);font-variant-numeric:tabular-nums}
.cif p{margin:0;font-family:"Archivo",Arial,sans-serif;font-size:15px;line-height:1.6;color:var(--ink-2);max-width:40ch}

/* par em contraste: sem estrutura x com estrutura */
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:clamp(26px,3vw,38px) 0}
@media (max-width:640px){.pair{grid-template-columns:minmax(0,1fr)}}
.pair > div{background:var(--stone);border-radius:var(--r);padding:clamp(20px,2.2vw,28px)}
.pair > div.yes{background:rgba(192,139,58,.12)}
.pair .k{display:block;font-family:"Archivo",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.pair > div.yes .k{color:var(--brass)}
.pair p{margin:0;font-family:"Archivo",Arial,sans-serif;font-size:15px;line-height:1.64;color:var(--ink-2)}

/* nota de margem */
.nota{margin:clamp(24px,2.8vw,34px) 0;padding-left:18px;border-left:2px solid var(--ochre)}
.nota p{margin:0;font-family:"Spectral",Georgia,serif;font-style:italic;font-weight:400;font-size:18px;line-height:1.56;color:var(--ink)}

.src{font-family:"Archivo",Arial,sans-serif;font-size:12.5px;line-height:1.6;color:var(--ink-3);margin:clamp(30px,3.4vw,44px) 0 0}

/* ---------------------------- perguntas rapidas ---------------------------- */
.qa{display:grid;gap:8px;margin-top:clamp(28px,3.4vw,44px);max-width:1000px}
.prods ~ .qa,.sec .qa--2{max-width:none}
.qa details{background:var(--paper);border-radius:var(--r);box-shadow:0 1px 1px rgba(9,30,60,.04)}
.qa summary{
  list-style:none;cursor:pointer;padding:clamp(18px,2vw,24px) clamp(20px,2.2vw,28px);
  font-family:"Spectral",Georgia,serif;font-weight:500;font-size:clamp(17px,1.7vw,21px);line-height:1.3;
  letter-spacing:-.018em;color:var(--ink);display:flex;align-items:baseline;justify-content:space-between;gap:18px;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";flex:none;width:11px;height:11px;margin-top:6px;border-right:1.5px solid var(--brass);border-bottom:1.5px solid var(--brass);transform:rotate(45deg);transition:transform .3s var(--ease)}
.qa details[open] summary::after{transform:rotate(-135deg)}
.qa .a{padding:0 clamp(20px,2.2vw,28px) clamp(20px,2.2vw,26px)}
.qa .a p{margin:0 0 12px;font-family:"Archivo",Arial,sans-serif;font-size:15.5px;line-height:1.7;color:var(--ink-2);max-width:78ch}
.qa .a p:last-child{margin:0}
.qa .a strong{font-weight:600;color:var(--ink)}

/* ---------------------------- proximo e anterior ---------------------------- */
.twins{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (max-width:760px){.twins{grid-template-columns:minmax(0,1fr)}}
.twins a{
  background:var(--stone);border-radius:var(--r);padding:clamp(22px,2.6vw,32px);
  text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:12px;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.twins a:hover{transform:translateY(-3px);box-shadow:var(--lift)}
.twins .k{font-family:"Archivo",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}

/* ---------------------------- chamada final ---------------------------- */
.cta{background:var(--navy);color:var(--on-dark);border-radius:var(--r);padding:clamp(32px,4vw,56px);position:relative;overflow:clip}
.cta .wm{top:-50%;right:-6%;width:min(36vw,420px);aspect-ratio:1;color:#5B85BE;opacity:.07}
.cta .in2{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,3vw,48px);align-items:center}
@media (max-width:860px){.cta .in2{grid-template-columns:minmax(0,1fr);gap:22px}}
.cta .dmd{color:var(--on-dark)}
.cta p{margin:14px 0 0;font-family:"Archivo",Arial,sans-serif;font-size:15.5px;line-height:1.68;color:var(--on-dark-2);max-width:52ch}
.cta .btnrow{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start}
@media (min-width:861px){.cta .btnrow{justify-content:flex-end}}

/* ---------------------------- rodape ---------------------------- */
footer{background:var(--navy-abyss);color:var(--on-dark);padding-top:clamp(52px,6vw,84px);padding-bottom:34px;position:relative;overflow:clip}
footer .wm{bottom:-44%;left:-8%;width:min(42vw,520px);aspect-ratio:1;color:#5B85BE;opacity:.05}
footer .shell{position:relative;z-index:2}
.fgt{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr));gap:clamp(26px,3.4vw,46px)}
@media (max-width:1100px){.fgt{grid-template-columns:repeat(4,minmax(0,1fr))}.f-about{grid-column:1/-1}}
@media (max-width:760px){.fgt{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}}
@media (max-width:420px){.fgt{grid-template-columns:minmax(0,1fr)}}
footer h4 a{color:inherit;text-decoration:none}
footer h4 a:hover{color:var(--on-dark)}
.f-gs{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap}
.f-gs img{height:22px;width:auto;display:block}
.flogo{height:28px;width:auto}
.about{font-family:"Archivo",Arial,sans-serif;font-size:14px;line-height:1.68;color:var(--on-dark-2);margin:18px 0 20px;max-width:46ch}
footer address{font-style:normal;display:grid;gap:12px}
footer address span{display:block;font-family:"Archivo",Arial,sans-serif;font-size:14px;line-height:1.55;color:var(--on-dark-2)}
footer address .k{display:block;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-3);margin-bottom:4px}
footer address a{color:var(--on-dark-2);text-decoration:none}
footer address a:hover{color:var(--on-dark)}
footer h4{font-family:"Archivo",Arial,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-glow);margin:0 0 16px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
footer ul a{font-family:"Archivo",Arial,sans-serif;font-size:14px;color:var(--on-dark-2);text-decoration:none}
footer ul a:hover{color:var(--on-dark)}
.flegal{font-family:"Archivo",Arial,sans-serif;font-size:12px;line-height:1.6;color:var(--on-dark-3);margin:clamp(34px,4vw,54px) 0 0;max-width:110ch}
.fbase{display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between;margin-top:26px;padding-top:20px;box-shadow:inset 0 1px 0 rgba(133,156,189,.22)}
.fbase span{font-family:"Archivo",Arial,sans-serif;font-size:12.5px;color:var(--on-dark-3)}
.fbase a{color:var(--on-dark-2);text-decoration:none}
.fbase a:hover{color:var(--on-dark)}

/* ---------------------------- paginas de solucoes ----------------------------
   /solucoes-financeiras/, /solucoes-tributarias/, /solucoes-societarias/.
   Geradas pelo painel (admin/site.php). Cartao de produto e o lugar do
   detalhe tecnico que saiu da home. */
.cover-cta{margin-top:clamp(22px,2.6vw,32px);position:relative;z-index:2}
.outras{margin:0 0 clamp(26px,3vw,38px);font-family:"Archivo",Arial,sans-serif;font-size:14px;color:var(--ink-3)}
.outras a{color:var(--brass);font-weight:600;text-decoration:none;margin-left:6px}
.outras a:hover{text-decoration:underline}
.prods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:clamp(28px,3.4vw,44px)}
.prods--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){.prods--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){.prods{grid-template-columns:minmax(0,1fr)}}
.prod{background:var(--stone);border-radius:var(--r);padding:clamp(24px,2.8vw,36px);display:flex;flex-direction:column;gap:6px;scroll-margin-top:100px;transition:box-shadow .3s var(--ease)}
.prod:target{box-shadow:0 0 0 2px var(--ochre)}
.prod--in{grid-column:1/-1;background:var(--navy);color:var(--on-dark)}
.prod--in .dsm{color:var(--on-dark)}
.prod--in .meta{color:var(--brass-glow);margin-bottom:6px}
.prod .pl{margin:0;font-family:"Archivo",Arial,sans-serif;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--brass)}
.prod--in .pl{color:var(--brass-glow)}
.prod .pb > p{margin:10px 0 0;font-family:"Archivo",Arial,sans-serif;font-size:15.5px;line-height:1.68;color:var(--ink-2);max-width:64ch}
.prod--in .pb > p{color:var(--on-dark-2);max-width:86ch}
.prod ul{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:7px}
.prod li{position:relative;padding-left:17px;font-family:"Archivo",Arial,sans-serif;font-size:14.5px;line-height:1.5;color:var(--ink)}
.prod li::before{content:"";position:absolute;left:1px;top:8px;width:6px;height:6px;border-radius:50%;background:var(--ochre)}
.prod .ln{margin-top:18px}
.portas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:clamp(26px,3vw,38px)}
@media (max-width:900px){.portas{grid-template-columns:minmax(0,1fr)}}
.portas--pre{margin-top:16px}
.portas article{background:var(--paper);border-radius:var(--r);padding:clamp(22px,2.4vw,30px)}
.portas article.on{background:var(--navy-night);color:var(--on-dark)}
.portas .dv{display:block;font-family:"Archivo",Arial,sans-serif;font-weight:700;font-size:clamp(20px,2vw,26px);letter-spacing:-.03em;line-height:1.1;color:var(--brass);margin-bottom:12px;font-variant-numeric:tabular-nums}
.portas .on .dv{color:var(--brass-glow)}
.portas b{display:block;font-family:"Archivo",Arial,sans-serif;font-size:15.5px;font-weight:600;margin-bottom:8px}
.portas p{margin:0;font-family:"Archivo",Arial,sans-serif;font-size:15px;line-height:1.62;color:var(--ink-2)}
.portas .on p{color:var(--on-dark-2)}
/* cartao nunca com o mesmo fundo da secao */
.sec:not(.sec--stone) .qa details{background:var(--stone)}
.sec--stone .twins a{background:var(--paper)}

/* ---------------------------- entrada da capa ----------------------------
   So translate, nunca opacity. Se o compositor congelar (janela atras de
   outra) o quadro parado ainda e um quadro legivel: o texto nasce visivel
   e a animacao e enfeite por cima, nunca a fonte da verdade. */
@keyframes sobe{from{transform:translateY(15px)}to{transform:none}}
.up{animation:sobe .72s var(--ease) both}
.up2{animation-delay:.1s}
.up3{animation-delay:.2s}
@media (prefers-reduced-motion:reduce){
  .up{animation:none}
  .pc:hover,.twins a:hover{transform:none}
}