/* PubliScreen - estilos base (mobile-first). --c1 y --c2 vienen de la marca del dominio. */
/* Tipografia servida desde el propio servidor (GDPR: sin pedidos a Google Fonts). Licencia OFL. */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fuentes/jakarta-400.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url(fuentes/jakarta-500.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fuentes/jakarta-600.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url(fuentes/jakarta-700.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(fuentes/jakarta-800.woff2) format('woff2')}
:root{
  --fondo:#0b0d14;--sup:#141826;--sup2:#1b2033;--borde:#262c42;--texto:#eef1f8;--suave:#9aa3b8;
  --ok:#2bd99f;--error:#ff5d73;--info:#5aa9ff;--radio:18px;
  --sombra:0 18px 50px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--fondo);color:var(--texto);
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.55;overflow-x:hidden}
a{color:var(--c2)}
h1,h2,h3{line-height:1.15;margin:0 0 .5em}
.suave{color:var(--suave)}

/* Fondo animado */
.fondo{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.fondo span{position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(80px);opacity:.28;animation:flota 22s ease-in-out infinite}
.fondo span:nth-child(1){background:var(--c1);top:-25vmax;left:-15vmax}
.fondo span:nth-child(2){background:var(--c2);bottom:-30vmax;right:-20vmax;animation-delay:-7s}
.fondo span:nth-child(3){background:var(--c1);top:40%;left:55%;width:30vmax;height:30vmax;opacity:.16;animation-delay:-14s}
@keyframes flota{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(6vw,4vh) scale(1.08)}66%{transform:translate(-4vw,6vh) scale(.95)}}

/* Barra superior */
.barra{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;position:sticky;top:0;z-index:5;
  background:rgba(11,13,20,.7);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.05)}
.barra-der{display:flex;align-items:center;gap:10px}
.barra form{margin:0}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--texto);font-weight:800;font-size:1.1rem}
.marca img{max-height:34px;max-width:150px}
.marca-icono{display:inline-grid;grid-template-columns:repeat(3,6px);gap:3px;padding:7px;border-radius:10px;background:linear-gradient(135deg,var(--c1),var(--c2))}
.marca-icono i{width:6px;height:14px;border-radius:2px;background:#fff;animation:barras 1.6s ease-in-out infinite}
.marca-icono i:nth-child(2){animation-delay:.2s}.marca-icono i:nth-child(3){animation-delay:.4s}
@keyframes barras{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)}}
.idiomas{display:flex;background:var(--sup);border:1px solid var(--borde);border-radius:999px;padding:3px}
.idiomas a{font-size:.75rem;font-weight:700;color:var(--suave);text-decoration:none;padding:5px 9px;border-radius:999px;transition:.2s}
.idiomas a.activo{background:linear-gradient(135deg,var(--c1),var(--c2));color:#fff}

/* Contenido */
.contenido{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:24px 16px 40px}
.pie{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;padding:20px 16px;font-size:.8rem;color:var(--suave);border-top:1px solid rgba(255,255,255,.05)}
.pie a{color:var(--texto);font-weight:600;text-decoration:none}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:14px;padding:14px 22px;font:inherit;font-weight:700;
  cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .2s,opacity .2s}
.btn:active{transform:scale(.97)}
.btn-principal{color:#fff;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 10px 30px -8px var(--c1)}
.btn-principal:hover{box-shadow:0 14px 36px -6px var(--c1);transform:translateY(-1px)}
.btn-fantasma{background:transparent;color:var(--texto);border:1px solid var(--borde);padding:8px 14px;font-size:.85rem}
.btn-ancho{width:100%}
.btn.cargando{opacity:.7;pointer-events:none}
.btn.cargando::after{content:"";width:16px;height:16px;border:2px solid #fff;border-right-color:transparent;border-radius:50%;animation:gira .7s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}

.chip{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:6px 12px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid var(--borde);color:var(--c2);margin-bottom:14px}

/* Aparicion escalonada */
.js .aparece{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.aparece.visto{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .aparece{opacity:1;transform:none;transition:none}.fondo span,.marca-icono i{animation:none}}

/* Inicio */
.hero{text-align:center;padding:24px 0 10px}
.hero h1{font-size:clamp(2.2rem,8vw,4rem);font-weight:800;background:linear-gradient(135deg,#fff 30%,var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{max-width:620px;margin:0 auto 26px;color:var(--suave);font-size:1.05rem}
.tv-demo{margin:44px auto 0;max-width:520px}
.tv-marco{background:#05060a;border:10px solid #1d2234;border-radius:16px;box-shadow:var(--sombra);aspect-ratio:16/9;overflow:hidden}
.tv-pantalla{height:100%;padding:6%;display:flex;flex-direction:column;justify-content:center;gap:6%;
  background:radial-gradient(circle at 15% 20%,var(--c1),transparent 60%),radial-gradient(circle at 85% 90%,var(--c2),transparent 55%),#0d0f18}
.tv-fila{display:flex;justify-content:space-between;align-items:center;background:rgba(0,0,0,.35);border-radius:10px;padding:3% 5%;font-size:clamp(.8rem,3vw,1.1rem);
  animation:entra .8s both}
.tv-fila:nth-child(2){animation-delay:.15s}.tv-fila:nth-child(3){animation-delay:.3s}
.tv-fila em{font-style:normal;font-weight:800;color:#fff}
.tv-fila.brilla{position:relative;overflow:hidden}
.tv-fila.brilla::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);animation:brillo 2.6s infinite}
.tv-franja{font-size:.75rem;text-align:center;opacity:.8}
.tv-pie{width:30%;height:10px;margin:0 auto;background:#1d2234;border-radius:0 0 10px 10px}
@keyframes entra{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
@keyframes brillo{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.pasos{margin:56px auto 0;max-width:640px}
.pasos h2{text-align:center;font-size:1.5rem}
.pasos ol{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.pasos li{display:flex;align-items:center;gap:14px;background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:14px 16px}
.pasos li span{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font-weight:800;background:linear-gradient(135deg,var(--c1),var(--c2))}
.ventajas{display:grid;gap:14px;margin-top:40px;grid-template-columns:1fr}
.tarjeta{background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:20px;transition:transform .25s,border-color .25s}
.tarjeta:hover{transform:translateY(-4px);border-color:var(--c1)}
.tarjeta h3{font-size:1.05rem}.tarjeta p{margin:0;color:var(--suave);font-size:.95rem}
@media (min-width:700px){.ventajas{grid-template-columns:repeat(4,1fr)}}

/* Formularios */
.caja-form{max-width:420px;margin:20px auto;background:rgba(20,24,38,.85);border:1px solid var(--borde);border-radius:24px;padding:28px 22px;box-shadow:var(--sombra);backdrop-filter:blur(10px)}
.caja-form h1{font-size:1.6rem}
.centrado{text-align:center}
.form{display:grid;gap:16px;margin-top:18px}
.campo{display:grid;gap:6px;font-size:.9rem;font-weight:600}
.campo input{width:100%;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:12px;padding:13px 14px;outline:none;transition:border-color .2s,box-shadow .2s}
.campo input:focus{border-color:var(--c1);box-shadow:0 0 0 4px color-mix(in srgb,var(--c1) 25%,transparent)}
.con-ojo{position:relative;display:block}
.con-ojo input{padding-right:48px}
.ojo{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--suave);font-size:1.1rem;cursor:pointer;padding:8px}
.medidor{height:5px;border-radius:5px;background:var(--sup2);overflow:hidden}
.medidor i{display:block;height:100%;width:0;background:var(--error);transition:width .3s,background .3s}
.alerta{border-radius:12px;padding:12px 14px;font-size:.92rem;margin-top:12px;border:1px solid}
.alerta-error{background:rgba(255,93,115,.1);border-color:rgba(255,93,115,.4);color:#ffc2cb;animation:sacude .4s}
.alerta-info{background:rgba(90,169,255,.1);border-color:rgba(90,169,255,.4);color:#cfe4ff}
.alerta-ok{background:rgba(43,217,159,.1);border-color:rgba(43,217,159,.4);color:#c4f7e4;margin-bottom:16px}
@keyframes sacude{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.error-codigo{font-size:4.5rem;font-weight:800;background:linear-gradient(135deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.detalle{text-align:left;white-space:pre-wrap;font-size:.8rem;background:var(--sup2);padding:10px;border-radius:10px}

/* Panel */
.saludo h1{font-size:clamp(1.6rem,6vw,2.2rem)}
.cifras{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:20px 0 30px}
.cifra{background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:18px;position:relative;overflow:hidden}
.cifra::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--c1),var(--c2))}
.cifra strong{display:block;font-size:2rem;font-weight:800}
.cifra span{color:var(--suave);font-size:.85rem}
.titulo-seccion{font-size:1.15rem}
.modulos{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.modulo{display:flex;flex-direction:column;gap:8px;background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:16px;min-height:110px;transition:transform .2s,border-color .2s}
.modulo:hover{transform:translateY(-3px);border-color:var(--c1)}
.modulo-icono{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--c1),var(--c2));opacity:.9}
.modulo-nombre{font-weight:700;font-size:.95rem}
.modulo-fase{margin-top:auto;font-size:.72rem;font-weight:700;color:var(--suave);text-transform:uppercase;letter-spacing:.05em}
.modulo.bloqueado .modulo-icono{opacity:.4}
@media (min-width:700px){.cifras{grid-template-columns:repeat(4,1fr)}.modulos{grid-template-columns:repeat(4,1fr)}}

/* ---------- Fase 1: vincular y pantallas ---------- */
.pequeno{font-size:.8rem}
.campo select{width:100%;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:12px;padding:13px 14px;outline:none}
.input-codigo{text-align:center;font-size:2rem!important;font-weight:800;letter-spacing:.35em;font-variant-numeric:tabular-nums}
.opciones{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opciones legend{padding:0;margin-bottom:6px}
.opcion{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px;border:1px solid var(--borde);border-radius:14px;background:var(--sup2);cursor:pointer;font-weight:600;transition:border-color .2s,transform .2s}
.opcion input{position:absolute;opacity:0}
.opcion:has(input:checked){border-color:var(--c1);box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 30%,transparent)}
.figura{display:block;border:3px solid currentColor;border-radius:4px;opacity:.8}
.figura-h{width:46px;height:28px}.figura-v{width:28px;height:46px}
.grupo-nueva{display:grid;gap:16px;transition:opacity .3s}
.grupo-nueva.apagado{display:none}
.fila-titulo{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:18px}
.lista-pantallas{display:grid;gap:12px}
.pantalla{background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:16px;display:grid;gap:14px}
.pantalla-cab{display:flex;align-items:center;gap:12px}
.pantalla-info{flex:1;min-width:0}
.pantalla-info h3{margin:0 0 2px;font-size:1.05rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv-mini{flex:none;width:44px;height:28px;border-radius:5px;border:3px solid var(--c2);background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 40%,transparent),transparent)}
.tv-mini.vertical{width:28px;height:44px}
.estado{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;padding:6px 10px;border-radius:999px;background:var(--sup2);white-space:nowrap}
.estado i{width:9px;height:9px;border-radius:50%;background:var(--suave)}
.estado-en_linea{color:#9ff5d6}.estado-en_linea i{background:var(--ok);box-shadow:0 0 0 0 var(--ok);animation:latido 1.8s infinite}
.estado-desconectada{color:#ffc2cb}.estado-desconectada i{background:var(--error)}
.estado-nunca{color:var(--suave)}
@keyframes latido{0%{box-shadow:0 0 0 0 rgba(43,217,159,.6)}70%{box-shadow:0 0 0 9px rgba(43,217,159,0)}100%{box-shadow:0 0 0 0 rgba(43,217,159,0)}}
.pantalla-acciones{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start}
.pantalla-acciones form{margin:0}
.btn-chico{padding:9px 14px;font-size:.85rem;border-radius:11px}
.btn-peligro{background:rgba(255,93,115,.12);color:#ffc2cb;border:1px solid rgba(255,93,115,.4)}
.mas{flex:1 1 100%}
.mas summary{list-style:none;display:inline-flex}
.mas summary::-webkit-details-marker{display:none}
.mas[open] .mas-cuerpo{animation:baja .25s ease}
.mas-cuerpo{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--borde)}
.form-linea{display:flex;gap:8px;flex:1 1 260px}
.form-linea input[type=text]{flex:1;min-width:0;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:11px;padding:8px 12px}
@keyframes baja{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.vacio{text-align:center;padding:30px 10px}
.vacio-tv{width:220px;max-width:70%;aspect-ratio:16/9;margin:0 auto 20px;border:8px solid #1d2234;border-radius:12px;display:grid;place-items:center;
  background:radial-gradient(circle at 30% 30%,var(--c1),transparent 70%),#0d0f18;font-weight:800;font-size:1.4rem;letter-spacing:.12em;animation:flota-suave 4s ease-in-out infinite}
@keyframes flota-suave{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.pasos-mini{text-align:left;display:inline-block;color:var(--suave);margin:0;padding-left:20px}
.modulo.activo{text-decoration:none;color:var(--texto);border-color:color-mix(in srgb,var(--c1) 60%,var(--borde))}
.modulo.activo .modulo-fase{color:var(--c2)}
.nav-panel{color:var(--texto);text-decoration:none;font-weight:600;font-size:.85rem}
@media (max-width:520px){.nav-panel{display:none}}
/* Ajustes celular: nada se sale de la tarjeta */
.pantalla-cab{flex-wrap:wrap}
.pantalla-cab .estado{margin-left:auto;white-space:normal}
.mas-cuerpo{min-width:0}
.form-linea{flex:1 1 100%;min-width:0}
.form-linea button{flex:none}
.pantalla{min-width:0;overflow:hidden}
.pantalla-info{flex:1 1 170px}

/* ---------- Fase 2: panel del comerciante ---------- */
.encabezado{margin-bottom:18px}
.encabezado h1{font-size:clamp(1.5rem,5vw,2rem)}
.volver{display:inline-block;margin-bottom:8px;color:var(--suave);text-decoration:none;font-size:.9rem}
.volver:hover{color:var(--texto)}
.sub{font-size:1.05rem;margin:4px 0 2px}
.caja-form.ancho{max-width:560px}
.tarjeta-form{background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:18px;margin-bottom:16px}
.tarjeta-form>summary{cursor:pointer;list-style:none;font-weight:700}
.tarjeta-form>summary::-webkit-details-marker{display:none}
.tarjeta-form[open]>summary{margin-bottom:12px}
.fila-2,.fila-3{display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:640px){.fila-2{grid-template-columns:1fr 1fr}.fila-3{grid-template-columns:1fr 1fr 1fr}}
.botonera{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.botonera form{margin:0}
.fila-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fila-form input[type=text],.fila-form select{flex:1 1 180px;min-width:0;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:12px;padding:11px 12px}
.campo input[type=number],.campo input[type=url],.campo input[type=tel],.campo input[type=email],.campo input[type=text]{width:100%}
.campo input[type=color]{width:100%;height:46px;padding:4px;border-radius:12px;border:1px solid var(--borde);background:var(--sup2)}
.campo fieldset,.campo legend{padding:0}
fieldset.campo{border:0;margin:0;padding:0}
.interruptor{display:flex!important;align-items:center;gap:10px;cursor:pointer;align-self:end;padding:12px 0}
.interruptor input{width:22px;height:22px;accent-color:var(--c1)}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.centrado{text-align:center}

/* Elegir imagen (logo, foto de producto, medio de la diapositiva) */
.grid-elegir{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px;max-height:280px;overflow:auto;padding:2px}
.grid-elegir.grande{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));max-height:360px}
.elegir{position:relative;display:block;aspect-ratio:1;border-radius:12px;overflow:hidden;border:2px solid var(--borde);cursor:pointer;background:var(--sup2);transition:border-color .2s,transform .2s}
.elegir input{position:absolute;opacity:0}
.elegir img{width:100%;height:100%;object-fit:cover;display:block}
.elegir-vacio{display:grid;place-items:center;height:100%;font-size:.75rem;color:var(--suave);text-align:center;padding:4px}
.elegir:has(input:checked){border-color:var(--c1);transform:scale(.96);box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 35%,transparent)}

/* Tarjetas de lista (locales, empleados, listas) */
.lista-tarjetas{display:grid;gap:10px;margin-bottom:16px}
.tarjeta-fila{background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:14px 16px}
.tarjeta-fila>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none}
.tarjeta-fila>summary::-webkit-details-marker{display:none}
.tarjeta-fila[open]>summary{margin-bottom:14px}
.tarjeta-fila[open] form{margin-top:10px}
.tarjeta-fila.plana{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.tarjeta-fila.enlace{text-decoration:none;color:var(--texto);transition:border-color .2s,transform .2s}
.tarjeta-fila.enlace:hover{border-color:var(--c1);transform:translateY(-2px)}
.fila-titulo-txt{display:flex;flex-direction:column;min-width:0}
.fila-titulo-txt small{overflow:hidden;text-overflow:ellipsis}
.flecha{color:var(--c2);font-size:1.3rem}
.clave-nueva code{display:inline-block;margin:6px 6px 0 0;font-size:1.25rem;font-weight:800;letter-spacing:.06em;padding:6px 12px;border-radius:10px;background:rgba(0,0,0,.3);cursor:copy}
.clave-nueva code.copiado{outline:2px solid var(--ok)}
.clave-nueva small{display:block;margin-top:6px}
.borrar-abajo{margin-top:24px;text-align:right}

/* Tasa a un toque */
.tasa-rapida{background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 22%,var(--sup)),var(--sup));border:1px solid color-mix(in srgb,var(--c1) 45%,var(--borde));border-radius:22px;padding:16px;margin:4px 0 22px}
.tasa-cab{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.tasa-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tasa-par{font-weight:800;font-size:1.25rem;white-space:nowrap}
.tasa-input{flex:1 1 140px;min-width:0;font:inherit;font-size:2rem;font-weight:800;text-align:center;color:var(--texto);background:rgba(0,0,0,.25);
  border:2px solid var(--borde);border-radius:16px;padding:10px 12px;font-variant-numeric:tabular-nums;outline:none;transition:border-color .2s,box-shadow .2s}
.tasa-input:focus{border-color:var(--c2);box-shadow:0 0 0 5px color-mix(in srgb,var(--c2) 22%,transparent)}
.tasa-rapida.grande .tasa-input{font-size:2.6rem}
.tasa-auto{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:1.6rem}
.tasa-auto .chip{margin:0}
.opcion.deshabilitada{opacity:.5;cursor:not-allowed}
.opcion b{font-size:.95rem}.opcion small{font-weight:400;text-align:center}
.tabla{width:100%;border-collapse:collapse;font-size:.9rem}
.tabla td{padding:9px 6px;border-bottom:1px solid var(--borde)}
.tabla tr:last-child td{border-bottom:0}
.tabla .num{text-align:right;font-variant-numeric:tabular-nums}

/* Productos */
.lista-productos{display:grid;gap:8px}
.cat-titulo{margin:16px 0 4px;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c2)}
.producto{display:grid;grid-template-columns:48px 1fr;grid-template-areas:"foto info" "rapido rapido" "mas mas";gap:10px;align-items:center;
  background:var(--sup);border:1px solid var(--borde);border-radius:16px;padding:12px;transition:opacity .3s}
.producto.agotado{opacity:.6}
.producto-foto{grid-area:foto;width:48px;height:48px;border-radius:10px;object-fit:cover;background:var(--sup2)}
.producto-info{grid-area:info;min-width:0;display:flex;flex-direction:column}
.producto-info b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.producto-rapido{grid-area:rapido;display:flex;align-items:center;gap:8px;margin:0}
.producto-rapido{min-width:0}
.precio-rapido{flex:1;min-width:0;display:flex;align-items:center;gap:6px;background:var(--sup2);border:1px solid var(--borde);border-radius:12px;padding:0 10px}
.precio-rapido span{color:var(--suave);font-weight:700}
.precio-rapido input{flex:1;min-width:0;border:0;background:transparent;color:var(--texto);font:inherit;font-size:1.1rem;font-weight:700;padding:10px 0;outline:none;font-variant-numeric:tabular-nums}
.producto-mas{grid-area:mas;display:flex;gap:8px;justify-content:flex-end}
.producto-mas form{margin:0}
.mini-interruptor{position:relative;display:inline-block;width:48px;height:28px;flex:none;cursor:pointer}
.mini-interruptor input{position:absolute;opacity:0}
.mini-interruptor span{position:absolute;inset:0;border-radius:999px;background:#3a3f55;transition:background .2s}
.mini-interruptor span::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .2s}
.mini-interruptor input:checked+span{background:var(--ok)}
.mini-interruptor input:checked+span::after{transform:translateX(20px)}
@media (min-width:760px){
  .producto{grid-template-columns:48px 1fr 320px auto;grid-template-areas:"foto info rapido mas"}
}

/* Fotos y videos */
.espacio{margin-bottom:14px}
.espacio-barra{height:8px;border-radius:8px;background:var(--sup2);overflow:hidden;margin-bottom:6px}
.espacio-barra i{display:block;height:100%;background:linear-gradient(90deg,var(--c1),var(--c2));border-radius:8px;transition:width 1s}
.zona-subir{position:relative;display:grid;gap:12px;background:var(--sup);border:2px dashed var(--borde);border-radius:22px;padding:18px;margin-bottom:18px;transition:border-color .2s,background .2s}
.zona-subir.encima{border-color:var(--c2);background:color-mix(in srgb,var(--c2) 8%,var(--sup))}
.zona-subir.con-error{border-color:var(--error)}
.zona-subir input[type=file]{position:absolute;opacity:0;width:1px;height:1px}
.zona-subir-cuerpo{display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px;cursor:pointer;text-align:center}
.zona-icono{font-size:2.2rem;color:var(--c2);animation:flota-suave 3s ease-in-out infinite}
.progreso{height:8px;border-radius:8px;background:var(--sup2);overflow:hidden}
.progreso i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--c1),var(--c2));transition:width .2s}
.grid-medios{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.medio{position:relative;margin:0;background:var(--sup);border:1px solid var(--borde);border-radius:16px;overflow:hidden}
.medio img,.medio video{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#000}
.medio-tipo{position:absolute;top:8px;left:8px;font-size:.75rem;font-weight:700;padding:3px 8px;border-radius:999px;background:rgba(0,0,0,.6)}
.medio figcaption{display:grid;gap:6px;padding:10px}
.medio-nombre{font-size:.8rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.medio form{margin:0}

/* Diapositivas y listas */
.grid-diapos{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.diapo-tarjeta{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--texto);background:var(--sup);border:1px solid var(--borde);border-radius:16px;padding:10px;transition:transform .2s,border-color .2s}
.diapo-tarjeta:hover{transform:translateY(-3px);border-color:var(--c1)}
.diapo-mini{display:grid;place-items:center;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 35%,#0d0f18),#0d0f18)}
.diapo-mini img{width:100%;height:100%;object-fit:cover}
.diapo-mini.chica{width:64px;flex:none}
.diapo-icono{font-size:1.6rem;color:var(--c2)}
.editor{display:grid;gap:18px;align-items:start}
@media (min-width:980px){.editor{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.editor .previa{position:sticky;top:80px}}
.lista-marcar{display:grid;gap:6px;max-height:320px;overflow:auto;padding:2px}
.marcar{display:grid;grid-template-columns:22px 1fr;column-gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--sup2);border:1px solid transparent;cursor:pointer}
.marcar input{width:20px;height:20px;accent-color:var(--c1);grid-row:span 2}
.marcar small{grid-column:2}
.marcar:has(input:checked){border-color:var(--c1)}
.marcar.agotado span{text-decoration:line-through;opacity:.7}
.lista-orden{display:grid;gap:8px;margin-bottom:12px}
.orden-fila{display:flex;align-items:center;gap:10px;background:var(--sup);border:1px solid var(--borde);border-radius:14px;padding:8px 10px}
.orden-num{width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:50%;font-size:.8rem;font-weight:800;background:linear-gradient(135deg,var(--c1),var(--c2))}
.orden-nombre{flex:1;min-width:0;display:flex;flex-direction:column;text-decoration:none;color:var(--texto)}
.orden-nombre b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.orden-botones{display:flex;gap:4px}
.orden-botones form{margin:0}
.btn-icono{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--borde);background:var(--sup2);color:var(--texto);font-size:1rem;cursor:pointer}
.btn-icono.peligro{color:#ffc2cb;border-color:rgba(255,93,115,.4)}
.btn-icono.vacio{visibility:hidden}
.titulo-editable input{font-size:1.4rem!important;font-weight:800}

/* Vista previa */
.previa{background:var(--sup);border:1px solid var(--borde);border-radius:var(--radio);padding:14px;display:grid;gap:10px}
.previa-cab{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.previa-marco{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;border:6px solid #1d2234;box-shadow:0 14px 40px rgba(0,0,0,.4)}
.previa-marco iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;pointer-events:none}
.previa-pantalla{flex:1 1 100%}
.previa-pantalla[open] .previa{margin-top:10px}
.segmentado{display:inline-flex;background:var(--sup2);border:1px solid var(--borde);border-radius:999px;padding:3px}
.segmentado button{border:0;background:transparent;color:var(--suave);font:inherit;font-size:.78rem;font-weight:700;padding:6px 12px;border-radius:999px;cursor:pointer}
.segmentado button.activo{background:linear-gradient(135deg,var(--c1),var(--c2));color:#fff}
.rotacion-elegir{display:flex;align-items:center;gap:8px;flex:1;font-size:.85rem;font-weight:600}
.rotacion-elegir select{flex:1;min-width:0;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:11px;padding:8px 10px}
.derecha{text-align:right;margin:-6px 0 0}
.elegidos{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.elegidos li{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:12px;background:var(--sup2);border:1px solid var(--borde);font-size:.85rem}
.elegidos li span{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.elegidos li.mal{border-color:rgba(255,93,115,.5)}.elegidos li.mal small{color:#ffc2cb}
.elegidos li.bien{border-color:rgba(43,217,159,.5)}.elegidos li.bien small{color:#9ff5d6}
.elegidos li.subiendo{border-color:var(--c2)}
.ayuda-video{margin-bottom:12px}.ayuda-video summary{cursor:pointer;color:var(--c2);font-size:.9rem}
.btn:disabled{opacity:.5;pointer-events:none}

/* ---------- Fase 3: plantillas y programacion ---------- */
.galeria-plantillas{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.plantilla-tarjeta{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:18px;text-decoration:none;color:var(--texto);
  background:var(--sup);border:1px solid var(--borde);transition:transform .2s,border-color .2s}
.plantilla-tarjeta:hover{transform:translateY(-3px);border-color:var(--c1)}
.plantilla-tarjeta.recomendada{border-color:color-mix(in srgb,var(--c2) 55%,var(--borde))}
.plantilla-tarjeta .chip{position:absolute;top:10px;right:10px;margin:0;font-size:.62rem;padding:4px 8px}
.pl-icono{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;font-size:1.6rem;background:linear-gradient(135deg,var(--c1),var(--c2));margin-bottom:4px}
.campo textarea{width:100%;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:12px;padding:12px 14px;resize:vertical}
.campo input[type=datetime-local],.campo input[type=time],.campo input[type=date]{width:100%;font:inherit;font-size:16px;color:var(--texto);background:var(--sup2);border:1px solid var(--borde);border-radius:12px;padding:12px 14px;color-scheme:dark}
.interruptor.deshabilitada{opacity:.55}
.dias{display:flex;flex-wrap:wrap;gap:6px}
.dia{position:relative;cursor:pointer}
.dia input{position:absolute;opacity:0}
.dia span{display:inline-block;min-width:46px;text-align:center;padding:9px 10px;border-radius:12px;background:var(--sup2);border:1px solid var(--borde);font-weight:700;font-size:.85rem}
.dia input:checked+span{background:linear-gradient(135deg,var(--c1),var(--c2));border-color:transparent;color:#fff}
.pasos-app{display:grid;gap:10px;padding-left:22px;margin:16px 0}
.codigo-grande{text-align:center;font-size:2.6rem;font-weight:800;letter-spacing:.12em;margin:4px 0 14px;background:linear-gradient(135deg,#fff 40%,var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Fase 5: planes y cobros ---------- */
.banner-plan{display:block;margin:0 0 16px;padding:12px 16px;border-radius:14px;text-decoration:none;color:var(--texto);font-size:.92rem;
  background:color-mix(in srgb,var(--info) 18%,var(--sup));border:1px solid color-mix(in srgb,var(--info) 50%,var(--borde));animation:baja .4s ease}
.banner-plan b{color:var(--c2);white-space:nowrap}
.banner-gracia,.banner-pausada{background:rgba(255,93,115,.12);border-color:rgba(255,93,115,.5)}
.estado-plan{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:18px;border-radius:20px;margin-bottom:16px;
  background:var(--sup);border:1px solid var(--borde)}
.estado-plan h2{margin:6px 0 4px;font-size:1.4rem}
.estado-plan .chip{margin:0}
.estado-plan-ok{border-color:rgba(43,217,159,.5)}.estado-plan-error{border-color:rgba(255,93,115,.6)}
.estado-plan-uso{text-align:center}.estado-plan-uso b{display:block;font-size:2rem}.estado-plan-uso small{color:var(--suave)}
.planes{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.plan-tarjeta{position:relative;cursor:pointer}
.plan-tarjeta input{position:absolute;opacity:0}
.plan-cuerpo{display:flex;flex-direction:column;gap:6px;height:100%;padding:16px;border-radius:18px;background:var(--sup2);border:2px solid var(--borde);transition:border-color .2s,transform .2s}
.plan-tarjeta input:checked+.plan-cuerpo{border-color:var(--c1);transform:translateY(-2px);box-shadow:0 10px 30px -12px var(--c1)}
.plan-precio{font-size:1.6rem;font-weight:800}.plan-precio small{font-size:.8rem;font-weight:500;color:var(--suave)}
.plan-cuerpo ul{margin:0;padding-left:18px;color:var(--suave);font-size:.85rem}
.plan-cuerpo .chip{align-self:flex-start;margin:4px 0 0}
.metodos{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.metodo{position:relative;display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:14px;background:var(--sup2);border:2px solid var(--borde);cursor:pointer}
.metodo input{position:absolute;opacity:0}
.metodo:has(input:checked){border-color:var(--c1)}
.metodo.deshabilitada{opacity:.5;cursor:not-allowed}
.datos-cuenta{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin:8px 0 4px;font-size:.88rem}
.datos-cuenta dt{color:var(--suave)}.datos-cuenta dd{margin:0;font-weight:700;cursor:copy;word-break:break-all}
.total-plan{display:flex;justify-content:space-between;align-items:baseline;padding:14px 4px;border-top:1px dashed var(--borde)}
.total-plan b{font-size:1.8rem}
.estado-pago{display:inline-block;font-size:.75rem;font-weight:700;padding:4px 9px;border-radius:999px;background:var(--sup2)}
.estado-pago-aprobado{color:#9ff5d6;background:rgba(43,217,159,.14)}
.estado-pago-pendiente{color:#ffe08a;background:rgba(255,209,102,.14)}
.estado-pago-rechazado{color:#ffc2cb;background:rgba(255,93,115,.14)}
.pasarela-cab,.pago-cab{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.pasarela-modo{margin-top:14px;padding-top:14px;border-top:1px dashed var(--borde)}
.pasarela-modo.live h3{color:#ffc2cb}
.lista-chequeos{display:flex;flex-wrap:wrap;gap:4px 18px}
.segmentado a{color:var(--suave);text-decoration:none;font-size:.82rem;font-weight:700;padding:7px 13px;border-radius:999px}
.segmentado a.activo{background:linear-gradient(135deg,var(--c1),var(--c2));color:#fff}
nav.segmentado{margin-bottom:14px}
[data-dato][hidden]{display:none}

/* ===== Fase 6: marca blanca y superadmin ===== */
.fila-enlace{text-decoration:none;color:inherit;transition:transform .2s,border-color .2s}
.fila-enlace:hover{transform:translateY(-2px);border-color:var(--c1)}
.con-sufijo{display:flex;align-items:center;gap:0;background:var(--sup2);border:1px solid var(--borde);border-radius:12px;overflow:hidden}
.con-sufijo input{flex:1;min-width:0;border:0!important;background:transparent!important;border-radius:0!important}
.con-sufijo b{padding:0 12px;color:var(--suave);font-weight:600;white-space:nowrap;font-size:.9rem}
.marca-logo{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:6px 0 10px}
.marca-logo .campo{flex:1 1 220px;margin:0}
.marca-logo-vista{flex:none;width:76px;height:76px;border-radius:18px;display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 10px 30px rgba(0,0,0,.35);animation:flota 4s ease-in-out infinite}
.marca-logo-vista img{max-width:86%;max-height:86%;object-fit:contain;background:rgba(255,255,255,.92);border-radius:10px;padding:4px}
.marca-logo-vista b{font-size:2rem;color:#fff}
@keyframes flota{50%{transform:translateY(-4px) rotate(-2deg)}}
.estado-dominio{display:inline-block;font-size:.75rem;font-weight:700;padding:4px 9px;border-radius:999px;background:var(--sup2)}
.estado-dominio-activo{color:#9ff5d6;background:rgba(43,217,159,.14)}
.estado-dominio-pendiente_dns,.estado-dominio-pendiente_servidor{color:#ffe08a;background:rgba(255,209,102,.14)}
.pasos-dns{padding-left:20px;line-height:1.6}.pasos-dns li{margin-bottom:8px}.pasos-dns .tabla{margin-top:6px}
.pasos-dns code,.dominio-estado code{background:rgba(0,0,0,.3);padding:2px 6px;border-radius:6px}
.estado-negocio{display:inline-block;font-size:.72rem;font-weight:700;padding:4px 9px;border-radius:999px;background:var(--sup2);color:var(--suave)}
.estado-negocio-prueba{color:#bcd7ff;background:rgba(90,169,255,.15)}
.estado-negocio-activo{color:#9ff5d6;background:rgba(43,217,159,.14)}
.estado-negocio-gracia{color:#ffe08a;background:rgba(255,209,102,.14)}
.estado-negocio-pausado{color:#ffc2cb;background:rgba(255,93,115,.14)}
.estado-negocio-suspendido{color:#d7d9e0;background:rgba(150,155,170,.18)}
.barra-estados{display:flex;height:16px;border-radius:999px;overflow:hidden;gap:2px;margin:6px 0 12px}
.barra-estados i{display:block;min-width:4px;animation:crece .9s cubic-bezier(.2,.8,.2,1) both;transform-origin:left}
.barra-estados i.estado-negocio-prueba,.leyenda i.estado-negocio-prueba{background:var(--info)}
.barra-estados i.estado-negocio-activo,.leyenda i.estado-negocio-activo{background:var(--ok)}
.barra-estados i.estado-negocio-gracia,.leyenda i.estado-negocio-gracia{background:#ffd166}
.barra-estados i.estado-negocio-pausado,.leyenda i.estado-negocio-pausado{background:var(--error)}
.barra-estados i.estado-negocio-suspendido,.leyenda i.estado-negocio-suspendido{background:#8a90a3}
@keyframes crece{from{transform:scaleX(0)}}
.leyenda{display:flex;flex-wrap:wrap;gap:6px 16px;list-style:none;padding:0;margin:0;font-size:.85rem;color:var(--suave)}
.leyenda i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:middle}
.leyenda b{color:var(--texto)}
.grafico{width:100%;height:160px;display:block;color:var(--c1)}
.grafico rect{fill:currentColor;opacity:.85;transform-origin:bottom;transform-box:fill-box;animation:sube .7s cubic-bezier(.2,.8,.2,1) both}
.grafico rect:hover{opacity:1;fill:var(--c2)}
.grafico .eje{stroke:var(--borde);stroke-width:1}
@keyframes sube{from{transform:scaleY(0)}}
.tabla-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabla tr.suave td{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}
.buscador{margin-bottom:14px}
.estado-factura-pendiente{color:#ffe08a;background:rgba(255,209,102,.14)}
.estado-factura-en_revision{color:#bcd7ff;background:rgba(90,169,255,.15)}
.estado-factura-pagada{color:#9ff5d6;background:rgba(43,217,159,.14)}
.estado-factura-anulada{color:var(--suave)}
.ayuda-pasos{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;max-width:1000px;margin:0 auto 24px;padding:0 16px}
.ayuda-pasos .tarjeta{padding:20px}.ayuda-pasos h2{margin:0 0 10px;font-size:1.15rem}.ayuda-pasos li{margin-bottom:8px;line-height:1.5}
.limite-video a{color:inherit;font-weight:700}
details.detalle>summary.btn{list-style:none;display:inline-flex;margin:6px 0}
details.detalle>summary.btn::-webkit-details-marker{display:none}

/* ===== Fase 7: web publica ===== */
.w-nav{display:none;gap:4px}
.w-nav a{color:var(--suave);text-decoration:none;font-weight:600;font-size:.9rem;padding:8px 12px;border-radius:999px;transition:color .2s,background .2s}
.w-nav a:hover,.w-nav a.activo{color:var(--texto);background:rgba(255,255,255,.06)}
@media (min-width:900px){.w-nav{display:flex}}
@media (max-width:420px){.w-entrar{padding:7px 10px;font-size:.78rem}}
.btn-fantasma.btn-grande{padding:14px 22px;font-size:1rem}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:80px}

.w-hero{display:grid;gap:28px;align-items:center;padding:18px 0 10px}
.w-hero-txt{text-align:center}
.w-hero h1{font-size:clamp(2.3rem,7vw,4.2rem);font-weight:800;background:linear-gradient(135deg,#fff 30%,var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.w-acciones{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
@media (min-width:980px){
  .w-hero{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;padding-top:40px}
  .w-hero-txt{text-align:left}.w-hero .hero-sub{margin-left:0}.w-acciones{justify-content:flex-start}
}
.w-previa{background:rgba(20,24,38,.7);backdrop-filter:blur(8px)}
.w-previa .previa-cab .segmentado button{font-size:.8rem;padding:7px 12px}
.w-tv{border-width:10px;border-radius:16px;box-shadow:0 30px 80px -20px var(--c1),0 18px 50px rgba(0,0,0,.5);transition:aspect-ratio .4s}
.w-previa .previa-marco[style*="720 / 1280"]{max-width:320px;margin:0 auto}
.w-envivo{position:absolute;top:10px;right:10px;z-index:2;display:inline-flex;align-items:center;gap:6px;font-size:.68rem;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;background:rgba(0,0,0,.55);color:#fff;padding:4px 9px;border-radius:999px}
.w-envivo i{width:8px;height:8px;border-radius:50%;background:#ff3b5c;animation:latido 1.4s ease-in-out infinite}
@keyframes latido{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}

.w-seccion{margin-top:72px}
.w-seccion > h2,.w-final h2{text-align:center;font-size:clamp(1.5rem,4.5vw,2.2rem)}
.w-intro{text-align:center;max-width:640px;margin:0 auto 28px}
.w-pasos{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:14px;counter-reset:p}
.w-pasos li{position:relative;padding-top:56px}
.w-num{position:absolute;top:18px;left:20px;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 8px 20px -6px var(--c1)}
@media (min-width:760px){.w-pasos{grid-template-columns:repeat(3,1fr)}
  .w-pasos li:not(:last-child)::after{content:"";position:absolute;top:37px;left:68px;right:-14px;height:2px;background:linear-gradient(90deg,var(--c1),transparent)}}
.w-ventajas{margin-top:0}
@media (min-width:700px){.w-ventajas{grid-template-columns:repeat(3,1fr)}}
.w-ico{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.06);font-size:1.4rem;margin-bottom:10px;transition:transform .3s}
.tarjeta:hover .w-ico{transform:rotate(-8deg) scale(1.1)}

.w-planes{display:grid;gap:16px;grid-template-columns:1fr;align-items:stretch}
@media (min-width:700px){.w-planes{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}}
.w-plan{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--sup);border:1px solid var(--borde);border-radius:22px;padding:24px 20px;transition:transform .25s,border-color .25s}
.w-plan:hover{transform:translateY(-4px)}
.w-plan.destacado{border-color:var(--c1);background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 14%,var(--sup)),var(--sup));box-shadow:0 24px 60px -24px var(--c1)}
.w-plan h3{font-size:1.2rem;margin:0}
.w-plan-precio b{font-size:2.2rem;font-weight:800}.w-plan-precio small{color:var(--suave);margin-left:4px}
.w-plan ul{list-style:none;padding:0;margin:0;display:grid;gap:7px;flex:1}
.w-plan li{padding-left:24px;position:relative;font-size:.93rem}
.w-plan li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:800}
.w-plan p{margin:0}
.w-plan-cinta{position:absolute;top:-12px;right:18px;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#fff;
  background:linear-gradient(135deg,var(--c1),var(--c2));padding:5px 10px;border-radius:999px}

.w-app{display:grid;gap:20px;align-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 22%,var(--sup)),var(--sup));
  border:1px solid var(--borde);border-radius:24px;padding:28px 22px}
.w-app h2{font-size:clamp(1.4rem,4vw,1.9rem)}
@media (min-width:760px){.w-app{grid-template-columns:1fr auto;padding:36px}}
.w-app-codigo{text-align:center;background:rgba(0,0,0,.3);border-radius:18px;padding:18px 26px}
.w-app-codigo small{display:block;color:var(--suave);font-weight:600}
.w-app-codigo b{font-size:2.6rem;letter-spacing:.08em;font-variant-numeric:tabular-nums}

.w-faq{max-width:760px;margin:0 auto;display:grid;gap:10px}
.w-faq details{background:var(--sup);border:1px solid var(--borde);border-radius:16px;padding:14px 18px}
.w-faq summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:10px}
.w-faq summary::-webkit-details-marker{display:none}
.w-faq summary::after{content:"+";font-size:1.3rem;line-height:1;color:var(--c2);transition:transform .25s}
.w-faq details[open] summary::after{transform:rotate(45deg)}
.w-faq details p{margin:10px 0 0}

.w-final{margin:72px auto 10px;text-align:center;max-width:640px}
.w-tabs{display:grid;gap:18px;justify-items:center}
.w-tabs .segmentado{flex-wrap:wrap;justify-content:center}
.w-tabs .segmentado button{font-size:.9rem;padding:9px 16px}
.w-tab{width:100%}
.w-pie-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 20px;padding:24px 16px 4px;border-top:1px solid rgba(255,255,255,.05)}
.w-pie-nav a{color:var(--suave);text-decoration:none;font-size:.88rem;font-weight:600}
.w-pie-nav a:hover{color:var(--texto)}
.w-pie-nav + .pie{border-top:0}
.cpanel-paso{margin-top:6px}.cpanel-paso ol{padding-left:20px;line-height:1.6}
.w-vitrina{text-align:center;font-size:.78rem;font-weight:700;letter-spacing:.03em;padding:6px 16px;color:var(--suave);
  background:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 10px,transparent 10px 20px);border-bottom:1px solid rgba(255,255,255,.05)}
/* Aviso de cookies */
.cookies{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;display:flex;justify-content:center;opacity:0;transform:translateY(20px);transition:opacity .35s,transform .35s cubic-bezier(.2,.8,.2,1)}
.cookies.visible{opacity:1;transform:none}
.cookies-caja{max-width:640px;width:100%;background:rgba(20,24,38,.97);border:1px solid var(--borde);border-radius:20px;padding:18px 18px 16px;box-shadow:var(--sombra);backdrop-filter:blur(10px)}
.cookies-caja h2{font-size:1.05rem;margin:0 0 6px}
.cookies-caja p{margin:0 0 12px;color:var(--suave);font-size:.9rem}
.cookies-config{display:grid;gap:8px;margin:0 0 12px;font-size:.88rem}
.cookies-botones{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.cookies-botones .btn{padding:10px 16px;font-size:.88rem}
@media (max-width:520px){.cookies-botones .btn{flex:1 1 100%}}
.pie-boton{background:none;border:0;padding:0;font:inherit;color:var(--texto);font-weight:600;cursor:pointer}
.pie a,.pie-boton{font-size:.8rem}
/* Paginas legales */
.legal{max-width:780px;margin:0 auto;background:rgba(20,24,38,.6);border:1px solid var(--borde);border-radius:22px;padding:26px 22px}
.legal h1{font-size:clamp(1.6rem,5vw,2.2rem)}
.legal h2{font-size:1.1rem;margin:26px 0 8px}
.legal p{color:#d7dbe6}
.legal-borrador{display:inline-block;font-size:.75rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#1b1300;background:#ffd166;padding:5px 10px;border-radius:8px}
.legal-tabla th{text-align:left;font-size:.8rem;color:var(--suave)}.legal-tabla td{font-size:.86rem;vertical-align:top}
.tabla-scroll{overflow-x:auto}
.legal-nav{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:28px;padding-top:16px;border-top:1px solid var(--borde)}
/* Estado del sistema */
.salud{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-bottom:18px}
.salud-item h3{display:flex;align-items:center;gap:8px;font-size:.95rem}
.salud-item p{margin:4px 0;font-size:1.4rem}
.salud-punto{width:10px;height:10px;border-radius:50%;flex:none}
.salud-punto.bien{background:var(--ok);box-shadow:0 0 0 4px rgba(43,217,159,.15)}
.salud-punto.mal{background:var(--error);box-shadow:0 0 0 4px rgba(255,93,115,.18);animation:latido 1.4s ease-in-out infinite}
.acepto{align-items:flex-start;font-size:.88rem}