/* Peças do site completo no visual v2 (além de estilo_v2.css) */
html{scroll-behavior:smooth}
section{padding:56px 0;scroll-margin-top:60px}
.capitulo{padding:40px 0 56px;scroll-margin-top:60px}
.capitulo:nth-of-type(even){background:#e3edfb}
.cab{display:flex;flex-direction:column;gap:6px;margin-bottom:24px}.cab p{margin:0;max-width:760px}
.hud .stats{display:flex;gap:16px;font:700 13px/1.2 var(--txt);color:#c9d3f0}.hud .stats em{font-style:normal;color:var(--ouro)}.hud .stats b{color:#ff8a73}
.hud nav{display:flex;gap:4px}.hud nav a{color:#fff;text-decoration:none;font:700 14px var(--txt);padding:8px 10px;border:2px solid transparent}.hud nav a:hover{border-color:var(--ouro)}

/* abertura */
.abertura{position:relative;min-height:min(92vh,780px);background:#6f9fe0 url(img16/abertura_viaduto_h.webp) center/cover;display:flex;align-items:center;overflow:hidden;border-bottom:5px solid var(--tinta)}
.abertura .wrap{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:1.3fr .7fr;gap:24px;align-items:center;padding-top:40px;padding-bottom:40px}
.caixa{background:var(--tinta);color:#fff;border:4px solid #fff;outline:4px solid var(--tinta);padding:22px 24px}
.titulo{text-align:center}
.titulo .press{font:400 22px/1 var(--jog);color:var(--ouro);letter-spacing:2px;animation:pisca 1s steps(2) infinite}
@keyframes pisca{50%{opacity:.35}}
.titulo h1{margin:6px 0 0;font:400 clamp(44px,7vw,86px)/.95 var(--jog);letter-spacing:1px;color:var(--ouro);text-shadow:4px 4px 0 #000}
.titulo .sub{font:700 15px/1.4 var(--txt);margin-top:10px;color:#dfe6ff}
.titulo p{text-align:left;font-size:18px;margin:14px auto 0;max-width:600px}
.menu{margin:18px auto 0;max-width:520px;text-align:left;background:#0a1433;border:3px solid #fff;padding:12px 14px}
.menu-tit{font:700 13px var(--txt);letter-spacing:1px;color:#aab6da;text-transform:uppercase;margin-bottom:4px}
.menu button{display:flex;width:100%;gap:12px;background:none;border:0;color:#fff;font:400 22px/1.1 var(--jog);letter-spacing:1px;padding:6px 4px;cursor:pointer;text-align:left}
.menu button small{display:block;font:15px/1.3 var(--txt);color:#cfd6ea;letter-spacing:0}
.menu button .seta{width:14px;color:var(--ouro);visibility:hidden}
.menu button[aria-pressed=true]{color:var(--ouro)}.menu button[aria-pressed=true] .seta{visibility:visible}
.menu .hard{color:#ff8a73}
.ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:18px}
.btn{display:inline-block;font:400 26px/1 var(--jog);letter-spacing:1px;text-decoration:none;padding:10px 20px;background:var(--ouro);color:var(--tinta);border:4px solid #fff;outline:3px solid var(--tinta);box-shadow:6px 6px 0 rgba(0,0,0,.35)}
.btn.sec{background:#fff}
.antunes{display:flex;flex-direction:column;align-items:center}
.antunes img{width:min(300px,80%);filter:drop-shadow(6px 6px 0 rgba(0,0,0,.4));animation:anda 1.2s steps(2) infinite}
.fala{font-size:17px;line-height:1.45;margin-bottom:12px;max-width:340px;position:relative}
.fala b{display:block;font:700 13px var(--txt);letter-spacing:1px;color:var(--ouro);margin-bottom:4px}
.digita{border-right:3px solid var(--ouro)}
.capivara{position:absolute;right:2%;bottom:0;width:130px;z-index:2}

/* seleção de chefões */
.selecao{background:#dce8fb}
.grade-chefes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.chefe-card{position:relative;display:flex;flex-direction:column;text-decoration:none;color:var(--tinta);background:#fff;border:3px solid var(--tinta);box-shadow:6px 6px 0 var(--tinta);transition:transform .1s}
.chefe-card:hover,.chefe-card:focus-visible{transform:translate(-3px,-3px)}
.chefe-card .retrato{aspect-ratio:1;background:linear-gradient(180deg,#bfe3ff,#eef5ff);display:grid;place-items:center;border-bottom:3px solid var(--tinta);overflow:hidden}
.chefe-card .retrato img{width:94%;animation:anda 1.4s steps(2) infinite}
.chefe-card.final{border-color:var(--verm);box-shadow:6px 6px 0 var(--verm)}
.chefe-card.final .retrato{background:linear-gradient(180deg,#ffd9d2,#fff4f1)}
.chefe-card .info{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px}
.chefe-card .nome{font:400 24px/1 var(--jog);letter-spacing:1px}
.chefe-card .tema{font:700 13px var(--txt);color:var(--azul)}
.chefe-card .golpe{font-size:15px;line-height:1.35}
.chefe-card .num{position:absolute;top:8px;left:8px;background:var(--ouro);border:3px solid var(--tinta);font:400 18px/1 var(--jog);padding:4px 8px}
.chefe-card .hp{color:var(--tinta)}.chefe-card .hp .barra{border-color:var(--tinta);background:#e6ebf7}

/* placar */
.placar{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px}
.card-placar{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--tinta);background:#fff;border:3px solid var(--tinta);box-shadow:6px 6px 0 var(--tinta);padding:16px 18px}
.card-placar .topo{display:flex;justify-content:space-between}.card-placar .val{font:400 clamp(38px,4vw,48px)/1 var(--jog);letter-spacing:1px}.card-placar p{margin:0;font-size:17px}
.card-placar .mais{font:700 14px var(--txt);color:var(--azul);margin-top:auto}
.novo{background:var(--verm);color:#fff;font:700 12px var(--txt);padding:3px 8px;animation:pisca 1s steps(2) infinite}
.velho{display:inline-block;margin-top:8px;background:var(--ouro);color:var(--tinta);font:700 13px var(--txt);padding:4px 8px}

/* capítulos */
.paineis{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.paineis .bloco{grid-column:1/-1}.paineis .bloco.meia{grid-column:auto}
.paineis>*{min-width:0}
.grafico{background:#fff}
.grafico svg{width:100%;height:auto;display:block;shape-rendering:crispEdges}
.grafico svg text{font-family:var(--txt);fill:#4a5578}
.leg{display:flex;flex-wrap:wrap;gap:6px 14px;font:15px var(--txt);margin-top:8px}
.leg button{background:none;border:2px solid transparent;color:var(--tinta);font:inherit;padding:4px 6px;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.leg button[aria-pressed=false]{opacity:.35}
.leg i{width:14px;height:14px;border:2px solid var(--tinta);display:inline-block;vertical-align:-2px;margin-right:4px}
.dica{min-height:22px;font:700 15px/1.4 var(--txt);color:var(--azul);margin:6px 0 0}
.filtros input[type=search]{font:16px var(--txt);padding:6px 8px;border:3px solid var(--tinta);min-width:0;width:100%;max-width:280px}
.detalhe{display:none}body[data-modo=hard] .detalhe{display:block}
body[data-modo=facil] .so-normal{display:none}
.tabela{width:100%;border-collapse:collapse;font-size:15px}
.tabela th,.tabela td{border:2px solid var(--tinta);padding:6px 8px;text-align:left}
.tabela th{background:var(--ouro);font:700 14px var(--txt)}
.rolagem{overflow-x:auto}

/* grade de plantões */
.grade-escala{overflow-x:auto;font-size:14px}
.ge-linha{display:grid;grid-template-columns:minmax(150px,240px) repeat(var(--n,17),minmax(18px,1fr));gap:2px;align-items:center;margin-bottom:2px}
.ge-linha span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:6px}
.ge-linha i{display:block;height:20px;border:1px solid #c5cde3}
.ge-cab b{font:700 11px var(--txt);text-align:center;color:var(--suave)}

/* chefão final */
.trilha{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.etapa{background:var(--tinta);color:#fff;border:3px solid #fff;outline:3px solid var(--tinta);padding:14px;display:flex;flex-direction:column;gap:6px}
.etapa .rot-e{font:700 13px var(--txt);letter-spacing:1px;text-transform:uppercase;color:var(--ouro)}
.etapa .v{font:400 40px/1 var(--jog)}.etapa p{margin:0;font-size:15px}.etapa small{font-size:13px;color:#cfd6ea}

/* câmara e mudanças */
.relatorio{display:flex;gap:12px;border:3px solid var(--tinta);padding:12px;margin-bottom:10px}
.relatorio .ico{font:400 26px/1 var(--jog);background:var(--verm);color:#fff;padding:6px 8px;align-self:flex-start}
.vazio{border:3px dashed var(--cinza);padding:14px;background:#f6f8fd}
.emendas{display:flex;flex-direction:column;gap:8px;max-height:560px;overflow:auto;padding-right:4px}
.emenda{border:2px solid var(--tinta);padding:8px 10px;font-size:15px;line-height:1.35}
.emenda .topo-e{display:flex;justify-content:space-between;gap:8px}.emenda .num{font:400 22px/1 var(--jog);white-space:nowrap}.emenda small{color:var(--suave)}
.mudanca div{margin:3px 0}
footer{background:var(--tinta);color:#c9d3f0;font-size:14px;padding:24px 0}
footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

@media (max-width:1000px){.grade-chefes{grid-template-columns:repeat(2,1fr)}.trilha{grid-template-columns:1fr 1fr}}
@media (max-width:860px){
  .abertura{background-image:url(img16/abertura_viaduto_v.webp);min-height:auto}
  .abertura .wrap{grid-template-columns:1fr}
  .antunes{order:-1;flex-direction:row-reverse;align-items:flex-end;gap:8px}
  .antunes img{width:110px;flex:none}.fala{font-size:15px;margin:0}
  .capivara{width:80px}
  .paineis{grid-template-columns:1fr}.paineis .bloco.meia{grid-column:1/-1}
  .hud .stats{display:none}
}
@media (max-width:640px){
  .hud nav{display:none}
  .chefe-card .golpe{display:none}.chefe-card .nome{font-size:20px}
  .trilha{grid-template-columns:1fr}
  .ge-linha{grid-template-columns:120px repeat(var(--n,17),16px)}
}

.badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 700; }
.b-verde { background: #dcfce7; color: #166534; }
.b-amarelo { background: #fef9c3; color: #854d0e; }
.b-vermelho { background: #fee2e2; color: #991b1b; }
.b-cinza { background: #f1f5f9; color: #475569; }
.sem-sprite{font:400 120px/1 var(--jog);color:var(--azul)}

/* apresentação em vídeo: 16:9 no computador, 9:16 no celular */
.video-abertura {
  margin: 22px auto 16px;
  max-width: 640px;
  text-align: left;
}
.video-abertura video {
  width: 100%;
  display: block;
  border-radius: 6px;
  background: #000;
  border: 3px solid #fff;
  box-shadow: 4px 4px 0 rgba(0,0,0,0.4);
}
.video-abertura .so-celular {
  display: none !important;
  width: auto;
  max-width: 100%;
  max-height: 72vh;
  margin: 0 auto;
}
.video-abertura .so-celular-link {
  display: none !important;
}
.video-abertura figcaption {
  font-size: 13px;
  color: #c9d3f0;
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: center;
}
.baixar-video {
  font-weight: 700;
  color: var(--ouro);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  white-space: nowrap;
}
.baixar-video::before {
  content: "↓ ";
}

@media (max-width: 760px) {
  .video-abertura .so-desk,
  .video-abertura .so-desk-link {
    display: none !important;
  }
  .video-abertura .so-celular {
    display: block !important;
  }
  .video-abertura .so-celular-link {
    display: inline-block !important;
  }
  .video-abertura {
    max-width: 100%;
  }
}

/* MENU MOBILE EFICIENTE */
.menu-btn-mobile {
  display: none;
  background: var(--ouro);
  color: var(--tinta);
  border: 2px solid #fff;
  font: 800 14px/1 var(--txt);
  padding: 6px 12px;
  border-radius: 4px;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  box-shadow: 2px 2px 0 #000;
}
.menu-btn-mobile:active {
  transform: translate(1px, 1px);
  box-shadow: 1px 1px 0 #000;
}

@media (max-width: 760px) {
  .menu-btn-mobile {
    display: inline-flex;
  }
}

/* Drawer / Modal de Navegação Rápida */
.menu-mobile-drawer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(10, 20, 51, 0.96);
  backdrop-filter: blur(8px);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  padding: 16px;
  overflow-y: auto;
  color: #fff;
}
.menu-mobile-drawer[hidden] {
  display: none !important;
}
.drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid var(--ouro);
  padding-bottom: 10px;
  margin-bottom: 14px;
}
.drawer-tit {
  font: 400 22px/1 var(--jog);
  color: var(--ouro);
  letter-spacing: 1px;
}
.drawer-fechar {
  background: var(--verm);
  color: #fff;
  border: 2px solid #fff;
  font: 800 13px/1 var(--txt);
  padding: 6px 12px;
  border-radius: 4px;
  cursor: pointer;
}
.drawer-grupo-tit {
  font: 700 12px var(--txt);
  letter-spacing: 1.5px;
  color: #aab6da;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.drawer-links-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
.drawer-btn {
  background: rgba(255, 255, 255, 0.08);
  border: 2px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  text-decoration: none;
  font: 700 14px/1.3 var(--txt);
  padding: 10px;
  border-radius: 6px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.drawer-btn:active {
  background: var(--ouro);
  color: var(--tinta);
  border-color: #fff;
}
.drawer-chefes-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.drawer-chefe-card {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.06);
  border: 2px solid rgba(255, 255, 255, 0.15);
  color: #fff;
  text-decoration: none;
  padding: 8px 12px;
  border-radius: 6px;
}
.drawer-chefe-card.final {
  border-color: var(--ouro);
  background: rgba(255, 201, 60, 0.12);
}
.drawer-chefe-card .ch-ico {
  font-size: 22px;
  flex: none;
}
.drawer-chefe-card b {
  display: block;
  font: 400 19px/1.1 var(--jog);
  color: var(--ouro);
  letter-spacing: 0.5px;
}
.drawer-chefe-card small {
  display: block;
  font-size: 13px;
  color: #c9d3f0;
}
.drawer-chefe-card:active {
  background: var(--ouro);
  color: var(--tinta);
}
.drawer-chefe-card:active b,
.drawer-chefe-card:active small {
  color: var(--tinta);
}

/* Botão Flutuante Rápido de Menu no Mobile */
.btn-flutuante-menu {
  display: none;
  position: fixed;
  bottom: 18px;
  right: 18px;
  z-index: 900;
  background: var(--ouro);
  color: var(--tinta);
  border: 3px solid var(--tinta);
  font: 800 14px/1 var(--txt);
  padding: 10px 16px;
  border-radius: 50px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35);
  cursor: pointer;
  align-items: center;
  gap: 6px;
}
@media (max-width: 760px) {
  .btn-flutuante-menu.visivel {
    display: inline-flex;
  }
}
