/* Animações do artigo 04. Sem JS (ou com prefers-reduced-motion) tudo aparece já no estado final. */
.js .reveal{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.js .reveal.is-in{opacity:1;transform:none}
.js figure.reveal>a img,.js figure.reveal>img{transform:scale(1.07);transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.js figure.reveal.is-in>a img{transform:scale(1)}
.js figure.reveal.is-in>a:hover img,.js figure.reveal.is-in>a:focus-visible img{transform:scale(1.035);transition-duration:.5s}
figure>a{display:block;overflow:hidden}

/* Painel dos infográficos */
.ig{--o:#ffb15c;--g:#3df2b5;--bg1:#0b1630;--bg2:#12264a;position:relative;overflow:hidden;color:#fff;
  background:radial-gradient(ellipse at 50% 0,var(--bg2),var(--bg1) 70%);padding:clamp(18px,4vw,36px)}
.ig-title{font-weight:700;font-size:clamp(1.15rem,3.4vw,1.75rem);line-height:1.2;text-align:center;margin:0 0 clamp(16px,3vw,28px)}
.js .ig [data-a]{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .ig [data-a=left]{transform:translateX(-28px)}
.js .ig [data-a=right]{transform:translateX(28px)}
.js .ig [data-a=pop]{transform:scale(.4)}
.js .ig.is-in [data-a]{opacity:1;transform:none}

/* 1. Labirinto */
.ig-maze{position:relative;width:100%;aspect-ratio:160/62;margin-bottom:8px}
.ig-maze svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ig-maze path{fill:none;stroke:var(--o);stroke-width:1.1;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 1.6px #ff9a2e) drop-shadow(0 0 4px rgba(255,140,30,.55))}
.js .ig-maze path{stroke-dasharray:1;stroke-dashoffset:1}
.js .ig.is-in .ig-maze path{animation:ig-draw 4.2s cubic-bezier(.45,.1,.35,1) .2s forwards}
@keyframes ig-draw{to{stroke-dashoffset:0}}
.ig-pin{--s:clamp(22px,4.4vw,34px);position:absolute;width:var(--s);height:var(--s);margin:calc(var(--s)/-2) 0 0 calc(var(--s)/-2);border-radius:50%;
  background:#fff;color:#1a1200;font-weight:700;font-size:clamp(.75rem,2vw,1rem);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px rgba(255,177,92,.5),0 0 18px rgba(255,150,40,.8)}
.ig-steps{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-top:6px}
.ig-step{background:rgba(255,255,255,.05);border:1px solid rgba(255,177,92,.35);border-radius:12px;padding:14px 16px}
.ig-step b{display:flex;align-items:center;gap:10px;color:var(--o);font-size:1rem}
.ig-step b i{font-style:normal;flex:none;width:24px;height:24px;border-radius:50%;background:#fff;color:#1a1200;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.ig-step p{margin:8px 0 0;font-size:.9rem;line-height:1.45;color:rgba(255,255,255,.85)}
.ig-quote{margin:16px auto 0;max-width:34rem;text-align:center;border:2px solid var(--o);border-radius:14px;background:rgba(10,20,45,.85);padding:14px 18px;font-weight:600;line-height:1.4;box-shadow:0 0 22px rgba(255,150,40,.3)}
.ig-quote em{font-style:normal;color:var(--o)}

/* 2. Matriz AS IS x TO BE */
.ig-matrix{display:grid;gap:8px}
.ig-mhead,.ig-mrow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ig-mhead span{text-align:center;font-weight:700;font-size:clamp(.95rem,2.6vw,1.35rem)}
.ig-mhead .as{color:var(--o)}.ig-mhead .to{color:var(--g)}
.ig-cell{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;font-size:clamp(.85rem,2.2vw,1rem);line-height:1.35;min-height:62px;border:1px solid}
.ig-cell svg{flex:none;width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.ig-cell span{flex:1;text-align:center}
.ig-cell.as{background:linear-gradient(90deg,rgba(255,150,40,.32),rgba(255,150,40,.14));border-color:rgba(255,177,92,.7);color:#ffe2c2;box-shadow:0 0 14px rgba(255,150,40,.22)}
.ig-cell.to{background:linear-gradient(90deg,rgba(40,230,160,.14),rgba(40,230,160,.3));border-color:rgba(61,242,181,.7);color:#d6fff0;box-shadow:0 0 14px rgba(40,230,160,.22)}
@media(max-width:560px){.ig-mhead{display:none}.ig-mrow{grid-template-columns:1fr;gap:4px;margin-bottom:8px}
 .ig-cell.to::before{content:"→";color:var(--g);font-weight:700}}

/* 3. Impacto operacional */
.ig-cards{display:grid;gap:14px;align-items:center}
@media(min-width:720px){.ig-cards{grid-template-columns:1fr 1.35fr 1fr}}
.ig-card{background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.22);border-radius:16px;padding:20px 18px;text-align:center;box-shadow:0 0 24px rgba(255,150,40,.18)}
.ig-card h4{margin:0 0 12px;font-size:clamp(1rem,2.4vw,1.3rem);font-weight:700}
.ig-card p{margin:0;font-size:.95rem;line-height:1.5;color:rgba(255,255,255,.88)}
.ig-card.main{padding:28px 18px;border-color:rgba(61,242,181,.55);box-shadow:0 0 34px rgba(61,242,181,.28)}
.ig-old{position:relative;display:inline-block;font-weight:800;font-size:clamp(1.8rem,6vw,2.8rem);color:var(--o);text-shadow:0 0 14px rgba(255,150,60,.5);letter-spacing:.01em}
.ig-old::after{content:"";position:absolute;left:-4%;right:-4%;top:52%;height:4px;border-radius:2px;background:#fff;transform-origin:left;box-shadow:0 0 8px rgba(255,255,255,.6)}
.js .ig .ig-old::after{transform:scaleX(0)}
.js .ig.is-in .ig-old::after{transform:scaleX(1);transition:transform .7s cubic-bezier(.5,0,.2,1) 1.1s}
.ig-new{display:block;margin:6px 0 10px;font-weight:800;font-size:clamp(2.2rem,8vw,3.8rem);line-height:1.05;color:var(--g);text-shadow:0 0 22px rgba(61,242,181,.6);font-variant-numeric:tabular-nums}
.js .ig.is-in .ig-new{animation:ig-glow 2.6s ease-in-out 2.4s infinite}
@keyframes ig-glow{50%{text-shadow:0 0 34px rgba(61,242,181,.95),0 0 6px rgba(61,242,181,.8)}}
.ig-big{display:block;font-weight:800;font-size:clamp(2rem,5vw,2.8rem);color:var(--g);text-shadow:0 0 18px rgba(61,242,181,.5);margin-bottom:6px;font-variant-numeric:tabular-nums}
.ig-foot{display:block;margin-top:4px;font-size:.95rem;color:rgba(255,255,255,.85)}

@media(prefers-reduced-motion:reduce){
 .js .reveal,.js .ig [data-a]{opacity:1!important;transform:none!important;transition:none!important}
 .js .ig-maze path{stroke-dashoffset:0!important;animation:none!important}
 .js .ig .ig-old::after{transform:scaleX(1)!important;transition:none!important}
 .js figure.reveal>a img{transform:none!important;transition:none!important}
 .js .ig-new{animation:none!important}
}

/* Temas extras e componentes dos artigos 01 a 03 */
.ig.light{--o:#b8791f;--g:#2f7f9a;--bg1:#f2ecdf;--bg2:#fffdf6;color:#1c2738}
.ig.slate{--o:#a9c4a8;--bg1:#1f2d3f;--bg2:#2d4058}
.ig-left{text-align:left}
.ig-lead{margin:-8px 0 14px;max-width:34rem;font-size:clamp(.9rem,2.2vw,1.05rem);line-height:1.5;color:rgba(255,255,255,.88)}
.ig-chip{position:absolute;transform:translate(-50%,calc(-100% - 22px));white-space:nowrap;font-size:clamp(.65rem,1.8vw,.85rem);padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35)}
.js .ig .ig-chip[data-a]{transform:translate(-50%,calc(-100% - 8px))}
.js .ig.is-in .ig-chip[data-a]{transform:translate(-50%,calc(-100% - 22px))}
.ig.light .ig-maze path{stroke:var(--g);stroke-width:1.3;filter:drop-shadow(0 1px 1px rgba(30,60,80,.25))}
.ig.light .ig-pin{background:#1c2738;color:#fff;box-shadow:0 0 0 3px rgba(47,127,154,.35),0 2px 8px rgba(0,0,0,.25)}
.ig.light .ig-step{background:#fff;border-color:rgba(28,39,56,.15);box-shadow:0 1px 3px rgba(28,39,56,.08)}
.ig.light .ig-step b{color:#1c2738}
.ig.light .ig-step b i{background:#1c2738;color:#fff}
.ig.light .ig-step p{color:#3b4a5e}
.ig-dot{fill:var(--o);filter:drop-shadow(0 0 2px var(--o))}
.ig.slate .ig-maze path.band{stroke-linecap:butt;filter:none}
.js .ig.slate.is-in .ig-maze path.band{animation:ig-draw 3.4s cubic-bezier(.45,.1,.35,1) forwards}
.ig.slate .ig-step{border-color:rgba(169,196,168,.45)}
.ig.slate .ig-step b{color:#bfe0bd}
.ig-cols{display:grid;gap:12px}
@media(min-width:720px){.ig-cols{grid-template-columns:repeat(5,1fr)}}
.ig-col{background:#fff;border:1.5px solid #3b4a5e;border-radius:6px;overflow:hidden}
.ig-col h4{margin:0;padding:16px 10px;text-align:center;font-weight:600;font-size:1.05rem;border-bottom:1.5px solid #3b4a5e;background:#f7f3ea}
.ig-col div{padding:16px 12px;text-align:center;font-size:.9rem;line-height:1.5;color:#2c394c}
.ig-col p{margin:0 0 .7rem}.ig-col p:last-child{margin:0}
.ig-col em{font-style:normal;display:block;color:#5b6a7e}
.ig-col.hot{border-color:#d9a441;background:linear-gradient(#fff,#fff6e3)}
.ig-col.hot h4{color:#9a6a1a;border-color:#d9a441;background:#fdf1d8}
.js .ig.is-in .ig-col.hot{animation:ig-hot 3s ease-in-out 3s infinite}
@keyframes ig-hot{50%{box-shadow:0 0 26px rgba(217,164,65,.7)}}
@media(prefers-reduced-motion:reduce){.js .ig.is-in .ig-col.hot,.ig-dot{animation:none!important}.js .ig.slate .ig-maze path.band{stroke-dashoffset:0!important}}