/* Azulume — conta e onboarding (MCL-604). Estrutura emprestada do cadastro da rocketmoney.com (cartão grande dividido em dois: mensagem à esquerda, formulário à direita,
   fita de etapas no alto das telas de objetivos, contas e plano). Cores, tipo e textos são do Azulume; nenhum asset de terceiros. Só classes: a CSP não aceita style= no HTML. */
.onb-corpo{background:var(--nevoa2)}
.onb-corpo nav .mini-botao{display:inline-block}            /* no celular o estilo base esconde o botão do topo; aqui Entrar e Sair têm de ficar */
.onb-corpo nav a:nth-child(1){display:none}
@media (min-width:681px){.onb-corpo nav a:nth-child(1){display:inline-block}}

.onb{padding:20px 12px 56px}
@media (min-width:760px){.onb{padding:40px 20px 80px}}
.onb-cartao{max-width:1040px;margin:0 auto;background:var(--papel);border:1px solid var(--linha);border-radius:var(--raio-c);box-shadow:var(--sombra);overflow:hidden}
.onb-cartao-curto{max-width:920px}

/* fita de etapas */
.onb-passos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--linha);background:var(--papel)}
.onb-passos li{padding:16px 6px;text-align:center;font-size:12px;line-height:1.25;font-weight:700;color:#8A97AD;border-bottom:3px solid transparent}
@media (min-width:760px){.onb-passos li{font-size:15px;padding:22px 10px}}
.onb-passos li.atual{color:var(--azul2);border-bottom-color:var(--azul)}
.onb-passos li.feito{color:var(--cinza)}
.onb-passos li.feito::before{content:"✓ ";color:var(--verde)}
.onb-passos li.desligado{opacity:.7}

/* as duas metades */
.onb-tela{display:grid;grid-template-columns:minmax(0,1fr)}
@media (min-width:860px){.onb-tela{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:560px}.onb-tela-larga{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}
.onb-lado{background:var(--noite);color:var(--papel);padding:36px 24px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.onb-lado::after{content:"";position:absolute;right:-120px;bottom:-140px;width:420px;height:420px;border-radius:50%;background:radial-gradient(closest-side,rgba(240,182,74,.2),rgba(240,182,74,0));pointer-events:none}
@media (min-width:860px){.onb-lado{padding:56px 48px}}
.onb-lado-claro{background:var(--nevoa);color:var(--tinta)}
.onb-lado-claro::after{display:none}
.onb-lado h1{font-size:34px;max-width:13ch;margin:0 0 14px}
@media (min-width:860px){.onb-lado h1{font-size:46px}}
.onb-lado .onb-h1-pequeno{font-size:32px;max-width:14ch;color:var(--noite)}
@media (min-width:860px){.onb-lado .onb-h1-pequeno{font-size:40px}}
.onb-sub{color:rgba(255,255,255,.8);font-size:18px;line-height:1.5;max-width:40ch;margin:0 0 18px}
.onb-sub-escuro{color:var(--cinza)}
.onb-lista{list-style:none;margin:6px 0 0;padding:0;color:rgba(255,255,255,.86);font-size:16px}
.onb-lista li{position:relative;padding:0 0 0 24px;margin:0 0 10px}
.onb-lista li::before{content:"";position:absolute;left:0;top:10px;width:12px;height:3px;background:var(--lume);border-radius:2px}
.onb-selo{display:inline-block;background:var(--papel);border:1px solid var(--linha);border-radius:var(--pilula);padding:8px 14px;font-size:14px;font-weight:600;color:var(--noite);max-width:none}
.onb-form{padding:28px 20px 32px;background:var(--papel);min-width:0}
@media (min-width:860px){.onb-form{padding:48px 44px;display:flex;flex-direction:column;justify-content:center}}
.onb-intro{color:var(--cinza);font-size:15px;margin:0 0 18px}
.onb-termos{background:var(--nevoa2);border:1px solid var(--linha);border-radius:var(--raio);padding:14px;margin:6px 0 18px}
.onb-troca{text-align:center;margin:16px 0 0;font-size:15px}
.onb-troca a,.onb-troca .link-media{font-weight:700;font-size:15px;text-align:center}

/* senha */
.senha-caixa{display:flex;align-items:stretch;border:1.5px solid var(--linha);border-radius:var(--raio);overflow:hidden;background:var(--papel)}
.senha-caixa:focus-within{border-color:var(--azul);box-shadow:0 0 0 3px rgba(31,79,178,.18)}
.senha-caixa input{border:0;border-radius:0;box-shadow:none}.senha-caixa input:focus{box-shadow:none}
.senha-ver{flex:none;border:0;border-left:1.5px solid var(--linha);background:var(--nevoa);color:var(--azul2);font:inherit;font-size:14px;font-weight:700;padding:0 14px;cursor:pointer}
.senha-ver:hover{background:var(--azul3)}

/* respostas em lista (como soube, momento) */
.onb-opcoes{display:grid;gap:10px;margin:0 0 22px}
.onb-opcao{display:flex;align-items:center;gap:12px;margin:0;padding:14px 16px;border:1.5px solid var(--linha);border-radius:var(--raio);cursor:pointer;font-weight:600;background:var(--papel)}
.onb-opcao:hover{border-color:var(--azul)}
.onb-opcao input{width:20px;height:20px;min-height:0;margin:0;accent-color:var(--azul);flex:none}
.onb-opcao:has(input:checked){border-color:var(--azul);background:var(--azul3);box-shadow:0 0 0 3px rgba(31,79,178,.12)}
.onb-opcao:has(input:focus-visible){outline:3px solid var(--lume);outline-offset:2px}

/* objetivos em cartões com ícone */
.onb-cartoes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 22px}
@media (min-width:520px){.onb-cartoes{grid-template-columns:1fr 1fr 1fr}}
.onb-ico{position:relative;display:flex;flex-direction:column;gap:12px;margin:0;padding:16px 14px 14px;min-height:124px;border:1.5px solid var(--linha);border-radius:var(--raio-g);background:var(--papel);cursor:pointer;font-weight:600;font-size:15px;line-height:1.3;box-shadow:var(--sombra)}
.onb-ico:hover{border-color:var(--azul)}
.onb-ico input{position:absolute;right:12px;top:12px;width:20px;height:20px;min-height:0;margin:0;accent-color:var(--azul)}
.onb-ico svg{width:26px;height:26px;fill:none;stroke:var(--azul);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.onb-ico:has(input:checked){border-color:var(--azul);background:var(--azul3)}
.onb-ico:has(input:focus-visible){outline:3px solid var(--lume);outline-offset:2px}

/* contas */
.onb-grupos{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:10px}
.onb-grupo{border:1.5px solid var(--linha);border-radius:var(--raio-g);background:var(--papel);box-shadow:var(--sombra)}
.onb-grupo.tem{border-color:var(--verde)}
.onb-grupo-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.onb-grupo-nome{display:flex;align-items:center;gap:12px;font-weight:700;font-size:16px;line-height:1.25}
.onb-grupo-nome small{display:block;font-weight:400;color:var(--cinza);font-size:13px}
.onb-grupo-nome svg{width:26px;height:26px;flex:none;fill:none;stroke:var(--azul);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.onb-grupo .botao{width:auto;min-width:0;margin:0;padding:9px 18px;font-size:15px;background:var(--noite)}
.onb-nova{border:1.5px solid var(--azul);border-radius:var(--raio-g);padding:18px;margin:0 0 16px;background:var(--nevoa2)}
.onb-nova-titulo{font-family:var(--serif);font-size:20px;color:var(--noite);margin:0 0 14px}
.onb-nova-botoes{display:flex;gap:10px;flex-wrap:wrap}
.onb-nova-botoes .botao{width:auto;min-width:0;flex:1 1 140px}
.onb-salvas{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.onb-salva{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--linha);border-radius:var(--raio);background:var(--papel)}
.onb-salva-info b{display:block}.onb-salva-info small{color:var(--cinza);font-size:14px}
.onb-of{background:var(--nevoa2);border:1px solid var(--linha);border-radius:var(--raio);padding:14px;margin:8px 0 18px}

/* planos */
.onb-planos{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
@media (min-width:640px) and (max-width:859px){.onb-planos{grid-template-columns:repeat(2,minmax(0,1fr))}} /* tela estreita: a metade do cartão some, os dois planos ficam lado a lado */
@media (min-width:1180px){.onb-planos{grid-template-columns:repeat(2,minmax(0,1fr))}}
.onb-plano{border:1.5px solid var(--linha);border-radius:var(--raio-g);padding:22px 20px;background:var(--papel);display:flex;flex-direction:column}
.onb-plano.destaque{border-color:var(--azul);box-shadow:0 0 0 3px rgba(31,79,178,.12)}
.onb-plano-nome{font-family:var(--serif);font-weight:500;font-size:24px;color:var(--noite);margin:0 0 4px;max-width:none}
.onb-plano-nome::before{display:none}
.onb-plano-preco{font-family:var(--serif);font-size:34px;color:var(--noite);margin:0 0 14px}
.onb-plano-preco small{font-family:var(--sans);font-size:14px;color:var(--cinza)}
.onb-lista-escura{list-style:none;margin:0 0 18px;padding:0;font-size:15.5px;flex:1}
.onb-lista-escura li{position:relative;padding:0 0 0 22px;margin:0 0 8px}
.onb-lista-escura li::before{content:"";position:absolute;left:0;top:9px;width:11px;height:3px;background:var(--lume);border-radius:2px}
.onb-plano .botao{width:100%}

/* Minha conta */
.conta{max-width:760px;padding-top:36px;padding-bottom:64px}
.conta-titulo{color:var(--noite);max-width:none;font-size:38px}
.conta-sub{color:var(--cinza)}
.conta-bloco{margin:0 0 18px}
.conta-h2{font-size:24px;max-width:none;margin:0 0 14px}
.conta-h2::before{display:none}
.conta-bloco .botao{margin:0 8px 8px 0}
.conta-resumo{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 16px}
.conta-resumo div{background:var(--noite);color:var(--papel);border-radius:var(--raio);padding:14px 16px}
.conta-resumo b{display:block;font-family:var(--serif);font-weight:500;font-size:26px;line-height:1.1}
.conta-resumo span{display:block;font-size:13px;color:rgba(255,255,255,.75);margin-top:4px}
.conta-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--azul3);color:var(--azul2);border-radius:var(--pilula);padding:8px 14px;font-size:15px;font-weight:600}
.chip.vazio{background:var(--nevoa);color:var(--cinza);font-weight:400}
.conta-excluir{margin-top:18px}

/* termos e privacidade */
.texto-legal{max-width:760px}
.texto-legal h1{color:var(--noite);max-width:none;font-size:38px}
.texto-legal .h2-simples{font-size:22px;max-width:none;margin:30px 0 8px}
.texto-legal .h2-simples::before{display:none}
.texto-legal ul{padding-left:22px}.texto-legal li{margin:0 0 8px}
