/* Mr.Realtor -- wizard multi-paso de captacion (buyer/seller/investor/property).
   Usa las variables del sitio: --ink, --cream, --cream-2 (equivalente al --panel2
   del brief, que no existe en index.html), --accent, --line, --ease. */

.wz-back{position:fixed;inset:0;z-index:985;background:rgba(28,35,51,.66);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  display:none;align-items:center;justify-content:center;padding:1.1rem}
.wz-back.on{display:flex}
.wz{background:var(--cream);border-radius:22px;width:100%;max-width:560px;
  max-height:86vh;display:flex;flex-direction:column;overflow:hidden;
  position:relative;box-shadow:0 40px 90px -30px rgba(0,0,0,.55);
  animation:pdpop .28s var(--ease)}

.wz-head{flex:0 0 auto;display:flex;align-items:center;gap:.6rem;
  padding:1.3rem 3.4rem 0 1.4rem;min-height:20px}
.wz-eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-soft);flex:1;line-height:1.3}
.wz-close{position:absolute;top:.7rem;right:.7rem;width:44px;height:44px;
  border-radius:50%;background:var(--cream-2);border:1px solid var(--line);
  display:grid;place-items:center;cursor:pointer;color:var(--ink);z-index:2;
  transition:background .2s var(--ease),color .2s var(--ease)}
.wz-close:hover{background:var(--ink);color:var(--cream)}
.wz-close svg{width:16px;height:16px}

.wz-steplabel{flex:0 0 auto;padding:.5rem 1.4rem 0;font-size:.7rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

.wz-bar{height:3px;background:var(--line);flex:0 0 auto;margin-top:.7rem}
.wz-bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .3s ease}

.wz-prop{flex:0 0 auto;margin:1rem 1.4rem 0;padding:.7rem .85rem;background:var(--cream-2);
  border:1px solid var(--line);border-radius:14px}
.wz-prop .wz-pa{font-weight:700;color:var(--ink);font-size:.92rem}
.wz-prop .wz-pp{color:var(--ink-soft);font-size:.85rem;margin-top:.15rem}

.wz-resume{flex:0 0 auto;margin:1rem 1.4rem 0;padding:.9rem 1rem;background:var(--cream-2);
  border:1px solid var(--line);border-radius:14px;font-size:.85rem;color:var(--ink);line-height:1.5}
.wz-resume[hidden]{display:none}
.wz-resume p{margin-bottom:.65rem}
.wz-resume-btns{display:flex;gap:.5rem;flex-wrap:wrap}
.wz-resume-btns button{min-height:44px;padding:.4rem .95rem;border-radius:999px;
  font-size:.8rem;font-weight:700;cursor:pointer;font-family:inherit;border:none}
.wz-resume-go{background:var(--accent);color:var(--on-accent)}
.wz-resume-reset{background:transparent;color:var(--ink-soft);border:1px solid var(--line)!important}

.wz-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:1.4rem}
.wz-title{font-family:"Bricolage Grotesque";font-weight:700;font-size:1.3rem;color:var(--ink);
  margin-bottom:1.1rem;letter-spacing:-.01em}

.wz-q{margin-bottom:1.3rem}
.wz-q:last-child{margin-bottom:0}
.wz-label{display:block;font-size:.86rem;font-weight:700;color:var(--ink);
  margin-bottom:.55rem;line-height:1.35}
.wz-req{color:var(--accent);margin-left:.15rem}

.wz input[type=text],.wz input[type=tel],.wz input[type=email]{
  width:100%;font-size:16px;min-height:44px;padding:.7rem .9rem;
  border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);
  font-family:inherit;transition:border-color .2s var(--ease)}
.wz input[type=text]:focus,.wz input[type=tel]:focus,.wz input[type=email]:focus{
  outline:none;border-color:var(--accent)}
.wz input::placeholder{color:var(--ink-soft);opacity:.75}

/* tarjetas tocables en vez de radios/checks nativos desnudos --
   el input real sigue ahi (oculto visualmente) para teclado y lectores de pantalla */
.wz-opts{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.6rem}
.wz-opt{border:1.5px solid var(--line);border-radius:12px;padding:.75rem .9rem;
  min-height:44px;cursor:pointer;font-size:.92rem;display:flex;align-items:center;
  background:#fff;line-height:1.3;position:relative;
  transition:border-color .15s var(--ease),background .15s var(--ease)}
.wz-opt.on{border-color:var(--accent);background:var(--cream-2);font-weight:700}
.wz-opt input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.wz-opt:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}

.wz-consent{display:grid;grid-template-columns:1.2rem 1fr;gap:.6rem;align-items:start;
  font-size:.82rem;line-height:1.5;color:var(--ink-soft);cursor:pointer}
.wz-consent input{width:1.2rem;height:1.2rem;margin:.15rem 0 0;accent-color:var(--accent);cursor:pointer}
.wz-consent span{padding-top:.05rem}

.wz-err{color:#96231C;font-size:.82rem;margin-top:.45rem;min-height:1em}
.wz-q.wz-invalid .wz-opt{border-color:#96231C}
.wz-q.wz-invalid input[type=text],.wz-q.wz-invalid input[type=tel],.wz-q.wz-invalid input[type=email]{
  border-color:#96231C}

.wz-fatal{flex:0 0 auto;margin:0 1.4rem 1rem;padding:.85rem 1rem;background:#FBEAEA;
  border:1px solid #E3AFAA;border-radius:14px;font-size:.85rem;color:#6B1712;line-height:1.5}
.wz-fatal a{color:#6B1712;font-weight:700;text-decoration:underline;text-underline-offset:2px}

.wz-foot{flex:0 0 auto;padding:1rem 1.4rem;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:.6rem;background:var(--cream)}
.wz-foot-row{display:flex;gap:.6rem;justify-content:space-between}
.wz-foot .btn{min-height:44px;border:none;cursor:pointer;font-family:inherit;justify-content:center}
.wz-next-btn{flex:1 1 auto;text-align:center}
.wz-back-btn{flex:0 0 auto}
.wz-back-btn.wz-invisible{visibility:hidden;pointer-events:none}
.wz-foot .btn[disabled]{opacity:.62;cursor:default;transform:none!important;box-shadow:none!important}
.wz-fine{font-size:.72rem;color:var(--ink-soft);opacity:.78;line-height:1.5;text-align:center}
.wz-fine a{color:var(--ink-soft);text-underline-offset:2px}

.wz-spin{display:inline-block;width:14px;height:14px;margin-right:.45rem;vertical-align:-2px;
  border:2px solid rgba(238,242,252,.45);border-top-color:currentColor;border-radius:50%;
  animation:wzspin .7s linear infinite}
@keyframes wzspin{to{transform:rotate(360deg)}}

.wz-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

.wz-ok{padding:2.6rem 1.6rem;text-align:center}
.wz-ok .wz-check{width:64px;height:64px;border-radius:50%;background:var(--accent);color:var(--on-accent);
  display:grid;place-items:center;margin:0 auto 1.1rem}
.wz-ok .wz-check svg{width:30px;height:30px}
.wz-ok h3{font-family:"Bricolage Grotesque";font-weight:700;font-size:1.35rem;color:var(--ink);margin-bottom:.5rem}
.wz-ok p{color:var(--ink-soft);font-size:.95rem;line-height:1.5;margin-bottom:1.4rem}
.wz-ok .btn{display:inline-flex}

.wz *:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media(prefers-reduced-motion:reduce){
  .wz{animation:none}
  .wz-bar i{transition:none}
  .wz-spin{animation:none}
}

@media(max-width:720px){
  .wz-back{padding:0;align-items:stretch}
  .wz{max-width:none;border-radius:0;max-height:none;height:100dvh}
  .wz-opts{grid-template-columns:1fr}
  .wz-foot{position:sticky;bottom:0;background:var(--cream);
    padding-bottom:calc(1rem + env(safe-area-inset-bottom))}
}