/* S3U · leitura guiada (régua do site, 14/10).
   Uso: data-guia na <section>; data-trecho em cada trecho que acende na ordem; <b class="g"> no negrito que aparece na leitura;
   ul.guia-lista para tópicos com o quadrado dourado. Sem JavaScript ou com movimento reduzido, tudo aparece normal. */
.guia-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.guia-lista li{position:relative;padding-left:22px;font-size:clamp(17px,1.5vw,18px);line-height:1.6;max-width:56ch;text-wrap:pretty}
.guia-lista li::before{content:"";position:absolute;left:0;top:.68em;width:6px;height:6px;background:#C9A227}
.claro .guia-lista li{color:#16294D}
.navy .guia-lista li{color:#F7F5F0}
b.g{font-weight:600}
.claro b.g{color:#16294D}
.navy b.g{color:#F7F5F0}

/* ligado pelo s3u-guia.js */
.guia-on [data-trecho]{transition:opacity 520ms cubic-bezier(.22,.61,.36,1),transform 520ms cubic-bezier(.22,.61,.36,1)}
.guia-on [data-trecho]:not(.passo-lido):not(.passo-atual){opacity:.32;transform:translateY(6px)}
.guia-on [data-trecho].passo-lido{opacity:.6}
.guia-on [data-trecho].passo-atual,.guia-on.guia-fim [data-trecho]{opacity:1;transform:none}
.guia-on b.g{font-weight:400;background:linear-gradient(#C9A227,#C9A227) no-repeat 0 100%/0 1px;padding-bottom:1px;transition:font-weight 480ms cubic-bezier(.22,.61,.36,1),background-size 620ms cubic-bezier(.22,.61,.36,1) 120ms}
.guia-on .passo-atual b.g,.guia-on .passo-lido b.g,.guia-on.guia-fim b.g{font-weight:600;background-size:100% 1px}
/* freio leve: a seção ganha altura extra e o miolo fica parado na tela enquanto os trechos acendem */
.guia-espaco{display:block;height:var(--guia-extra,0px);pointer-events:none}
section[data-guia]{overflow:clip !important}
.guia-presa > .miolo{position:sticky;top:var(--guia-topo,0px)}
@media (prefers-reduced-motion:reduce){.guia-on [data-trecho]{transition:none}.guia-on b.g{transition:none}}
/* barra de progresso de leitura: fio dourado de 2px logo abaixo do cabeçalho */
.guia-progresso{position:fixed;left:0;right:0;top:0;height:2px;z-index:29;pointer-events:none;background:transparent}
.guia-progresso span{display:block;height:100%;background:#C9A227;transform-origin:0 50%;transform:scaleX(0)}
/* tempo de leitura: mesmo desenho do rótulo */
.tempo-leitura{font:500 12px/1.5 var(--font-detail);letter-spacing:.14em;text-transform:uppercase}
.claro .tempo-leitura{color:#5B6475}
.navy .tempo-leitura{color:rgba(247,245,240,.72)}