/* Página pública /baixar. Usa os tokens de style.css; aqui a página rola (o app trava o body). */
html:has(body.pagina-baixar) { height: auto; }
body.pagina-baixar {
  height: auto;
  min-height: 100%;
  overflow: auto;
  font-size: 15px;
  line-height: 1.55;
  background:
    radial-gradient(900px 420px at 15% -10%, rgba(168, 85, 247, .22), transparent 70%),
    radial-gradient(700px 360px at 95% 0%, rgba(34, 211, 238, .12), transparent 70%),
    var(--bg);
}
.pagina-baixar main { max-width: 880px; margin: 0 auto; padding: 0 16px 48px; display: grid; gap: 20px; }
.pagina-baixar h1, .pagina-baixar h2 { font-family: Orbitron, Inter, "Segoe UI", sans-serif; letter-spacing: .01em; margin: 0; }
.pagina-baixar h2 { font-size: 18px; margin-bottom: 10px; }
.pagina-baixar code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .92em; background: var(--surface-3); border-radius: 6px; padding: 1px 6px; }
.pagina-baixar a { color: var(--accent-2); }

.bx-topo { max-width: 880px; margin: 0 auto; padding: 18px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.bx-topo .chip { color: var(--text); text-decoration: none; }
.bx-logo img { display: block; height: 36px; width: auto; }

.bx-hero { padding: 28px 0 8px; display: grid; gap: 12px; }
.bx-selo { margin: 0; color: var(--accent-2); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .12em; }
.bx-hero h1 { font-size: clamp(26px, 5vw, 40px); line-height: 1.15; }
.bx-lead { margin: 0; color: var(--muted); font-size: 17px; max-width: 60ch; }
.bx-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 6px; }
.pagina-baixar .bx-botao { width: auto; text-decoration: none; color: #fff; display: inline-flex; padding: 14px 26px; font-size: 16px; box-shadow: 0 10px 30px rgba(168, 85, 247, .35); }
.pagina-baixar .bx-botao[aria-disabled="true"] { background: var(--surface-3); color: var(--muted); box-shadow: none; pointer-events: none; }
.bx-navegador { font-size: 14px; }
.bx-detalhes { margin: 0; color: var(--text); font-weight: 600; }
.bx-requisitos { margin: 0; color: var(--muted); font-size: 13px; }

.bx-vantagens, .bx-aviso, .bx-antivirus, .bx-hash {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px;
}
.bx-vantagens ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.bx-vantagens li { background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 14px; display: grid; gap: 6px; align-content: start; }
.bx-vantagens strong { color: var(--text); }
.bx-vantagens span { color: var(--muted); font-size: 14px; }

.bx-aviso { display: grid; grid-template-columns: 1fr minmax(220px, 300px); gap: 8px 24px; align-items: start; }
.bx-aviso > h2, .bx-aviso > p { grid-column: 1 / -1; margin-top: 0; }
.bx-aviso p, .bx-antivirus p { color: var(--muted); }
.bx-passos { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.bx-passos strong { color: var(--accent-2); }

/* Esquema do aviso do Windows (ilustração, sem marca de terceiros). */
.bx-ilustracao { align-self: center; }
.bx-janela { background: #1b4f8a; border-radius: 8px; padding: 16px; color: #fff; font-size: 13px; box-shadow: var(--shadow); }
.bx-janela p { margin: 0 0 8px; color: #fff; }
.bx-janela-titulo { font-size: 16px; font-weight: 700; }
.bx-janela-texto { opacity: .85; }
.bx-janela-botoes { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; }
.bx-janela-botoes span { border: 1px solid rgba(255, 255, 255, .6); padding: 5px 10px; border-radius: 4px; }
.bx-marca { outline: 2px solid var(--warn); outline-offset: 3px; border-radius: 4px; text-decoration: underline; }
.bx-janela-botoes .bx-marca { text-decoration: none; }

.bx-antivirus ul { margin: 0; padding-left: 20px; display: grid; gap: 6px; }

.bx-hash-linha { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.bx-hash-linha code { flex: 1 1 280px; min-width: 0; overflow-wrap: anywhere; padding: 10px 12px; font-size: 13px; }
.bx-dica { margin: 10px 0 0; color: var(--muted); font-size: 13px; }

.bx-rodape { text-align: center; padding: 8px 16px 32px; font-size: 14px; }

@media (max-width: 640px) {
  .bx-aviso { grid-template-columns: 1fr; }
  .pagina-baixar .bx-botao { width: 100%; justify-content: center; }
  .bx-topo .bx-logo img { height: 30px; }
}