/* reclameaquí.pe — pantallas de cuenta (registro, verificar, ingresar, perfil) */
:root{
  --rosa:#e5306b; --naranja:#ff8a1f; --rosa-osc:#b81d52;
  --grad:linear-gradient(120deg,#e5306b 0%,#f2524a 45%,#ff8a1f 100%);
  --tinta:#1d1730; --tinta2:#4b4560; --suave:#7a748c;
  --fondo:#faf7f8; --fondo2:#fff6f1; --linea:#efe5e3;
  --verde:#0f7a4a; --verde-f:#e3f7ec; --rojo:#c0263b; --rojo-f:#fde7ea; --ambar:#a15c00; --ambar-f:#fff1dc; --gris-f:#f2f0f5;
  --sombra:0 10px 30px rgba(184,29,82,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
body{font-family:"Plus Jakarta Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--tinta);background:var(--fondo);line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:var(--rosa-osc);font-weight:700;text-decoration:none}
a:hover{text-decoration:underline}
button,input{font:inherit;color:inherit}
svg{display:block}
.envoltura{max-width:1100px;margin:0 auto;padding:0 20px;width:100%}

header.sitio{background:rgba(255,255,255,.95);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:10}
.cab{display:flex;align-items:center;justify-content:space-between;height:64px;gap:12px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:20px;letter-spacing:-.5px;color:var(--tinta)}
.logo:hover{text-decoration:none}
.logo svg{width:32px;height:32px}
.logo b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo small{font-size:12px;font-weight:700;color:var(--suave)}
.cab nav{display:flex;gap:8px;align-items:center}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font-weight:700;border-radius:999px;padding:12px 22px;transition:transform .15s,box-shadow .15s,opacity .15s;white-space:nowrap;text-decoration:none!important}
.btn:hover{transform:translateY(-1px)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-grad{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(229,48,107,.25)}
.btn-borde{background:#fff;color:var(--tinta);box-shadow:inset 0 0 0 1.5px #e3d7d6}
.btn-borde:hover{box-shadow:inset 0 0 0 1.5px var(--rosa);color:var(--rosa-osc)}
.btn-wa{background:#1faa59;color:#fff;box-shadow:0 8px 20px rgba(31,170,89,.28)}
.btn-google{background:#fff;color:var(--tinta);box-shadow:inset 0 0 0 1.5px #dadce0}
.btn-google:hover{box-shadow:inset 0 0 0 1.5px #a9adb3}
.btn-bloque{width:100%}
.btn-chico{padding:8px 16px;font-size:14px}

main{flex:1;padding:40px 0 64px}
.caja{max-width:520px;margin:0 auto;background:#fff;border:1px solid var(--linea);border-radius:24px;padding:32px;box-shadow:var(--sombra)}
.caja.ancha{max-width:760px}
h1{font-size:28px;letter-spacing:-.8px;line-height:1.15;margin-bottom:6px}
.sub{color:var(--tinta2);font-size:15px}
.pasos{display:flex;gap:8px;margin:0 0 22px;flex-wrap:wrap}
.pasos span{font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:999px;background:var(--gris-f);color:var(--suave)}
.pasos span.hecho{background:var(--verde-f);color:var(--verde)}
.pasos span.actual{background:var(--grad);color:#fff}

form{display:grid;gap:16px;margin-top:22px}
label.campo{display:grid;gap:6px;font-weight:700;font-size:14px}
label.campo small{font-weight:500;color:var(--suave)}
.entrada{display:flex;gap:8px}
input[type=text],input[type=tel]{width:100%;border:1.5px solid #e3d7d6;border-radius:14px;padding:13px 14px;font-size:16px;outline:0;background:#fff;transition:border-color .15s,box-shadow .15s}
input[type=text]:focus,input[type=tel]:focus{border-color:var(--rosa);box-shadow:0 0 0 4px rgba(229,48,107,.12)}
.prefijo{display:flex;align-items:center;border:1.5px solid #e3d7d6;border-radius:14px;overflow:hidden;background:#fff}
.prefijo:focus-within{border-color:var(--rosa);box-shadow:0 0 0 4px rgba(229,48,107,.12)}
.prefijo span{padding:0 4px 0 14px;font-weight:700;color:var(--suave)}
.prefijo input{border:0!important;box-shadow:none!important}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--tinta2);font-weight:500;cursor:pointer}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--rosa);flex:none}

.aviso{border-radius:14px;padding:12px 14px;font-size:14.5px;font-weight:600;margin-top:16px}
.aviso.error{background:var(--rojo-f);color:var(--rojo)}
.aviso.ok{background:var(--verde-f);color:var(--verde)}
.aviso.info{background:var(--fondo2);color:var(--tinta2);border:1px solid #ffe1d2}
.aviso.ambar{background:var(--ambar-f);color:var(--ambar)}

.eres{display:flex;gap:14px;align-items:center;background:var(--verde-f);border-radius:16px;padding:14px 16px}
.eres .ic{width:40px;height:40px;border-radius:12px;background:#fff;color:var(--verde);display:grid;place-items:center;font-weight:800;flex:none}
.eres b{display:block;font-size:17px}
.eres small{color:var(--tinta2);font-size:13px}
.eres button{margin-left:auto;background:none;border:0;color:var(--tinta2);font-weight:700;font-size:13px;cursor:pointer;text-decoration:underline}

.separador{display:flex;align-items:center;gap:12px;color:var(--suave);font-size:13px;font-weight:600;margin:20px 0 0}
.separador::before,.separador::after{content:"";flex:1;height:1px;background:var(--linea)}
.pie-caja{text-align:center;margin-top:20px;font-size:14.5px;color:var(--tinta2)}

/* Verificar */
.codigo{font-size:38px;font-weight:800;letter-spacing:4px;text-align:center;background:var(--fondo2);border:2px dashed #ffc6ae;border-radius:18px;padding:16px;margin:20px 0 8px;font-variant-numeric:tabular-nums}
.reloj{text-align:center;color:var(--suave);font-size:14px;font-weight:600}
.verif-grid{display:grid;grid-template-columns:1fr 200px;gap:24px;align-items:center;margin-top:18px}
.qr{background:#fff;border:1px solid var(--linea);border-radius:16px;padding:12px;text-align:center;font-size:12.5px;color:var(--suave);font-weight:600}
.qr canvas,.qr img,.qr svg{margin:0 auto 6px;max-width:100%;height:auto}
ol.instr{list-style:none;counter-reset:p;display:grid;gap:10px;margin-top:6px}
ol.instr li{counter-increment:p;display:flex;gap:10px;font-size:14.5px;color:var(--tinta2)}
ol.instr li::before{content:counter(p);width:24px;height:24px;border-radius:8px;background:var(--grad);color:#fff;font-weight:800;font-size:13px;display:grid;place-items:center;flex:none}
.esperando{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:20px;font-weight:700;color:var(--tinta2);font-size:14.5px}
.punto{width:10px;height:10px;border-radius:50%;background:var(--naranja);animation:latir 1.2s infinite}
@keyframes latir{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}

/* Perfil */
.perfil-cab{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.avatar{width:72px;height:72px;border-radius:22px;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:28px;font-weight:800;overflow:hidden;flex:none}
.avatar img{width:100%;height:100%;object-fit:cover}
.sellos{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.sello{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;padding:5px 11px;border-radius:999px;background:var(--verde-f);color:var(--verde)}
.datos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}
.dato{background:var(--gris-f);border-radius:14px;padding:12px 14px}
.dato small{display:block;color:var(--suave);font-size:12.5px;font-weight:600}
.dato b{font-size:15px;word-break:break-word}
.seccion{margin-top:28px}
.seccion h2{font-size:18px;margin-bottom:8px}
.vacio{border:1.5px dashed #e8d9d6;border-radius:16px;padding:24px;text-align:center;color:var(--tinta2);font-size:14.5px}

footer{background:#140f22;color:#a59fb5;padding:24px 0;font-size:13px}
footer .envoltura{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
footer a{color:#cfc9dc;font-weight:600}

@media (max-width:640px){
  main{padding:20px 0 40px}
  .envoltura{padding:0 16px}
  .caja{padding:22px 18px;border-radius:20px}
  h1{font-size:24px}
  .verif-grid{grid-template-columns:1fr}
  .qr{display:none}
  .codigo{font-size:30px;letter-spacing:3px}
  .datos{grid-template-columns:1fr}
  .cab nav .btn-borde{display:none}
}