/* treinamento */
:root{
  --ground:#FAF8FB; --surface:#FFFFFF; --surface-2:#F4F0F7; --surface-3:#EDE7F2;
  --ink:#1B1420; --ink-2:#3D3247; --muted:#6E6478; --line:#E4DCEA; --line-2:#D3C7DC;
  --roxo:#5B1180; --roxo-ink:#5B1180; --roxo-soft:#F1E6F7; --on-roxo:#FFFFFF;
  --laranja:#D9550A; --laranja-soft:#FBEBDD;
  --verde:#1C6B51; --verde-soft:#E2F1EA;
  --shadow:0 1px 2px rgba(27,20,32,.05), 0 8px 24px -16px rgba(27,20,32,.22);
  --maxw:1180px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#141019; --surface:#1C1724; --surface-2:#241D2E; --surface-3:#2C2438;
    --ink:#EFE9F4; --ink-2:#D2C8DC; --muted:#A296AE; --line:#322940; --line-2:#453A56;
    --roxo:#C793E6; --roxo-ink:#C793E6; --roxo-soft:#2B1D38; --on-roxo:#191220;
    --laranja:#FF9552; --laranja-soft:#372313;
    --verde:#63C7A2; --verde-soft:#122E26;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --ground:#141019; --surface:#1C1724; --surface-2:#241D2E; --surface-3:#2C2438;
  --ink:#EFE9F4; --ink-2:#D2C8DC; --muted:#A296AE; --line:#322940; --line-2:#453A56;
  --roxo:#C793E6; --roxo-ink:#C793E6; --roxo-soft:#2B1D38; --on-roxo:#191220;
  --laranja:#FF9552; --laranja-soft:#372313;
  --verde:#63C7A2; --verde-soft:#122E26;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.7);
}

*{box-sizing:border-box}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:"Source Serif 4", Georgia, "Times New Roman", serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Archivo","Helvetica Neue",Arial,sans-serif; text-wrap:balance; margin:0; line-height:1.15; letter-spacing:-.015em}
.mono{font-family:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace}
a{color:var(--roxo-ink)}
:focus-visible{outline:2px solid var(--laranja); outline-offset:3px; border-radius:3px}

/* ---------- topo ---------- */
.topo{border-bottom:1px solid var(--line); background:var(--surface)}
.topo-in{max-width:var(--maxw); margin:0 auto; padding:44px 28px 34px}
.eyebrow{font-family:"IBM Plex Mono",monospace; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--laranja); font-weight:500}
h1{font-size:clamp(30px,4.6vw,46px); font-weight:700; margin:14px 0 0; max-width:22ch}
.sub{max-width:62ch; margin:16px 0 0; color:var(--ink-2); font-size:17.5px}
.meta{display:flex; flex-wrap:wrap; gap:8px 10px; margin-top:22px}
.pill{font-family:"IBM Plex Mono",monospace; font-size:11.5px; padding:5px 10px; border:1px solid var(--line-2); border-radius:999px; color:var(--muted); background:var(--surface-2)}

/* ---------- marca + troca de material ---------- */
.marca{display:flex; align-items:center; gap:14px; margin-bottom:20px}
.marca img{height:40px; width:auto; display:block}
.marca .divisor{width:1px; height:26px; background:var(--line-2)}
.marca .selo{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.troca{display:grid; grid-template-columns:repeat(auto-fit,minmax(146px,1fr)); gap:8px; margin-top:26px; padding-top:22px; border-top:1px solid var(--line)}
.troca a{display:block; text-decoration:none; border:1px solid var(--line-2); border-radius:10px; padding:10px 13px; background:var(--surface-2); color:var(--ink)}
.troca a.atual{background:var(--roxo-soft); border-color:var(--roxo); cursor:default}
.troca a:not(.atual):hover{background:var(--surface-3)}
.troca .gr{display:block; font-family:"IBM Plex Mono",monospace; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:3px}
.troca a.atual .gr{color:var(--roxo-ink)}
.troca .tt{font-family:"Archivo",sans-serif; font-weight:600; font-size:14px; line-height:1.2; display:block}

/* ---------- busca ---------- */
.buscabar{position:sticky; top:0; z-index:20; background:var(--ground); border-bottom:1px solid var(--line)}
.buscabar-in{max-width:var(--maxw); margin:0 auto; padding:12px 28px; display:flex; gap:14px; align-items:center; flex-wrap:wrap}
#busca{
  flex:1 1 260px; min-width:0; font-family:"IBM Plex Mono",monospace; font-size:13.5px;
  padding:9px 13px; border-radius:8px; border:1px solid var(--line-2);
  background:var(--surface); color:var(--ink);
}
#busca::placeholder{color:var(--muted)}
#contador{font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--muted)}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px 90px; display:grid; grid-template-columns:212px minmax(0,1fr); gap:52px; align-items:start}
nav.rail{position:sticky; top:70px; padding:34px 0 0; display:block}
nav.rail ol{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1px}
nav.rail a{
  display:grid; grid-template-columns:26px 1fr; gap:8px; align-items:baseline;
  padding:7px 9px; border-radius:7px; text-decoration:none; color:var(--ink-2);
  font-family:"Archivo",sans-serif; font-size:13.5px; line-height:1.3; border-left:2px solid transparent;
}
nav.rail a:hover{background:var(--surface-2); color:var(--ink)}
nav.rail a.on{background:var(--roxo-soft); color:var(--roxo-ink); border-left-color:var(--roxo); font-weight:600}
nav.rail .n{font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--muted)}
nav.rail a.on .n{color:var(--roxo-ink)}
nav.rail .sep{margin:14px 0 6px 9px; font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
main{padding-top:34px; min-width:0}

/* ---------- travas ---------- */
.travas{border:1px solid var(--line-2); border-radius:14px; background:var(--surface); padding:26px 26px 24px; box-shadow:var(--shadow); margin-bottom:56px}
.travas h2{font-size:20px; font-weight:700}
.travas p.lead{margin:10px 0 22px; color:var(--ink-2); max-width:74ch}
.travas-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:0; border-top:1px solid var(--line)}
.trava{padding:18px 20px 16px; border-bottom:1px solid var(--line); border-right:1px solid var(--line)}
.trava:last-child{border-right:0}
.trava .k{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--laranja); display:block; margin-bottom:7px}
.trava h4{font-size:16px; font-weight:600; margin-bottom:6px}
.trava p{margin:0; font-size:14.5px; color:var(--muted); line-height:1.5}
@media (max-width:720px){.trava{border-right:0}}

/* ---------- fases ---------- */
section.fase{scroll-margin-top:78px; margin-bottom:64px}
.fase-cab{display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start; padding-bottom:16px; border-bottom:2px solid var(--roxo)}
.fase-num{
  font-family:"IBM Plex Mono",monospace; font-weight:600; font-size:13px;
  background:var(--roxo); color:var(--on-roxo); border-radius:7px;
  padding:6px 10px; letter-spacing:.04em; white-space:nowrap;
}
.fase-cab h2{font-size:26px; font-weight:700}
.fase-cab .obj{margin:7px 0 0; color:var(--ink-2); font-size:16.5px; max-width:62ch}
.quem{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-top:9px; display:block}

.fluxo{list-style:none; margin:24px 0 0; padding:0; display:flex; flex-direction:column; gap:0}
.fluxo li{display:grid; grid-template-columns:22px 1fr; gap:14px; padding:0 0 18px; position:relative}
.fluxo li::before{content:""; position:absolute; left:10px; top:20px; bottom:0; width:1px; background:var(--line-2)}
.fluxo li:last-child{padding-bottom:0}
.fluxo li:last-child::before{display:none}
.fluxo .dot{width:21px; height:21px; border-radius:50%; border:1px solid var(--line-2); background:var(--surface); display:grid; place-items:center; font-family:"IBM Plex Mono",monospace; font-size:10.5px; color:var(--muted); z-index:1}
.fluxo strong{font-family:"Archivo",sans-serif; font-weight:600; font-size:16px; display:block; margin-bottom:2px}
.fluxo p{margin:0; color:var(--ink-2); font-size:15.5px; line-height:1.55; max-width:66ch}

.cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(268px,1fr)); gap:18px; margin-top:26px}
.box{border:1px solid var(--line); border-radius:11px; background:var(--surface-2); padding:17px 19px 18px}
.box h4{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:600; margin-bottom:11px}
.box ul{margin:0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:8px}
.box li{font-size:15px; line-height:1.45; padding-left:20px; position:relative; color:var(--ink-2)}
.box li::before{content:""; position:absolute; left:4px; top:.62em; width:6px; height:6px; border-radius:2px; background:var(--roxo)}
.box.entrega li::before{background:var(--verde)}
.box li b{font-weight:600; color:var(--ink)}

.alerta{margin-top:22px; border-left:3px solid var(--laranja); background:var(--laranja-soft); border-radius:0 10px 10px 0; padding:15px 19px}
.alerta h4{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--laranja); margin-bottom:7px}
.alerta p{margin:0 0 8px; font-size:15px; line-height:1.5; color:var(--ink-2); max-width:70ch}
.alerta p:last-child{margin-bottom:0}

/* ---------- excecoes ---------- */
.exc{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; margin-top:26px}
.exc-card{border:1px solid var(--line-2); border-radius:12px; background:var(--surface); padding:19px 20px 18px}
.exc-card h3{font-size:16.5px; font-weight:600; margin-bottom:8px}
.exc-card p{margin:0 0 12px; font-size:15px; color:var(--ink-2); line-height:1.5}
.passos{display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.passos span{font-family:"IBM Plex Mono",monospace; font-size:11.5px; background:var(--surface-3); border:1px solid var(--line); border-radius:6px; padding:3px 8px; color:var(--ink-2)}
.passos i{font-style:normal; color:var(--muted); font-size:12px}

/* ---------- trilha de formação ---------- */
.niveis{display:grid; grid-template-columns:repeat(auto-fit,minmax(186px,1fr)); gap:14px; margin-top:26px}
.nivel{border:1px solid var(--line); border-radius:11px; padding:16px 17px 15px; background:var(--surface)}
.nivel .k{font-family:"IBM Plex Mono",monospace; font-size:11px; font-weight:600; letter-spacing:.1em; display:inline-block; padding:3px 8px; border-radius:5px; margin-bottom:9px}
.nivel h4{font-size:16px; font-weight:600; margin-bottom:6px}
.nivel p{margin:0; font-size:14.5px; line-height:1.5; color:var(--muted)}
.nivel.n1{border-left:3px solid var(--line-2)} .nivel.n1 .k{background:var(--surface-3); color:var(--muted)}
.nivel.n2{border-left:3px solid var(--roxo-soft)} .nivel.n2 .k{background:var(--roxo-soft); color:var(--roxo-ink)}
.nivel.n3{border-left:3px solid var(--roxo)} .nivel.n3 .k{background:var(--roxo); color:var(--on-roxo)}
.nivel.n4{border-left:3px solid var(--laranja)} .nivel.n4 .k{background:var(--laranja-soft); color:var(--laranja)}

.filtros{display:flex; flex-wrap:wrap; gap:7px; margin-top:24px}
.fbt{font-family:"IBM Plex Mono",monospace; font-size:11.5px; padding:6px 12px; border-radius:999px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); cursor:pointer}
.fbt:hover{background:var(--surface-2)}
.fbt.on{background:var(--roxo); color:var(--on-roxo); border-color:var(--roxo)}

.modulos{display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:22px; margin-top:22px}
.modulo{border:1px solid var(--line); border-radius:12px; background:var(--surface); padding:19px 20px 8px}
.mod-cab{padding-bottom:13px; border-bottom:1px solid var(--line)}
.mod-n{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--laranja); display:block; margin-bottom:6px}
.mod-cab h3{font-size:17.5px; font-weight:700; margin-bottom:6px}
.mod-cab p{margin:0 0 8px; font-size:14.5px; color:var(--muted); line-height:1.45}
.mod-resumo{font-family:"IBM Plex Mono",monospace; font-size:10.5px; color:var(--muted); letter-spacing:.04em}
ul.topicos{list-style:none; margin:0; padding:0}
ul.topicos li{display:grid; grid-template-columns:30px 1fr; gap:11px; padding:12px 0; border-bottom:1px solid var(--line)}
ul.topicos li:last-child{border-bottom:0}
.lvl{font-family:"IBM Plex Mono",monospace; font-size:10px; font-weight:600; height:19px; border-radius:5px; display:grid; place-items:center; margin-top:2px}
.lvl.l1{background:var(--surface-3); color:var(--muted)}
.lvl.l2{background:var(--roxo-soft); color:var(--roxo-ink)}
.lvl.l3{background:var(--roxo); color:var(--on-roxo)}
.lvl.l4{background:var(--laranja-soft); color:var(--laranja)}
ul.topicos strong{font-family:"Archivo",sans-serif; font-weight:600; font-size:15px; display:block; margin-bottom:3px; line-height:1.25}
ul.topicos p{margin:0 0 5px; font-size:14px; color:var(--ink-2); line-height:1.45}
.ref{font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}

/* ---------- prazos ---------- */
.prazos{margin-top:22px}
.pz-grupo{margin-bottom:22px}
.pz-grupo > h4{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--laranja); margin-bottom:6px}
.prazo{display:grid; grid-template-columns:114px 1fr; gap:16px; padding:11px 0;
  border-bottom:1px solid var(--line); align-items:baseline}
.prazo:last-child{border-bottom:0}
.prazo .q{font-family:"IBM Plex Mono",monospace; font-size:12.5px; font-weight:600;
  color:var(--roxo-ink); text-align:right; line-height:1.3}
.prazo strong{font-family:"Archivo",sans-serif; font-size:15px; font-weight:600; display:block}
.prazo p{font-size:14.5px; color:var(--muted); line-height:1.45; margin-top:2px; max-width:62ch}

/* ---------- glossario ---------- */
.gloss{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:0 26px; margin-top:22px}
.gitem{padding:13px 0; border-bottom:1px solid var(--line)}
.gitem h4{font-size:15.5px; font-weight:600; margin-bottom:3px}
.gitem .tag{font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:4px}
.gitem p{margin:0; font-size:14.5px; color:var(--ink-2); line-height:1.45}
mark[data-realce]{background:var(--laranja-soft); color:var(--ink); padding:0 2px; border-radius:3px;
  box-shadow:inset 0 -1px 0 var(--laranja); font-weight:inherit}

.vazio{display:none; padding:26px 0; color:var(--muted); font-family:"IBM Plex Mono",monospace; font-size:13px}
.oculto{display:none !important}

footer{border-top:1px solid var(--line); margin-top:20px; padding-top:22px; color:var(--muted); font-size:14px; max-width:70ch}

@media (max-width:900px){
  .wrap{grid-template-columns:1fr; gap:0}
  nav.rail{position:static; padding:26px 0 0}
  nav.rail ol{flex-direction:row; flex-wrap:wrap; gap:6px}
  nav.rail a{border-left:0; border:1px solid var(--line); padding:6px 10px}
  nav.rail .sep{display:none}
  main{padding-top:26px}
}
@media (prefers-reduced-motion: reduce){*{animation:none !important; transition:none !important}}