:root { --roxo: #7C3AED; --ciano: #22d3ee; --bg: #f0efff; --card: #ffffff; --borda: #e4e2f8; --txt: #1e1b4b; --muted: #6b7280; --erro: #dc2626; --sucesso: #16a34a; --botao-primario-bg: #7C3AED; --botao-primario-txt: #ffffff; --botao-secundario-bg: #ffffff; --botao-secundario-txt: #7C3AED; --botao-secundario-borda: #7C3AED; } * { box-sizing: border-box; } /* .form-hint (display:block) tem a mesma especificidade do [hidden] nativo do navegador e vem depois no CSS — sem isso, elementos com o atributo hidden (ex.: mensagem de erro do e-mail) apareceriam mesmo escondidos via JS. */ [hidden] { display: none !important; } body { margin: 0; padding-top: 64px; background: var(--bg); color: var(--txt); font-family: 'Segoe UI', Arial, sans-serif; } a { color: inherit; text-decoration: none; } /* Topo */ .topo-fixo { position: fixed; top: 0; left: 0; right: 0; height: 64px; background: #fff; border-bottom: 1px solid var(--borda); box-shadow: 0 1px 6px rgba(30, 27, 75, .06); z-index: 100; transition: transform .25s ease; } /* Some ao rolar pra baixo (só mobile, ver