/* Multistep merchant application (solicitud.html) */
.apply{background:var(--paper);min-height:100vh}
.apply-top{background:var(--ink);display:flex;align-items:center;justify-content:space-between;padding:16px max(16px,calc((100vw - 1100px)/2))}
.apply-top img{height:24px;display:block}
.apply-login{color:var(--soft-dark);text-decoration:none;font-size:.9rem;font-weight:500;border:1px solid var(--ink-line);padding:7px 12px;border-radius:8px;transition:border-color .2s,color .2s}
.apply-login:hover{color:#fff;border-color:var(--accent)}

.apply-hero{background:var(--ink);color:#fff;padding:34px 16px 92px;text-align:center;
  background-image:radial-gradient(ellipse 70% 120% at 50% 0%,rgba(111,227,190,.16),transparent 70%)}
.apply-hero h1{font-size:clamp(1.7rem,3.6vw,2.5rem);margin:.4rem 0 .6rem;color:#fff}
.apply-hero p{color:var(--soft-dark);max-width:620px;margin:0 auto;font-size:1rem}
.apply-eyebrow{display:inline-block;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:600}

.apply-shell{max-width:1100px;margin:-64px auto 60px;padding:0 16px;display:grid;grid-template-columns:260px 1fr;gap:22px;align-items:start}
@media (max-width:900px){.apply-shell{grid-template-columns:1fr}.apply-steps{display:none}}

/* side step list */
.apply-steps{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;position:sticky;top:16px}
.apply-steps ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.apply-steps button{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:9px;font-size:.92rem;color:var(--muted);cursor:pointer;transition:background .2s,color .2s}
.apply-steps button:disabled{cursor:default;opacity:.65}
.apply-steps button:not(:disabled):hover{background:var(--paper)}
.apply-steps .dot{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:.78rem;font-weight:600;border:1.5px solid var(--line);background:#fff;transition:all .25s}
.apply-steps .is-current button{color:var(--text);font-weight:600;background:var(--paper)}
.apply-steps .is-current .dot{border-color:var(--ink);background:var(--ink);color:#fff}
.apply-steps .is-done .dot{border-color:var(--accent-deep);background:var(--accent-deep);color:#fff}
.apply-steps .is-done button{color:var(--text)}
.apply-trust{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:.82rem;color:var(--muted)}
.apply-trust p{margin:0 0 12px}.apply-trust strong{color:var(--text)}

/* card */
.apply-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 0 22px;box-shadow:0 18px 40px -24px rgba(10,18,32,.35);overflow:hidden;scroll-margin-top:16px}
.apply-progress{height:4px;background:#EEEDE7}
.apply-progress div{height:100%;width:0;background:linear-gradient(90deg,var(--accent-deep),var(--accent));transition:width .45s cubic-bezier(.22,1,.36,1)}
.apply-stepinfo{display:flex;gap:10px;align-items:baseline;padding:18px 28px 0;font-size:.82rem;color:var(--muted)}
.apply-stepinfo #stepnum{font-family:var(--font-mono);color:var(--accent-deep)}
#f{padding:0 28px}
@media (max-width:640px){#f{padding:0 18px}.apply-stepinfo{padding:16px 18px 0}}

.step{display:none}
.step.active{display:block}
.step.fwd{animation:step-in-fwd .38s cubic-bezier(.22,1,.36,1)}
.step.back{animation:step-in-back .38s cubic-bezier(.22,1,.36,1)}
@keyframes step-in-fwd{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes step-in-back{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.step h2{font-size:1.45rem;margin:.35rem 0 .3rem}
.step h3{font-size:1.05rem;margin:0 0 .2rem}
.step-lead{color:var(--muted);margin:0 0 14px}
.opt{font-weight:400;color:var(--muted-dark);font-size:.78rem;margin-left:4px}

/* inputs: a bit more air than the portal */
.apply input:not([type=checkbox]):not([type=radio]),.apply select,.apply textarea{padding:12px 13px;border-radius:9px;transition:border-color .2s,box-shadow .2s}
.apply input:focus,.apply select:focus,.apply textarea:focus{outline:none;border-color:var(--accent-deep);box-shadow:0 0 0 3px rgba(111,227,190,.35)}
.apply .invalid{border-color:var(--danger)!important;box-shadow:0 0 0 3px rgba(214,69,69,.14)!important}
.shake{animation:shake .35s}
@keyframes shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}

/* choice cards */
.choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:6px 0 4px}
@media (max-width:520px){.choice{grid-template-columns:1fr}}
.choice-card{position:relative;display:flex;gap:12px;align-items:center;margin:0;padding:16px;border:1.5px solid var(--line);border-radius:12px;cursor:pointer;font-weight:400;transition:border-color .2s,background .2s,transform .15s}
.choice-card:hover{border-color:#B9BBB2;transform:translateY(-1px)}
.choice-card input,.chips input{position:absolute;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none;margin:0}
.choice-card strong{display:block;font-size:1rem}
.choice-card small{display:block;color:var(--muted);font-size:.82rem}
.choice-icon{flex:none;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--paper);color:var(--muted);transition:all .2s}
.choice-card.is-checked,.choice-card:has(input:checked){border-color:var(--accent-deep);background:#F2FBF7}
.choice-card.is-checked .choice-icon,.choice-card:has(input:checked) .choice-icon{background:var(--accent-deep);color:#fff}
.choice-card:has(input:focus-visible){box-shadow:0 0 0 3px rgba(111,227,190,.45)}
.fields{margin-top:6px}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 4px}
.chips label{position:relative;margin:0;font-weight:500;font-size:.88rem}
.chips span{display:inline-block;padding:8px 14px;border:1.5px solid var(--line);border-radius:999px;cursor:pointer;transition:all .2s}
.chips span:hover{border-color:#B9BBB2}
.chips input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.chips input:focus-visible+span{box-shadow:0 0 0 3px rgba(111,227,190,.45)}

.owners-box{margin-top:22px;padding:16px;border-radius:12px;background:var(--paper)}
.owners-box #owners{margin-bottom:10px}
.reveal:not(.hidden){animation:step-in-fwd .3s ease}

/* summary */
.summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
@media (max-width:640px){.summary{grid-template-columns:1fr}}
.sum-block{border:1px solid var(--line);border-radius:11px;padding:12px 14px;font-size:.88rem}
.sum-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.sum-block dl{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:0}
.sum-block dt{color:var(--muted)}.sum-block dd{margin:0;word-break:break-word}
.link{all:unset;cursor:pointer;color:var(--accent-deep);font-weight:600;font-size:.82rem}
.link:hover{text-decoration:underline}
.declarations{background:var(--paper);border-radius:12px;padding:6px 16px 10px}

/* nav */
.apply-nav{display:flex;justify-content:space-between;gap:12px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.apply-nav .btn{min-width:140px;justify-content:center;padding:12px 18px;transition:background .2s,transform .15s}
.apply-nav .btn-primary:hover{transform:translateY(-1px)}
.btn.loading{position:relative;color:transparent!important}
.btn.loading::after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* done */
.done{padding:34px 28px 10px;text-align:center;animation:step-in-fwd .45s cubic-bezier(.22,1,.36,1)}
.done-icon{width:68px;height:68px;margin:0 auto 14px;border-radius:50%;background:var(--accent-deep);color:#fff;display:grid;place-items:center;animation:pop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes pop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.done p{color:var(--muted);max-width:520px;margin:0 auto 18px}
.done-next{text-align:left;max-width:460px;margin:0 auto;padding-left:20px;color:var(--text)}
.done-next li{margin:8px 0}

/* touch: 16px avoids the iOS zoom on focus; bigger checkboxes */
.apply input,.apply select,.apply textarea{font-size:16px}
.apply .check{font-size:.92rem;line-height:1.45}
.apply .check input{width:20px;height:20px;margin-top:1px;accent-color:var(--accent-deep);cursor:pointer}
.apply select{-webkit-appearance:none;appearance:none;padding-right:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235B6070' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 13px center}

@media (prefers-reduced-motion:reduce){
  .step.fwd,.step.back,.reveal,.done,.done-icon,.shake{animation:none!important}
  .apply-progress div,.choice-card,.apply-nav .btn{transition:none}
}
.owner-row+.owner-row{border-top:1px dashed var(--line);padding-top:10px;margin-top:12px}
