/* layout.css — Estrutura geral da página: <main> (deslocado pela barra lateral fixa), troca de telas (.view), animação de entrada e tipografia comum das páginas. */

main{margin-left:var(--sidebar-w);padding:1.75rem 0 3rem}
.view{display:none;animation:fade .25s}
.view.active{display:block}
@keyframes fade{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:none}
}
h2.page{font-size:2.1rem;margin-bottom:.3rem}
.sub{color:var(--muted);margin-bottom:1.5rem}
h3.sec{font-size:1.15rem;margin:2.4rem 0 1rem}

/* Telas cheias sem barra lateral (body.finish = conclusão, body.auth = login/recuperar): fundo escuro.
   Só a conclusão tem fundo escuro e os dois círculos decorativos; as telas de acesso têm o próprio visual (css/pages/auth.css). */
body.finish{background:var(--header)}
body.finish .sidebar,body.auth .sidebar,body.finish .topbar,body.auth .topbar{display:none}
body.finish main,body.auth main{margin-left:0;padding:0;min-height:100vh;display:grid;place-items:center}
body.finish::before,body.finish::after{content:"";position:fixed;border-radius:50%;z-index:0}
body.finish::before{width:520px;height:520px;left:-200px;top:-220px;background:var(--header-2)}
body.finish::after{width:460px;height:460px;right:-170px;bottom:-200px;background:var(--circle-2)}