/* Artigo — CSS do mockup 03-artigo.html (a base está em base.css). */
.progresso{position:fixed;top:0;left:0;height:3px;width:0;background:var(--ouro);z-index:30}

/* Cabeçalho do artigo */
.a-topo{background:var(--mata);color:#fff;padding:36px 0 0;position:relative}
.trilha{font-size:.88rem;color:#A9C4B6;display:flex;flex-wrap:wrap;gap:.4rem;list-style:none}
.trilha a{text-decoration:none} .trilha a:hover{color:#fff}
.trilha li+li::before{content:"/";margin-right:.4rem;color:#5E8574}
.a-topo .cab-txt{max-width:780px;padding:28px 0 36px}
.a-topo .cat{display:inline-block;background:rgba(212,172,76,.16);color:var(--ouro);font-weight:600;font-size:.88rem;padding:.25rem .8rem;border-radius:999px}
.a-topo h1{font-size:clamp(2rem,4.6vw,3.3rem);margin:.9rem 0 1rem}
.a-topo .dek{font-size:1.2rem;color:#C9DBD1;max-width:60ch}
.autor{display:flex;align-items:center;gap:.8rem;margin-top:1.6rem;font-size:.92rem;color:#A9C4B6}
.autor img{width:40px;height:40px;border-radius:50%;background:#fff;padding:4px}
.autor strong{color:#fff;display:block;font-weight:600}
.a-capa{position:relative;height:120px}
.a-capa .faixa{position:absolute;left:0;right:0;bottom:-120px;height:240px;border-radius:28px;background:linear-gradient(120deg,#0A4A33 0%,#0E3B2B 55%,#12503A 100%);display:grid;place-items:center;overflow:hidden;box-shadow:0 40px 70px -40px rgba(14,59,43,.6)}
.a-capa .faixa span{font-family:var(--display);font-weight:700;font-size:clamp(2rem,5vw,4rem);letter-spacing:-.03em;color:var(--ouro);text-align:center;line-height:1.05}
.a-capa .faixa svg{position:absolute;inset:0;width:100%;height:100%}

/* Corpo com barra lateral */
.a-corpo{padding:160px 0 64px}
.a-corpo .wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:64px;align-items:start}
.texto{max-width:680px;font-size:1.1rem;line-height:1.75}
.texto>*+*{margin-top:1.25rem}
.texto h2{font-size:1.75rem;margin-top:2.8rem;scroll-margin-top:90px;line-height:1.2}
.texto h3{font-size:1.25rem;margin-top:2rem}
.texto a{color:var(--verde-txt);font-weight:600}
.texto a.btn-verde{color:#fff}
.texto .btn{line-height:1.3}
.texto .compartilhar a{color:var(--tinta)}
.texto ul,.texto ol{padding-left:1.3rem}
.texto li+li{margin-top:.5rem}
.texto strong{color:var(--tinta)}
.resumo{background:#fff;border:1px solid var(--linha);border-left:4px solid var(--verde);border-radius:var(--r-md);padding:1.3rem 1.5rem;font-size:1rem}
.resumo h2{font-size:1.05rem;margin:0 0 .6rem}
.resumo ul{padding-left:1.1rem}
.formula{background:var(--mata);color:#fff;border-radius:var(--r-lg);padding:28px;text-align:center;font-family:var(--display);font-weight:700;font-size:clamp(1.15rem,2.6vw,1.6rem);letter-spacing:-.01em;line-height:1.4}
.formula .t1{color:#fff} .formula .t2{color:#F2A89E} .formula .t3{color:var(--ouro)}
.tabela{overflow-x:auto;border:1px solid var(--linha);border-radius:var(--r-md);background:#fff}
.tabela table{width:100%;border-collapse:collapse;font-size:.98rem;font-variant-numeric:tabular-nums}
.tabela caption{text-align:left;padding:1rem 1.2rem .4rem;font-weight:600;font-family:var(--display)}
.tabela th,.tabela td{padding:.7rem 1.2rem;text-align:left;border-top:1px solid var(--linha)}
.tabela td:last-child,.tabela th:last-child{text-align:right;white-space:nowrap}
.tabela thead th{font-size:.85rem;color:var(--tinta-2);font-weight:600;border-top:0}
.tabela .sub td{font-weight:700;background:var(--papel)}
.tabela .neg{color:var(--divida)}
.tabela .tot td{font-weight:700;background:#E6F3EC;color:var(--verde-txt);font-size:1.05rem}
.nota-box{background:#FBF3E2;border-radius:var(--r-md);padding:1.1rem 1.3rem;font-size:1rem;color:#6B4A0E}
.nota-box strong{color:#6B4A0E}

/* Calculadora do artigo */
.mini-calc{background:#fff;border:1px solid var(--linha);border-radius:var(--r-lg);padding:26px;font-size:1rem}
.mini-calc h3{margin:0 0 .3rem;font-size:1.2rem}
.mini-calc .desc{color:var(--tinta-2);font-size:.95rem;margin-bottom:1rem}
.mc-campos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mc-campos label span{display:block;font-size:.88rem;font-weight:600;margin-bottom:.35rem}
.mc-ctl{display:flex;align-items:center;border:1.5px solid var(--linha);border-radius:var(--r-sm);background:var(--papel)}
.mc-ctl:focus-within{border-color:var(--verde-txt);background:#fff}
.mc-ctl b{padding-left:.8rem;color:var(--tinta-2);font-weight:500}
.mc-ctl input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:1.05rem;padding:.65rem .8rem .65rem .4rem;font-variant-numeric:tabular-nums}
.mc-ctl input:focus{outline:none}
.mc-res{margin-top:1.1rem;padding-top:1rem;border-top:1px dashed var(--linha);display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.mc-res .v{font-family:var(--display);font-weight:700;font-size:2.2rem;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--verde-txt)}
.mc-res .v.neg{color:var(--divida)}
.mc-res p{font-size:.93rem;color:var(--tinta-2);max-width:34ch;margin:0}
.mini-calc .btn{margin-top:1rem}

/* Anúncio */
.anuncio small{display:block;font-size:.72rem;color:var(--tinta-2);text-align:center;margin-bottom:.35rem}
.anuncio div{border:1.5px dashed #C9D4CE;border-radius:var(--r-sm);display:grid;place-items:center;color:#98A59E;font-size:.85rem;background:repeating-linear-gradient(135deg,transparent 0 12px,rgba(14,59,43,.025) 12px 24px)}
.anuncio.meio div{height:280px}
.anuncio.lat div{height:250px}

/* Perguntas e autor */
.texto details{border-bottom:1px solid var(--linha)}
.texto summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;font-weight:600}
.texto summary::-webkit-details-marker{display:none}
.texto summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--verde-txt);transition:transform .2s}
.texto details[open] summary::after{transform:rotate(45deg)}
.texto details p{padding-bottom:1rem;color:var(--tinta-2);font-size:1rem}
.caixa-autor{display:flex;gap:1rem;align-items:flex-start;background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:1.3rem;font-size:.95rem;margin-top:2.6rem!important}
.caixa-autor img{width:52px;height:52px;border-radius:12px;background:#fff;border:1px solid var(--linha);padding:5px;flex:none}
.caixa-autor p{color:var(--tinta-2);margin-top:.2rem}
.compartilhar{display:flex;gap:.6rem;align-items:center;font-size:.92rem;color:var(--tinta-2)}
.compartilhar a{border:1px solid var(--linha);border-radius:999px;padding:.4rem .9rem;text-decoration:none;color:var(--tinta);font-weight:600;background:#fff}
.compartilhar a:hover{border-color:var(--verde-txt)}

/* Barra lateral */
.lateral{position:sticky;top:92px;display:grid;gap:22px}
.sumario{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:1.2rem 1.3rem}
.sumario h2{font-size:1rem;margin-bottom:.7rem}
.sumario ol{list-style:none;display:grid;gap:.15rem;font-size:.93rem;counter-reset:s}
.sumario a{display:block;text-decoration:none;color:var(--tinta-2);padding:.35rem .6rem;border-radius:8px;border-left:2px solid transparent}
.sumario a:hover{color:var(--tinta);background:var(--papel)}
.sumario a.ativo{color:var(--verde-txt);font-weight:600;border-left-color:var(--verde);background:#EEF6F1;border-radius:0 8px 8px 0}
.cta-lat{background:var(--mata);color:#fff;border-radius:var(--r-md);padding:1.4rem}
.cta-lat strong{font-family:var(--display);font-size:1.15rem;display:block;line-height:1.25}
.cta-lat p{color:#C9DBD1;font-size:.92rem;margin:.5rem 0 1rem}
.cta-lat .btn{width:100%}
.sumario-m{display:none}

/* Relacionados */
.relacionados{padding:24px 0 96px}
.relacionados h2{font-size:1.6rem;margin-bottom:1.4rem}
.grade{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);overflow:hidden;transition:border-color .15s}
.card:hover{border-color:var(--verde-txt)}
.card-link{display:flex;flex-direction:column;height:100%;text-decoration:none}
.capa{aspect-ratio:16/9;display:grid;place-items:center;padding:1.2rem;text-align:center;font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.1;font-size:1.5rem}
.c-pat{background:var(--mata);color:var(--ouro)} .c-dividas{background:#F6E3DF;color:#8E2A21} .c-indep{background:#F3E3B5;color:var(--mata)}
.corpo{padding:1.1rem 1.3rem 1.3rem;display:flex;flex-direction:column;flex:1}
.card .cat{font-size:.85rem;color:var(--verde-txt);font-weight:600}
.card h3{font-size:1.1rem;margin:.35rem 0 .5rem;line-height:1.3}
.card .meta{margin-top:auto;font-size:.84rem;color:var(--tinta-2)}

/* Fecho */
.final{padding:0 0 96px}
.final .caixa{background:var(--mata);color:#fff;border-radius:32px;padding:56px;display:grid;grid-template-columns:1.3fr auto;gap:40px;align-items:center}
.final h2{font-size:clamp(1.6rem,3vw,2.3rem);max-width:20ch}
.final p{color:#C9DBD1;margin-top:.7rem}

/* Acréscimos do tema (não existiam no mockup) */
/* Contraste mínimo de 4,5:1 (WCAG AA): o dourado do selo e o verde da linha de total escurecem/clareiam um tom,
   usando cores que já estão no mockup (o dourado e o verde do :hover dos botões). */
.a-topo .cat{color:#E2BE62}
.tabela .tot td,.texto .wp-block-table tfoot td{color:#066B3E}
/* Cores de capa das categorias que o mockup do artigo não trazia (iguais às do blog) */
.c-orc{background:#DCEFE4;color:var(--mata)} .c-emp{background:#E4E9F3;color:#26365E} .c-inv{background:var(--mata-2);color:var(--ouro-claro)}
.capa.com-imagem{padding:0;position:relative;overflow:hidden}
.capa img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.a-capa .faixa img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Tabela nativa do editor (bloco Tabela) no mesmo visual da .tabela do mockup */
.texto .wp-block-table{overflow-x:auto;border:1px solid var(--linha);border-radius:var(--r-md);background:#fff;margin-inline:0}
.texto .wp-block-table table{width:100%;border-collapse:collapse;font-size:.98rem;font-variant-numeric:tabular-nums}
.texto .wp-block-table th,.texto .wp-block-table td{padding:.7rem 1.2rem;text-align:left;border:0;border-top:1px solid var(--linha)}
.texto .wp-block-table td:last-child,.texto .wp-block-table th:last-child{text-align:right;white-space:nowrap}
.texto .wp-block-table thead{border:0}
.texto .wp-block-table thead th{font-size:.85rem;color:var(--tinta-2);font-weight:600;border-top:0}
.texto .wp-block-table tfoot td{font-weight:700;background:#E6F3EC;color:var(--verde-txt);border-top:1px solid var(--linha)}
.texto .wp-block-table figcaption{text-align:left;padding:.6rem 1.2rem;font-size:.88rem;color:var(--tinta-2);margin:0}
.texto .wp-block-table.is-style-stripes tbody tr:nth-child(odd){background:var(--papel)}
/* Bloco "Chamada para o app" (no visual da chamada lateral) */
.chamada-app{background:var(--mata);color:#fff;border-radius:var(--r-lg);padding:28px 30px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;font-size:1rem;line-height:1.55}
.chamada-app strong{font-family:var(--display);font-size:1.3rem;display:block;line-height:1.25;color:#fff}
.chamada-app p{color:#C9DBD1;margin-top:.4rem}
.texto .chamada-app a.btn{color:var(--mata)}
.texto figure img{border-radius:var(--r-md);height:auto}
.texto figcaption{font-size:.88rem;color:var(--tinta-2);margin-top:.5rem}
.texto blockquote{border-left:4px solid var(--ouro);padding:.2rem 0 .2rem 1.2rem;color:var(--tinta-2);font-style:italic}
@media (max-width:600px){.chamada-app{grid-template-columns:1fr;padding:24px}}

@media (max-width:1020px){
  .nav{display:none}
  .menu-m{display:block;position:relative}
  .menu-m summary{list-style:none;cursor:pointer;padding:.4rem;color:#fff}
  .menu-m summary::-webkit-details-marker{display:none}
  .menu-m nav{position:absolute;right:0;top:44px;background:#fff;border-radius:var(--r-md);padding:.6rem;min-width:200px;box-shadow:0 20px 40px -12px rgba(0,0,0,.35);display:grid}
  .menu-m nav a{color:var(--tinta);text-decoration:none;padding:.7rem .9rem;border-radius:var(--r-sm)}
  .topo .entrar{display:none} .topo .wrap{gap:1rem} .topo .acoes{margin-left:auto}
  .a-corpo .wrap{grid-template-columns:minmax(0,1fr)}
  .lateral{display:none}
  .sumario-m{display:block;background:#fff;border:1px solid var(--linha);border-radius:var(--r-md);padding:0 1.2rem}
  .sumario-m summary{padding:1rem 0;font-weight:600;cursor:pointer}
  .sumario-m ol{padding:0 0 1rem 1.2rem;font-size:.98rem}
  .sumario-m a{color:var(--tinta-2);text-decoration:none}
  .texto{max-width:none}
  .grade{grid-template-columns:1fr}
  .final .caixa{grid-template-columns:1fr;padding:36px 28px}
  .rodape .grade{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  body{font-size:16px}
  .topo .acoes .btn{display:none}
  .texto{font-size:1.04rem}
  .a-capa .faixa{height:170px;bottom:-85px;border-radius:20px}
  .a-capa{height:85px}
  .a-corpo{padding-top:112px}
  .mc-campos{grid-template-columns:1fr}
  .rodape .grade{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Aviso fixo ao fim de todo artigo: conteúdo educativo, não é recomendação de investimento. */
.texto .aviso-legal{margin-top:2.4rem;padding-top:1rem;border-top:1px solid var(--linha);font-size:.88rem;line-height:1.6;color:var(--tinta-2)}
/* Tabelas do bloco nativo: "tabela-numeros" não quebra os valores; "tabela-texto" deixa a última coluna quebrar. */
.texto .tabela-numeros td:not(:first-child),.texto .tabela-numeros th:not(:first-child){white-space:nowrap}
.texto .tabela-texto td:last-child,.texto .tabela-texto th:last-child{white-space:normal;text-align:left}
.texto .tabela-numeros th,.texto .tabela-numeros td{padding:.7rem .85rem}
/* Bloco "Tela do app" */
.texto figure.tela{margin-inline:auto;text-align:center}
.texto figure.tela img{display:block;margin-inline:auto;border-radius:var(--r-md);box-shadow:0 24px 48px -28px rgba(14,59,43,.45)}
.texto figure.tela-cel img{width:min(100%,280px);border-radius:28px}
.texto figure.tela-pc img{width:100%}
.texto figure.tela figcaption{margin-top:.8rem}
