:root{
  --selva:#041a17; --jade:#082824; --laguna:#0f4a40; --borde:#1f6a5c;
  --oro:#f5c542; --oro-luz:#fff0b0; --oro-osc:#9b7414; --perg:#fbf3dc; --tinta:#4a3209;
  --verde:#21b98a; --verde-osc:#0e7a59; --coral:#d6404f; --claro:#e9f6f1; --apagado:#93b9ae;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px 16px;
  font:400 15px/1.5 "DM Sans",system-ui,sans-serif; color:var(--claro);
  background:var(--selva);
  background-image:radial-gradient(circle at 15% 10%,rgba(33,185,138,.18),transparent 40%),
                   radial-gradient(circle at 90% 90%,rgba(245,197,66,.10),transparent 45%);
}
a{color:var(--oro-luz)}
.wz{
  width:100%; max-width:480px; background:var(--jade); border:2px solid var(--borde);
  border-radius:28px 6px 28px 6px; padding:18px 18px 14px; box-shadow:0 24px 50px rgba(0,0,0,.5);
}
.wz-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.wz-logo{font:26px/1 Righteous,sans-serif;color:var(--oro);letter-spacing:1px}
.wz-dots{list-style:none;display:flex;gap:6px;margin:0 auto}
.wz-dots li{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;
  border:2px solid var(--borde);color:var(--apagado)}
.wz-dots li.on{background:var(--oro);border-color:var(--oro);color:var(--tinta)}
.wz-login{font-size:13px;font-weight:700;color:var(--claro);text-decoration:none}
h1{font:400 23px/1.2 Righteous,sans-serif;margin-bottom:14px}
.paso-n{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--oro);margin-bottom:10px}
.paso{margin-bottom:14px}
.js .paso{display:none}
.js .paso.activo{display:block;animation:entra .25s ease}
@keyframes entra{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.opciones{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.opciones button{
  display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;cursor:pointer;
  font:700 13px/1.2 "DM Sans",sans-serif;color:var(--claro);
  background:var(--laguna);border:2px solid var(--borde);border-radius:14px;transition:border-color .15s,transform .15s;
}
.opciones button:hover,.opciones button:focus-visible{border-color:var(--oro);transform:translateY(-2px);outline:none}
.opciones svg{width:40px;height:40px}
.cartel{
  text-align:center;color:var(--tinta);padding:14px 14px 12px;border-radius:14px;
  background:linear-gradient(180deg,var(--perg),#ecd9a6);box-shadow:inset 0 0 0 2px #d2b46a,inset 0 0 24px rgba(130,90,20,.2);
}
.c-tit{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#80590f}
.c-big{
  font:400 62px/1 Righteous,sans-serif;margin:4px 0 0;
  background:linear-gradient(180deg,var(--oro-luz),var(--oro) 50%,var(--oro-osc));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1px #7d5a0c;
}
.c-hasta{font-size:16px}
.c-hasta b{font:400 30px/1.1 Righteous,sans-serif;display:block}
.c-txt{font-size:13px;margin-top:6px}
.wz-cta{
  display:block;text-align:center;margin-top:12px;padding:13px 16px;border-radius:999px;text-decoration:none;
  font:400 18px/1.2 Righteous,sans-serif;color:#fff;letter-spacing:.5px;
  background:linear-gradient(180deg,#3bdca8,var(--verde-osc));border:2px solid var(--oro);
  box-shadow:0 0 0 3px rgba(155,116,20,.4),0 8px 18px rgba(0,0,0,.35);
}
.wz-cta:hover{filter:brightness(1.08)}
.wz-back{display:none;margin:8px auto 0;background:none;border:0;color:var(--apagado);font:500 13px "DM Sans",sans-serif;cursor:pointer}
.js .wz-back{display:block}
.wz-about{font-size:13.5px;color:var(--apagado);margin-bottom:10px}
.wz-about a{font-weight:700}
.trix{font-size:13px;padding:8px 12px;border-left:3px solid var(--coral);background:rgba(214,64,79,.08);border-radius:0 8px 8px 0;margin-bottom:12px}
.trix a{font-weight:700}
.wz-foot{font-size:11px;color:var(--apagado);border-top:1px solid var(--borde);padding-top:10px;text-align:center}
.wz-foot a{color:var(--apagado)}
.wz-foot p+p{margin-top:2px}