:root{
  --rojo:#D7282F; --rojo-claro:#FCEBEB; --rojo-medio:#F09595; --rojo-osc:#791F1F;
  --tinta:#2C2C2A; --gris:#5F5E5A; --gris-claro:#888780; --linea:#E3E1D9; --fondo:#F6F5F1; --blanco:#fff;
  --verde:#27500A; --verde-claro:#EAF3DE;
}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.55}
.envoltura{max-width:680px;margin:0 auto;padding:24px 16px 48px}
.tarjeta{background:var(--blanco);border-radius:16px;border:1px solid var(--linea);padding:28px 32px}
@media (max-width:560px){.tarjeta{padding:22px 18px}}
.cabecera{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.cabecera img{height:40px}
.guardado{font-size:12px;color:var(--gris-claro);display:flex;align-items:center;gap:6px}
.guardado .punto{width:7px;height:7px;border-radius:50%;background:#97C459}
.barra{display:flex;gap:4px;margin-bottom:6px}
.barra span{flex:1;height:5px;border-radius:3px;background:var(--linea)}
.barra span.hecho{background:var(--rojo)}
.barra span.actual{background:var(--rojo-medio)}
.paso-txt{font-size:12px;color:var(--gris-claro);margin-bottom:20px}
h1{font-size:23px;font-weight:600;margin:0 0 6px;line-height:1.3}
.sub{color:var(--gris);margin:0 0 22px}
.fila{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
@media (max-width:560px){.fila{grid-template-columns:minmax(0,1fr)}}
.campo{margin-bottom:16px}
label.et{display:block;font-size:13px;font-weight:500;color:var(--tinta);margin-bottom:5px}
label.et .opc{font-weight:400;color:var(--gris-claro)}
.ayuda{font-size:12px;color:var(--gris-claro);margin-top:4px}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=month],input[type=number],select,textarea{
  width:100%;font:inherit;font-size:15px;color:var(--tinta);background:var(--blanco);
  border:1px solid #D3D1C7;border-radius:10px;padding:10px 12px;outline:none;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:var(--rojo);box-shadow:0 0 0 3px var(--rojo-claro)}
.error input,.error select,.error textarea{border-color:var(--rojo)}
.msg-error{font-size:12px;color:var(--rojo);margin-top:4px}
textarea{min-height:92px;resize:vertical}
.con-mic{display:flex;gap:8px;align-items:flex-start}
.con-mic textarea{flex:1}
.mic{flex-shrink:0;width:44px;height:44px;border-radius:50%;border:1px solid #D3D1C7;background:var(--blanco);color:var(--rojo);cursor:pointer;display:flex;align-items:center;justify-content:center}
.mic svg{width:20px;height:20px}
.mic.on{background:var(--rojo);border-color:var(--rojo);color:#fff;animation:latido 1.2s infinite}
@keyframes latido{0%,100%{box-shadow:0 0 0 0 rgba(215,40,47,.35)}50%{box-shadow:0 0 0 7px rgba(215,40,47,0)}}
.escuchando{font-size:12px;color:var(--rojo);margin-top:4px}
.caja{background:var(--fondo);border-radius:12px;padding:14px 16px;margin-bottom:16px}
.caja-tit{font-size:14px;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.pestanas{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.pestana{font:inherit;font-size:13px;padding:6px 14px;border-radius:999px;border:1px solid #D3D1C7;background:var(--blanco);color:var(--gris);cursor:pointer}
.pestana.activa{background:var(--rojo-claro);border-color:var(--rojo-claro);color:var(--rojo-osc);font-weight:600}
.pestana.lista::after{content:" ✓";color:var(--verde)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--tinta);cursor:pointer;margin-bottom:14px}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--rojo);flex-shrink:0}
.botones{display:flex;justify-content:space-between;gap:10px;margin-top:26px}
.btn{font:inherit;font-size:15px;font-weight:500;padding:11px 20px;border-radius:10px;border:1px solid #D3D1C7;background:var(--blanco);color:var(--tinta);cursor:pointer}
.btn:hover{background:var(--fondo)}
.btn.prim{background:var(--rojo);border-color:var(--rojo);color:#fff}
.btn.prim:hover{background:#B91F25}
.btn.mini{font-size:13px;padding:6px 12px}
.quitar{font:inherit;font-size:12px;color:var(--gris-claro);background:none;border:none;cursor:pointer;text-decoration:underline;padding:0}
.lista-pasos{list-style:none;padding:0;margin:0 0 20px}
.lista-pasos li{display:flex;gap:14px;margin-bottom:14px}
.lista-pasos .num{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--rojo-claro);color:var(--rojo-osc);font-weight:600;display:flex;align-items:center;justify-content:center;font-size:14px}
.aviso{font-size:13px;color:var(--gris);background:var(--fondo);border-radius:10px;padding:12px 14px;margin-bottom:8px}
.foto-prev{width:72px;height:72px;border-radius:50%;object-fit:cover;border:1px solid var(--linea)}
.foto-fila{display:flex;align-items:center;gap:14px}
.contacto{font-size:14px;color:var(--gris);border-top:1px solid var(--linea);padding-top:16px;margin-top:8px}
.contacto a{color:var(--rojo);text-decoration:none}
.exito{width:56px;height:56px;border-radius:50%;background:var(--verde-claro);color:var(--verde);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.etiqueta-puesto{font-size:12px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:var(--rojo);margin-bottom:4px}
.datos-clave{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:22px}
.datos-clave div{background:var(--fondo);border-radius:10px;padding:10px 12px}
.datos-clave div:first-child{background:var(--verde-claro)}
.datos-clave span{display:block;font-size:12px;color:var(--gris)}
.datos-clave b{font-size:14px;font-weight:600}
.datos-clave div:first-child b{color:var(--verde)}
@media (max-width:560px){.datos-clave{grid-template-columns:minmax(0,1fr)}}
.perfil{border:1px solid var(--linea);border-radius:12px;padding:18px 20px}
.perfil-tit{font-size:13px;font-weight:600;color:var(--rojo-osc);margin-bottom:6px}
.vinetas{margin:0 0 18px;padding-left:20px}
.vinetas li{margin-bottom:5px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips span{font-size:13px;background:var(--fondo);border-radius:999px;padding:5px 12px}
.pie{text-align:center;font-size:11px;color:var(--gris-claro);margin-top:18px}
a.btn{text-decoration:none;display:inline-block}
.cintillo{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#141414;color:#fff;border-radius:10px;padding:12px 16px;margin:4px 0 18px}
.cintillo img{height:24px;max-width:170px;object-fit:contain}
.cintillo span{font-size:15px;font-weight:500}
.cintillo a{color:#fff;font-size:14px;margin-left:auto;text-decoration:underline;text-underline-offset:3px}
.cintillo a:hover{color:#B5E06A}
@media (max-width:560px){.cintillo a{margin-left:0}}