.form-page{min-height:100vh}
.form-main{display:flex;justify-content:center;padding:64px 20px 90px}
.form-shell{width:100%;max-width:580px}

.form-intro{text-align:center;margin-bottom:36px;animation:fadeUp .6s ease both}
.form-intro .eyebrow{display:block;margin-bottom:14px}
.form-intro h1{font-size:clamp(1.8rem,4vw,2.3rem);font-weight:800;letter-spacing:-.02em;margin-bottom:10px}
.form-intro p{color:var(--muted);font-size:.98rem}

/* ---- barra de progresso ---- */
.progress{margin-bottom:30px;animation:fadeUp .6s ease .05s both}
.progress-bar{height:5px;border-radius:999px;background:var(--line);overflow:hidden;margin-bottom:16px}
.progress-fill{height:100%;width:33.33%;background:var(--grad);border-radius:999px;transition:width .45s cubic-bezier(.2,.7,.2,1)}
.progress-steps{display:flex;justify-content:space-between}
.p-step{display:flex;align-items:center;gap:8px;font-size:.84rem;color:var(--muted);transition:color .3s}
.p-step i{width:24px;height:24px;border-radius:50%;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:.76rem;font-weight:700;transition:.3s}
.p-step.active{color:var(--text)}
.p-step.active i{border-color:transparent;background:var(--grad);color:#fff;box-shadow:0 4px 14px -4px rgba(79,131,255,.6)}
.p-step.done i{border-color:transparent;background:rgba(79,131,255,.16);color:var(--blue-light)}
.p-step.done i::before{content:'✓'}

/* ---- card do formulário ---- */
#leadForm{position:relative;border:1px solid var(--line-2);border-radius:22px;padding:34px;
  background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.01));
  box-shadow:0 30px 60px -30px rgba(0,0,0,.7);overflow:hidden;animation:fadeUp .6s ease .1s both}
.fstep{display:none;animation:stepIn .4s cubic-bezier(.2,.7,.2,1)}
.fstep.active{display:block}
.fstep-actions{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.lf-msg{font-size:.86rem;color:var(--muted);margin-top:14px;text-align:center;min-height:1.2em}
.lf-msg.err{color:#f0897b}

/* ---- inputs com ícone ---- */
.field-ico{position:relative}
.field-ico svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--muted);pointer-events:none}
.field-ico input{padding-left:42px}

/* ---- toggle "já tem site?" em pílulas ---- */
.segmented{display:inline-flex;padding:4px;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.02);gap:2px}
.seg-btn{position:relative;cursor:pointer}
.seg-btn input{position:absolute;opacity:0;width:0;height:0}
.seg-btn span{display:block;padding:8px 20px;border-radius:999px;font-size:.88rem;font-weight:600;color:var(--muted);transition:.2s}
.seg-btn:has(input:checked) span{background:var(--grad);color:#fff;box-shadow:0 4px 14px -4px rgba(79,131,255,.55)}

@keyframes stepIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* ---- estado de sucesso ---- */
.form-success{text-align:center;padding:24px 10px;animation:fadeUp .5s ease both}
.form-success h2{font-size:1.5rem;font-weight:800;margin:20px 0 8px}
.form-success p{color:var(--muted);margin-bottom:28px}
.check-anim{width:68px;height:68px;margin:0 auto;filter:drop-shadow(0 6px 18px rgba(79,131,255,.45))}
.check-anim svg{width:100%;height:100%}
.check-anim circle{stroke:var(--blue-light);stroke-width:2;stroke-dasharray:151;stroke-dashoffset:151;animation:circleIn .5s ease forwards}
.check-anim path{stroke:var(--blue-light);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:36;stroke-dashoffset:36;animation:checkIn .35s ease .45s forwards}
@keyframes circleIn{to{stroke-dashoffset:0}}
@keyframes checkIn{to{stroke-dashoffset:0}}

@media (max-width:480px){
  #leadForm{padding:24px}
  .p-step b{display:none}
}