/* Cadastro público — usa o tema base (app.css). */
.cad-lado { align-items: flex-start; padding: 2.6rem 1.4rem 1rem; }
.cad-wrap { width: 100%; max-width: 440px; margin: auto; animation: lg-entra .35s ease both; }
/* etapa dos planos: sem painel de marca, largura total */
.cad-grid:has(.cad-etapa-larga.ativa) { grid-template-columns: 1fr; }
.cad-grid:has(.cad-etapa-larga.ativa) .lg-marca { display: none; }
.cad-grid:has(.cad-etapa-larga.ativa) .cad-wrap { max-width: 900px; }
.cad-logo { display: none; margin-bottom: 1.4rem; }
.cad-grid:has(.cad-etapa-larga.ativa) .cad-logo { display: inline-block; }
.cad-logo img { height: 38px; display: block; }
.cad-wrap h1 { font-size: 1.7rem; margin: 0 0 .3rem; }
.cad-sub { color: var(--texto-dim); margin: 0 0 1.4rem; font-size: .92rem; }
.cad-erro { background: rgba(240,101,90,.14); color: var(--perigo); border-radius: var(--raio-sm); padding: .7rem 1rem; margin-bottom: 1rem; font-size: .88rem; }
.cad-form { display: flex; flex-direction: column; gap: 1rem; }
.cad-isca { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.cad-planos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .9rem; }
.cad-plano { cursor: pointer; display: block; }
.cad-plano input { position: absolute; opacity: 0; pointer-events: none; }
.cad-plano-card { display: flex; flex-direction: column; gap: .35rem; height: 100%; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); padding: 1rem; transition: border-color .15s, background .15s; }
.cad-plano:hover .cad-plano-card { border-color: var(--texto-faint); }
.cad-plano input:checked + .cad-plano-card { border-color: var(--acento); background: var(--acento-suave); }
.cad-plano input:focus-visible + .cad-plano-card { outline: 2px solid var(--acento); outline-offset: 2px; }
.cad-plano-nome { font-weight: 700; font-size: 1.02rem; }
.cad-plano-preco { font-size: 1.35rem; font-weight: 700; }
.cad-plano-preco small { font-size: .74rem; font-weight: 400; color: var(--texto-faint); }
.cad-plano-depois { font-size: .78rem; color: var(--texto-faint); margin-top: -.25rem; }
.cad-plano-lim { font-size: .82rem; color: var(--texto-dim); }
.cad-plano-desc { font-size: .78rem; color: var(--texto-faint); }
.cad-plano-ferr { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .2rem; }
.cad-plano-ferr span { font-size: .68rem; padding: .15rem .5rem; border-radius: 999px; background: var(--acento-suave); color: var(--acento); }

/* ---- Etapas (JS liga .com-js; sem JS todas as etapas aparecem empilhadas) ---- */
.cad-progresso { margin-bottom: 1.6rem; }
.cad-progresso-topo { display: flex; justify-content: space-between; font-size: .78rem; color: var(--texto-faint); margin-bottom: .5rem; }
.cad-progresso-topo a { color: var(--acento); }
.cad-barra { height: 4px; background: var(--borda); border-radius: 999px; overflow: hidden; }
.cad-barra-preenchida { height: 100%; width: 20%; background: var(--acento); border-radius: 999px; transition: width .25s ease; }
.cad-etapa { display: flex; flex-direction: column; gap: .7rem; }
.com-js .cad-etapa { display: none; }
.com-js .cad-etapa.ativa { display: flex; animation: cad-entra .2s ease; }
@keyframes cad-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .com-js .cad-etapa.ativa { animation: none; } .cad-barra-preenchida { transition: none; } }
.cad-etapa h1 { font-size: 1.6rem; margin: 0; }
.cad-etapa .cad-sub { margin: 0 0 .4rem; }
.cad-input { margin: 0; font-size: 1.05rem; padding: .85rem 1rem; }
.cad-msg { min-height: 1.1em; font-size: .82rem; color: var(--perigo); }
.cad-senha { position: relative; }
.cad-senha .cad-input { padding-right: 5.5rem; width: 100%; }
.cad-ver { position: absolute; right: .5rem; top: 50%; transform: translateY(-50%); background: none; border: 0; color: var(--acento); font-size: .8rem; cursor: pointer; padding: .4rem .5rem; }
.cad-acoes { display: flex; gap: .7rem; margin-top: 1.2rem; position: sticky; bottom: 0; padding: .8rem 0 1rem; background: linear-gradient(to bottom, transparent, var(--bg) 40%); }
.cad-acoes .btn { flex: 1; justify-content: center; padding: .85rem 1rem; }
.cad-acoes .btn.secundario { flex: 0 0 auto; }
.cad-acoes [hidden] { display: none; }

.cad-aviso { font-size: .74rem; color: var(--texto-faint); margin: 1rem 0 0; }
.captcha-box { display: flex; justify-content: center; min-height: 65px; margin-top: .4rem; }

/* ---- Visual alinhado ao login ---- */
.cad-input { border-radius: 12px; }
.cad-input::placeholder { color: var(--texto-faint); }
.cad-input:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px var(--acento-suave); }
.cad-etapa h1 { letter-spacing: -.02em; }
.cad-barra { height: 6px; }
.cad-barra-preenchida { background: linear-gradient(90deg, var(--acento-2), var(--acento)); box-shadow: 0 0 12px rgba(34,230,160,.5); }
.cad-acoes .btn:not(.secundario) {
    border-radius: 12px; font-size: 1rem; font-weight: 700; justify-content: center;
    background: linear-gradient(135deg, var(--acento), var(--acento-2));
    box-shadow: 0 8px 24px -8px rgba(34,230,160,.55); transition: filter .15s, transform .12s;
}
.cad-acoes .btn:not(.secundario):hover { filter: brightness(1.06); }
.cad-acoes .btn:not(.secundario):active { transform: translateY(1px); }
.cad-acoes .btn.secundario { border-radius: 12px; }
.cad-plano-card { border-radius: 14px; padding: 1.2rem; }
.cad-plano input:checked + .cad-plano-card { box-shadow: 0 0 0 1px var(--acento), 0 10px 30px -14px rgba(34,230,160,.5); }
.cad-plano-preco { letter-spacing: -.02em; }
@media (max-width: 900px) {
    .cad-lado { background: radial-gradient(ellipse at 50% -10%, rgba(34,230,160,.16), transparent 60%); }
    .cad-logo { display: inline-block; }
    .cad-wrap { margin: 0 auto; }
}
