/* /buscar v2 (encargo de Alex, 23-oct-2026): lo nuevo de la tarjeta del buscador. Encima de v10.css de la V10 viva, sin
   tocar sus reglas: solo clases .bx-* y el ancho de .b-respuestas por vista. Móvil primero (375 y 360 px en una columna);
   en escritorio la tarjeta aprovecha el ancho, acomoda a la izquierda y a la derecha sin dejar huecos y crece con la página
   (scroll de la página, nunca dentro de la tarjeta). El material de las fichas es el cristal de los atajos de la barra.
   Sin movimiento con prefers-reduced-motion. */

/* La paleta propia del buscador, con nombre (paso 3, mejora 9): la base visual «entre el buscador y Hostess» que pidió
   Alex. Mismos valores que antes, ahora una sola vez; lo que ya existe en v10.css (papel, navy, naranja) usa la de v10. */
:root{--bx-tinta:#1B1F27;--bx-tenue:#4A5160;--bx-ambar:#F6A623;--bx-ambar-suave:#FFF8EC;--bx-ambar-borde:#F3D9A6;--bx-ambar-texto:#7A4A00;--bx-ambar-fuerte:#C9822C;--bx-ambar-medio:#E9A23B;--bx-borde:#E5E7EB;--bx-borde-fuerte:#D5D9E0;--bx-linea:#E7E9EE;--bx-ok:#245640;--bx-sobre-ambar:#1A1D24;--pointcare-crema:#F4F1EB;--pointcare-tinta:#0F172A;--pensar-paso:2.2s;--pensar-latido:1.4s}

/* La página recorre; la tarjeta crece hacia abajo y no se corta */
#capa-buscar.capa-completa{overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#capa-buscar .b-respuestas{max-height:none;overflow:visible;margin-bottom:24px;transition:width .45s cubic-bezier(.22,1,.36,1),top .45s cubic-bezier(.22,1,.36,1)}
#capa-buscar .aviso-buscador{transition:top .45s cubic-bezier(.22,1,.36,1)}
/* El aviso de privacidad pasa sobre la foto del fondo: sin pastilla quedaba en 2:1 a 360 px (hallazgo visual del 26-oct-2026). */
/* Antes de que monte la vista el aviso no se ve (estaba abajo y luego bajaba debajo de la tarjeta: salto de diseño). */
#capa-buscar:has(> .b-respuestas[hidden]) > .aviso-buscador{visibility:hidden}
#capa-buscar .aviso-buscador{background:rgb(255 255 255/.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;color:var(--bx-tinta)}
.b-respuestas[data-ancho=ancho]{width:min(1200px,calc(100% - 32px))}
.b-respuestas[data-ancho=angosto]{width:min(520px,calc(100% - 32px))}
/* Las pantallas de mensaje del alta (Confirmar, Límite): la columna de 680 px de la regla del director de arte. */
.b-respuestas[data-ancho=mensaje]{width:min(680px,calc(100% - 32px))}
.b-respuestas[data-ancho=completo]{width:calc(100% - 32px)}
@media (min-width:1024px){.b-respuestas[data-ancho=completo]{width:calc(100% - 48px)}}
.b-respuestas .b-asesor{display:grid;gap:16px}
.b-respuestas .b-asesor>*{margin:0}
@media (prefers-reduced-motion:reduce){#capa-buscar .b-respuestas,#capa-buscar .aviso-buscador{transition:none}}

/* Cristal líquido de las fichas (el mismo material de los atajos de la H) */
.bx-ficha,.bx-paso,.bx-escena,.bx-turno,.bx-chat,.bx-cifras>div,.bx-conector,.bx-acceso,.bx-marca,.bx-clases{
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(232,235,240,.5));
  border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 var(--papel),inset 0 -1px 2px rgba(120,126,140,.18),0 0 0 1px rgba(110,118,132,.18),0 14px 28px -18px rgba(20,24,32,.38);
  -webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%)}

/* Rejillas: una columna en el celular; en escritorio llenan el ancho (auto-fit estira lo que hay: sin huecos) */
.bx-rejilla{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.bx-banda{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}
.bx-dos{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}
.bx-col{display:grid;gap:12px;align-content:start;min-width:0}
@media (min-width:640px){
  /* 260 px: con 220 la escena de la tarjeta quedaba a 225 px y su ficha se leía a ~9 px (paso 3 visual) */
  .bx-rejilla{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  .bx-rejilla-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
  .bx-rejilla-sectores{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
}
@media (min-width:900px){
  .bx-banda,.bx-dos{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px}
  .bx-banda-3{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
  /* Consejo 3 · D6 (equipo D): la foto ya no estira a todo el alto de la columna («la foto está gigantísima», Alex). Toma
     el alto del texto de al lado, para que no quede hueco (la letra de la piel lo subió de 220 a 230 px), pero nunca pasa
     de 320 px: se recorta con object-fit, no crece. */
  .bx-banda-escena{align-items:stretch}
  .bx-banda-escena>.bx-escena{aspect-ratio:auto;height:auto;min-height:200px;max-height:320px;align-self:stretch}
}

/* Ficha de una herramienta: foto, estado, sector, para qué */
.bx-ficha{position:relative;display:grid;grid-template-rows:auto 1fr;min-width:0;border-radius:18px;overflow:hidden;color:var(--bx-tinta);text-decoration:none;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
a.bx-ficha:hover{transform:translateY(-3px);box-shadow:inset 0 1px 0 var(--papel),0 0 0 1px rgba(110,118,132,.22),0 22px 36px -18px rgba(20,24,32,.42)}
a.bx-ficha:focus-visible,.bx-paso-ir:focus-visible,.bx-acceso:focus-visible,.bx-avatar-hdr:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:3px}
.bx-ficha-media{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#E9EAEC}
.bx-media-baja{aspect-ratio:16/8}
.bx-ficha-media img,.bx-escena img,.bx-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.bx-video{opacity:0;transition:opacity .6s ease}
.bx-video.bx-va{opacity:1}
.bx-ficha-media .estado,.bx-escena .estado{position:absolute;top:10px;left:10px;z-index:1}
.bx-ficha-txt{display:grid;gap:6px;align-content:start;padding:14px 16px 16px;min-width:0}
.bx-ficha-txt .eyebrow{margin:0;font-size:var(--pl-f1,12px);line-height:1.35}
.bx-ficha-txt strong{font:800 var(--pl-f3,16px)/1.25 Manrope,system-ui,sans-serif;letter-spacing:-.01em;overflow-wrap:anywhere}
.bx-ficha-frase{color:var(--bx-tenue);font-size:var(--pl-f2,14px);line-height:1.45}
.bx-ficha-necesita{font-size:var(--pl-f2,14px);line-height:1.4;font-weight:600}
.bx-ficha-para{color:var(--bx-tenue);font-size:var(--pl-f2,14px);font-weight:700}
.bx-ficha-ir{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:2px;font:700 var(--pl-f2,14px)/1 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
.bx-ficha-ir svg,.bx-paso-ir svg,.b-asesor-btn svg,.bx-ok svg,.bx-cuenta svg,.b-asesor-eti svg,.bx-servicios svg,.bx-acceso svg,.bx-conector svg,.bx-perfil summary svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bx-proyecto .bx-ficha-media{aspect-ratio:16/9}
.bx-doble{display:grid;grid-template-columns:1fr 1fr}
.bx-doble img{position:static;width:100%;height:100%}
/* Logos de aliados: completos, sin recortar (Binoqular es un logotipo ancho) */
.bx-logo{display:grid;place-items:center;aspect-ratio:16/7;background:var(--papel);padding:18px 22px}
.bx-logo img{position:static;width:100%;height:100%;max-height:96px;object-fit:contain}

/* La escena grande de un sector o de una herramienta: su foto y, encima, su video en bucle */
/* Un clip de 16:9 con tope de 220 px de alto, no un cartel (Consejo 3 · D6) */
.bx-escena{position:relative;aspect-ratio:16/9;max-height:220px;border-radius:18px;overflow:hidden}

/* Pasos (portada y «Conoce Hostess») y servicios */
.bx-pasos{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin:0;padding:0;list-style:none}
@media (min-width:640px){.bx-pasos{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.bx-servicios{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
@media (min-width:640px){.bx-pasos .bx-paso{grid-template-columns:minmax(0,1fr)}.bx-pasos .bx-paso b{grid-row:auto}}
.bx-paso{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:2px;align-content:start;padding:12px 14px;border-radius:16px;animation:b-asesor-entra .42s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * 70ms)}
.bx-paso b{grid-row:span 3;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--bx-tinta);color:var(--papel);font:800 var(--pl-f2,14px)/1 Manrope,system-ui,sans-serif}
.bx-paso:first-child b{background:var(--bx-ambar);color:var(--bx-sobre-ambar)}
.bx-paso strong{font:800 var(--pl-f3,16px)/1.25 Manrope,system-ui,sans-serif}
.bx-paso span{color:var(--bx-tenue);font-size:var(--pl-f2,14px);line-height:1.45}
.bx-paso-ir{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--bx-tinta);font:700 var(--pl-f2,14px)/1 Manrope,system-ui,sans-serif;text-decoration:none}
.bx-servicios{display:grid;gap:10px;margin:0 0 12px;padding:0;list-style:none}
.bx-servicios li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:12px 14px;border-radius:14px;background:var(--bx-ambar-suave);border:1px solid var(--bx-ambar-borde)}
.bx-servicios li svg{width:20px;height:20px;margin-top:2px;color:var(--bx-ambar-texto)}
.bx-servicios strong{display:block;font:800 var(--pl-f3,16px)/1.3 Manrope,system-ui,sans-serif}
.bx-servicios span{color:var(--bx-tenue);font-size:var(--pl-f2,14px);line-height:1.45}
.bx-revisa{grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.bx-revisa{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.bx-paso,a.bx-ficha,.bx-video{animation:none;transition:none}}

/* Accesos de la portada con sesión: «Tus clases» primero y bien a la vista */
.bx-accesos{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
@media (min-width:640px){.bx-accesos{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}}
.bx-acceso{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;row-gap:2px;align-items:center;min-height:64px;padding:12px 16px;border-radius:16px;color:var(--bx-tinta);text-decoration:none}
.bx-acceso svg{grid-row:span 2;width:22px;height:22px}
.bx-acceso strong{font:800 var(--pl-f3,16px)/1.2 Manrope,system-ui,sans-serif}
.bx-acceso span{color:var(--bx-tenue);font-size:var(--pl-f2,14px);line-height:1.35}
.bx-acceso-clases{background:var(--bx-ambar-suave);border-color:var(--bx-ambar-borde)}

/* Listas, datos y botones */
.bx-lista{margin:0;padding-left:1.2em;display:grid;gap:6px;color:var(--bx-tinta)}
.bx-datos{display:grid;gap:10px;margin:0}
.bx-datos div{display:grid;gap:2px}
.bx-datos dt{font:700 var(--pl-f1,12px)/1.2 Manrope,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--bx-tenue)}
.bx-datos dd{margin:0;overflow-wrap:anywhere}
.bx-datos-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.b-asesor-botones.bx-izq{justify-content:flex-start;flex-wrap:wrap}
.b-asesor-btn{gap:6px}
.bx-filtro{display:flex;flex-wrap:wrap;gap:8px}
.b-ayuda-chip.bx-activo{background:var(--bx-tinta);color:var(--papel);border-color:var(--bx-tinta)}
a.b-ayuda-chip{display:inline-flex;align-items:center;text-decoration:none}
.bx-mas{margin-top:14px}
.bx-menu{grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.bx-menu{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bx-nota{margin:0;color:var(--bx-tenue);font-size:var(--pl-f2,14px);line-height:1.45}
.bx-cuando{margin:0 0 10px;font-weight:600;line-height:1.45}
.b-asesor-pie a,.bx-nota a{display:inline-flex;align-items:center;min-height:44px}
.bx-nota a,.b-asesor-pie a{color:var(--bx-tinta);font-weight:700;text-underline-offset:3px}
.bx-ok{display:flex;align-items:center;gap:8px;margin:0;color:var(--bx-ok);font-weight:700}
.bx-pregunta{margin:4px 0 0;font:800 var(--pl-f3,16px)/1.4 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
.bx-opciones{display:flex;flex-wrap:wrap;gap:8px}
.bx-seguir{display:flex;gap:8px;margin-top:14px;min-width:0}.bx-seguir input{flex:1;min-width:0;min-height:44px;padding:0 16px;border:1px solid rgba(20,20,30,.18);border-radius:999px;background:rgba(255,255,255,.85);font:inherit;font-size:var(--pl-f3,16px);color:inherit}.bx-seguir input:focus{outline:2px solid var(--bx-ambar-fuerte);outline-offset:2px}.bx-seguir button{min-height:44px;flex:none}
.bx-memoria{font-size:var(--pl-f2,14px)}
.bx-nueva{justify-self:start}
.bx-oculto{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.bx-sigue-pasos{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:0;padding:0;list-style:none}
@media (min-width:640px){.bx-sigue-pasos{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.bx-sigue-paso{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;min-height:56px;padding:10px 14px;border-radius:16px;border:1.5px solid var(--bx-ambar);background:var(--bx-ambar-suave);color:var(--bx-sobre-ambar);text-decoration:none;transition:transform .25s cubic-bezier(.2,.9,.3,1.2)}
.bx-sigue-paso:hover{transform:translateY(-2px)}
.bx-sigue-paso b{grid-row:span 2;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--bx-tinta);color:var(--papel);font:800 var(--pl-f2,14px)/1 Manrope,system-ui,sans-serif}
.bx-sigue-paso strong{font:800 var(--pl-f3,16px)/1.2 Manrope,system-ui,sans-serif}
.bx-sigue-paso span{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-sigue-paso:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.bx-sigue-paso{transition:none}}

/* Aliados: tecnología con su logo y su nombre */
.bx-marcas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
@media (min-width:640px){.bx-marcas{grid-template-columns:repeat(4,minmax(0,1fr))}}
.bx-marca{display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 14px;border-radius:14px;color:var(--bx-tinta)}
.bx-marca-svg{width:24px;height:24px;flex:none;fill:currentColor}
.bx-marca span{display:grid;min-width:0}
.bx-marca strong{font:800 var(--pl-f3,16px)/1.2 Manrope,system-ui,sans-serif}
.bx-marca small{color:var(--bx-tenue);font-size:var(--pl-f1,12px);line-height:1.3}

/* Precios: planes, la gráfica del Token y la compra por meses */
.bx-planes{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:640px){.bx-planes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.b-respuestas[data-ancho=ancho] .bx-planes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bx-plan{display:grid;align-content:start;gap:6px;padding:18px}
.bx-plan strong{font:800 var(--pl-f5,40px)/1.1 Manrope,system-ui,sans-serif}
.bx-plan-kicker{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-plan-oscuro{background:var(--navy);color:#F4F6F8}
.bx-plan-oscuro .bx-plan-kicker,.bx-plan-oscuro small,.bx-plan-oscuro .bx-puntos{color:#D6DAE1}
.bx-puntos{display:grid;gap:6px;margin:6px 0;padding:0;list-style:none;font-size:var(--pl-f2,14px);color:var(--bx-tinta)}
.bx-puntos li{display:flex;gap:6px;align-items:flex-start}
.bx-puntos svg{width:14px;height:14px;flex:none;margin-top:2px;fill:none;stroke:var(--bx-ok);stroke-width:2.4}
.bx-plan-oscuro .bx-puntos svg{stroke:#9FD7B9}
.bx-meses select{min-height:48px}
.bx-token{display:grid;gap:8px;min-width:0}
.bx-resuelve{font-size:var(--pl-f3,16px)}
@media (min-width:640px){.bx-resuelve{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bx-token .moneda{margin-right:6px}
.bx-token-grafica{min-width:0;padding:14px;border-radius:16px;background:var(--papel);border:1px solid var(--bx-borde)}
.bx-usdt p{margin:0}

/* Cuenta: el botón oficial de Google (pautas de Google Identity) y el correo */
.bx-entrar{display:grid;gap:12px}
.bx-o{display:flex;align-items:center;gap:12px;margin:2px 0;color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-o::before,.bx-o::after{content:"";flex:1;height:1px;background:var(--bx-borde-fuerte)}
.bx-ancho{width:100%;min-height:48px}
.gsi-boton{display:inline-flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:60px;padding:0 20px;border-radius:16px;background:var(--papel);border:1px solid #dadce0;color:#1F1F1F;font:600 var(--pl-f3,16px)/1 Roboto,Arial,sans-serif;letter-spacing:.25px;text-decoration:none;box-sizing:border-box;transition:background-color .2s,box-shadow .2s}
.gsi-boton:hover{background:#F8FAFF;box-shadow:0 1px 2px rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15)}
.gsi-boton:focus-visible{outline:2px solid #0B57D0;outline-offset:2px}
.b-asesor-botones .gsi-boton{width:auto}
.bx-g{width:20px;height:20px;flex:none}
.bx-form{display:grid;gap:10px}
.bx-campo{display:grid;gap:6px;font:700 var(--pl-f2,14px)/1.2 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
.bx-campo small{font-weight:400;font-size:var(--pl-f1,12px);color:var(--bx-tenue)}
.bx-campo input,.bx-campo select,.bx-campo textarea{width:100%;min-height:48px;padding:10px 14px;border-radius:14px;border:1px solid var(--bx-borde-fuerte);background:var(--papel);color:var(--bx-tinta);font:400 var(--pl-f3,16px)/1.4 Manrope,system-ui,sans-serif;box-sizing:border-box}
.bx-campo textarea{min-height:88px;resize:vertical}
.bx-campo input:focus-visible,.bx-campo select:focus-visible,.bx-campo textarea:focus-visible{outline:2px solid var(--bx-ambar);outline-offset:1px}
.btn-primary svg,.btn-glass svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bx-recarga{margin-top:12px;grid-template-columns:minmax(0,1fr);align-items:end}
@media (min-width:640px){.bx-recarga{grid-template-columns:minmax(0,1fr) auto}}
.bx-recarga .btn-primary{min-height:48px}

/* El círculo de la cuenta (cristal líquido) arriba a la derecha */
.bx-avatar{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none;background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(222,226,233,.7));border:1px solid rgba(255,255,255,.95);box-shadow:inset 0 1px 0 var(--papel),inset 0 -2px 4px rgba(120,126,140,.25),0 0 0 1px rgba(110,118,132,.22),0 8px 18px -10px rgba(20,24,32,.45);font:800 var(--pl-f3,16px)/1 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
.bx-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.bx-avatar-grande{width:64px;height:64px;font-size:var(--pl-f5,40px)}
.bx-avatar-hdr{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;border-radius:50%;text-decoration:none;pointer-events:auto}
.hdr-avatar{display:none;pointer-events:auto}
@media (max-width:1023px){.hdr-avatar{display:inline-flex}}
/* Con sesión, en teléfono el header lleva saldo y círculo: «¿Qué es?» queda en icono (su texto sigue para lectores) y el
   círculo, el menú y los espacios se compactan; sin esto el texto se metía bajo el círculo y a 360 px el menú salía de la
   pantalla (28-oct-2026). */
@media (max-width:420px){
  body .hdr>.hdr-in:has(.hdr-avatar){gap:4px;padding-left:10px;padding-right:10px}
  .hdr-in:has(.hdr-avatar) .hdr-saldo{padding:0 2px;gap:4px;font-size:var(--pl-f2,14px)}
  .hdr-in:has(.hdr-avatar) .hdr-que-es{width:44px;padding:0;gap:0;justify-content:center;font-size:0;flex:none}
  .hdr-in:has(.hdr-avatar) .menu-btn,.hdr-in:has(.hdr-avatar) .hdr-avatar>*{min-width:44px;width:44px;height:44px;min-height:44px;padding:0;flex:none}
}

/* Mi panel: tu espacio de trabajo */
.bx-panel-cab{display:flex;align-items:center;gap:14px}
.bx-panel-cab>div{display:grid;gap:2px;min-width:0}
.bx-clases{display:grid;gap:12px;padding:16px;border-radius:18px;background:var(--bx-ambar-suave);border-color:var(--bx-ambar-borde)}
.bx-clases-cuerpo{display:grid;gap:14px}
@media (min-width:900px){.bx-clases-cuerpo{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.bx-proxima{display:grid;gap:8px;align-content:start;padding:14px;border-radius:14px;background:var(--papel);border:1px solid var(--bx-ambar-borde)}
.bx-proxima strong{font:800 var(--pl-f3,16px)/1.3 Manrope,system-ui,sans-serif}
.bx-proxima .b-asesor-btn{justify-self:start}
.bx-saldo{gap:6px;padding:16px}
.bx-tienes{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.bx-tienes>.bx-rejilla{flex:1 1 100%}
@media (min-width:640px){.bx-tienes>.bx-rejilla{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}
.bx-saldo .b-asesor-btn{justify-self:start;margin-top:8px}
.bx-perfil{border-radius:18px;background:rgba(244,246,249,.92);border:1px solid var(--bx-borde)}
.bx-perfil summary{display:flex;align-items:center;gap:10px;min-height:56px;padding:12px 16px;cursor:pointer;list-style:none}
.bx-perfil summary::-webkit-details-marker{display:none}
.bx-perfil summary span{display:grid;gap:2px}
.bx-perfil summary small{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-perfil summary:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:-2px;border-radius:18px}
.bx-form-perfil{padding:0 16px 16px}
.bx-foto-campo{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bx-foto-campo .b-asesor-btn{position:relative;cursor:pointer}
.bx-campos{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
@media (min-width:640px){.bx-campos{grid-template-columns:repeat(2,minmax(0,1fr))}.bx-campo-ancho{grid-column:1/-1}}
@media (min-width:1000px){.bx-campo-ancho{grid-column:auto}.bx-campos .bx-campo-ancho:last-child{grid-column:1/-1}}
.bx-atajos{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:0}
.bx-atajos legend{margin-bottom:6px;font:700 var(--pl-f2,14px)/1.2 Manrope,system-ui,sans-serif}
.bx-casilla{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--bx-borde-fuerte);background:var(--papel);font-size:var(--pl-f2,14px);cursor:pointer}
.bx-casilla input{width:18px;height:18px}
.bx-form-perfil .btn-primary{justify-self:start}
.bx-conectores{display:grid;gap:10px}
.bx-conector{display:grid;gap:8px;align-content:start;padding:14px 16px;border-radius:16px;min-width:0}
.bx-conector-cab{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bx-conector-cab strong{font:800 var(--pl-f3,16px)/1.25 Manrope,system-ui,sans-serif}
.bx-conector-cab .bx-chip-estado{margin-left:auto}

/* La Torre de la sesión madre (solo la cuenta de Hostess) */
.bx-torre{display:grid;gap:12px;padding:16px;border-radius:18px;background:rgba(244,246,249,.92);border:1px solid var(--bx-borde)}
.bx-torre h5{margin:6px 0 0}
.bx-cifras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@media (min-width:640px){.bx-cifras{grid-template-columns:repeat(4,minmax(0,1fr))}}
.bx-cifras>div{display:grid;gap:2px;padding:10px 12px;border-radius:14px}
.bx-cifras strong{font:800 var(--pl-f4,20px)/1 Manrope,system-ui,sans-serif}
.bx-cifras span{font-size:var(--pl-f2,14px);color:var(--bx-tenue)}
.bx-turnos,.bx-msgs{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.bx-turno{display:grid;gap:10px;padding:12px 14px;border-radius:14px}
.bx-turno>div:first-child{display:grid;gap:4px;min-width:0}
.bx-turno span,.bx-turno small{color:var(--bx-tenue);font-size:var(--pl-f2,14px);overflow-wrap:anywhere}
.bx-turno a{display:inline-flex;align-items:center;gap:4px;min-height:44px;color:var(--bx-tinta);font-weight:700;font-size:var(--pl-f2,14px)}
.bx-turno a svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
.bx-turno .b-asesor-botones{justify-content:flex-start}
.bx-chats{display:grid;gap:8px}
.bx-chat{display:grid;gap:4px;padding:10px 12px;border-radius:14px;font-size:var(--pl-f2,14px)}
.bx-chat span:last-child{color:var(--bx-tenue)}
.bx-chip-estado{justify-self:start;padding:2px 8px;border-radius:999px;background:var(--bx-borde);font:700 var(--pl-f1,12px)/1.5 Manrope,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.bx-chip-estado.bx-trabajando{background:#DDEFE5;color:var(--bx-ok)}
.bx-chip-estado.bx-revisar{background:#FFF1D6;color:var(--bx-ambar-texto)}
.bx-chip-estado.bx-esperando{background:#FDECEC;color:#8A2626}
.bx-msgs{max-height:none;padding:2px}
.bx-msg{padding:10px 12px;border-radius:14px;background:var(--papel);border:1px solid var(--bx-borde)}
.bx-msg.bx-de-alex{background:var(--bx-ambar-suave);border-color:var(--bx-ambar-borde)}
.bx-msg small{color:var(--bx-tenue);font-size:var(--pl-f1,12px)}
.bx-msg p{margin:2px 0 0;white-space:pre-line;overflow-wrap:anywhere}
.bx-escribir{margin-top:10px}
.bx-escribir .btn-primary{justify-self:start}

/* La respuesta del buscador */
.bx-guia{display:grid;gap:10px}
.bx-guia>p{margin:0}
.bx-fuentes{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.bx-fuentes li{min-width:0;max-width:100%}
.bx-fuente{display:inline-flex;align-items:center;gap:6px;min-height:44px;max-width:100%;padding:8px 14px;border-radius:999px;border:1px solid var(--bx-borde-fuerte);background:var(--papel);color:var(--bx-tinta);font:700 var(--pl-f2,14px)/1.3 Manrope,system-ui,sans-serif;text-decoration:none;overflow-wrap:anywhere}
.bx-fuente svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
a.bx-fuente:hover{border-color:var(--bx-tinta)}
a.bx-fuente:focus-visible{outline:2px solid var(--bx-ambar);outline-offset:2px}

/* Las ligas de atribución de la gráfica (TradingView y Kraken) también se tocan con el pulgar */
.bx-token-grafica .th-fuente a{display:inline-flex;align-items:center;min-height:44px}
.bx-token-grafica .th-lienzo a{display:inline-flex!important;align-items:center;justify-content:center;min-width:44px;min-height:44px}

.gsi-boton svg{width:24px;height:24px;flex:none}
.bx-marca>a{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;min-height:44px;width:100%}
.bx-marca .bx-marca-svg{width:28px;height:28px;flex:none}
.bx-marca:hover{border-color:#c9ced6}
.bx-contacto .b-asesor-botones{margin-top:12px}
.bx-plan{position:relative;transition:transform .25s ease,box-shadow .25s ease}
.bx-plan:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(17,24,39,.12)}
.bx-plan-destacado{border:2px solid var(--bx-ambar-medio)}
.bx-plan-sello{position:absolute;top:12px;right:12px;background:var(--bx-ambar-medio);color:#1f2328;font-weight:700;font-size:var(--pl-f1,12px);padding:4px 10px;border-radius:999px}
.bx-plan-tokens{display:flex;align-items:center;gap:8px;margin:10px 0 4px;padding:10px 12px;border-radius:12px;background:rgba(233,162,59,.14);font-size:var(--pl-f3,16px)}
.b-asesor-precio .bx-plan-tokens strong{display:inline;font-size:var(--pl-f3,16px);line-height:1.3;font-weight:700;letter-spacing:0}
.bx-plan-tokens span{line-height:1.3}
/* Las 4 asesorías del plan (Tokens de asesoría, 27-oct-2026): debajo del Token Hostess, en neutro para no confundirlos */
.bx-plan-asesoria{display:flex;align-items:flex-start;gap:8px;margin:0 0 4px;padding:10px 12px;border-radius:12px;background:var(--bx-linea);font-size:var(--pl-f3,16px)}
.bx-plan-asesoria svg{flex:none;width:20px;height:20px;margin-top:1px}
.b-asesor-precio .bx-plan-asesoria strong{display:inline;font-size:var(--pl-f3,16px);line-height:1.3;font-weight:700;letter-spacing:0}
.bx-plan-asesoria span{line-height:1.3}
/* Su propio Claude (Alex, 27-oct-2026): la cuenta Claude Max de cada plan y la casilla «Ya tengo Claude Max» */
.bx-plan-precio{display:grid;gap:2px}
.bx-plan-claude{display:flex;align-items:flex-start;gap:8px;margin:0 0 4px;padding:10px 12px;border-radius:12px;background:rgba(217,119,87,.12);font-size:var(--pl-f3,16px)}
.bx-claude-logo{flex:none;width:20px;height:20px;margin-top:1px;stroke:none}
.b-asesor-precio .bx-plan-claude strong{display:inline;font-size:var(--pl-f3,16px);line-height:1.3;font-weight:700;letter-spacing:0}
.bx-plan-claude span{line-height:1.3}
.bx-plan-acciones{display:grid;gap:6px}
.bx-con-claude{display:grid;gap:12px}
.bx-ya-claude{display:flex;align-items:center;gap:12px;min-height:44px;padding:12px 14px;border:1px solid var(--bx-linea);border-radius:14px;background:#fff;cursor:pointer;font-size:var(--pl-f3,16px);line-height:1.35}
.bx-ya-claude input{flex:none;width:22px;height:22px;margin:0;accent-color:#D97757}
.bx-ya-claude span{display:grid;gap:2px}
.bx-ya-claude strong{font-weight:700}
.bx-con-claude .bx-solo-su-claude{display:none}
.bx-con-claude[data-ya-claude] .bx-solo-lleno{display:none}
.bx-con-claude[data-ya-claude] div.bx-solo-su-claude{display:grid}
.bx-con-claude[data-ya-claude] span.bx-solo-su-claude{display:inline}
.bx-con-claude[data-ya-claude] p.bx-solo-su-claude{display:block}
.bx-con-claude[data-ya-claude] a.bx-solo-su-claude{display:inline-flex}
.bx-gratis{margin:8px 0 0}
.bx-plan-oscuro .b-asesor-btn{margin-top:12px}
@media (prefers-reduced-motion:reduce){.bx-plan{transition:none}.bx-plan:hover{transform:none}}
.bx-token-vale{display:flex;align-items:center;gap:14px;margin:8px 0 14px;padding:14px 16px;border-radius:16px;background:rgba(233,162,59,.14)}
.bx-token-vale p{margin:0;display:grid;gap:4px}
.bx-token-vale strong{font-size:var(--pl-f4,20px);line-height:1.25}
.bx-token-vale span{font-size:var(--pl-f2,14px);color:#596373}
.bx-cuenta .gsi-boton svg,.gsi-boton svg{stroke:none;width:24px;height:24px}

/* Lo que veo en tu negocio (diagnóstico en vivo de Claude) y su siguiente paso (Alex, 26-oct-2026). */
.bx-hallazgos ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.bx-hallazgos li { padding: 12px 14px; border-radius:14px; background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.06); line-height: 1.45; overflow-wrap: anywhere; }
.bx-paso { margin-top: 14px; }
.bx-paso-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; font-size: var(--pl-f3,16px); text-decoration: none; }
@media (max-width: 480px) { .bx-paso-btn { width: 100%; } }

/* El experto de la asesoría (Alex, 26-oct-2026; 28-oct: el símbolo de Hostess, sus conectores con su logo y qué hace con
   cada uno; tocar la tarjeta o un conector abre su hoja de vidrio, vidrio-hoja.js). */
.bx-experto { display: grid; gap: 10px; min-width: 0; padding: 14px 16px; border-radius:16px; background: rgba(255,255,255,.72); border: 1px solid rgba(0, 0, 0, 0.06); margin-top: 12px; }
.bx-experto-abrir, .bx-experto-con { display: grid; align-items: center; gap: 2px 12px; width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: 6px; border: 0; border-radius:14px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background-color .2s; }
.bx-experto-abrir { grid-template-columns: 48px minmax(0, 1fr); }
.bx-experto-abrir:hover, .bx-experto-con:hover { background: rgba(255,255,255,.9); }
.bx-experto-abrir:focus-visible, .bx-experto-con:focus-visible { outline: 3px solid var(--bx-ambar); outline-offset: 2px; }
.bx-experto-simbolo { display: block; width: 48px; height: 48px; object-fit: contain; }
.bx-experto-quien { display: grid; gap: 2px; min-width: 0; }
.bx-experto-quien span, .bx-experto-quien small { color: var(--bx-tenue); font-size: var(--pl-f2,14px); line-height: 1.4; }
.bx-experto-quien small { font-size: var(--pl-f2,14px); }
.bx-experto-eti { margin: 4px 0 0; font: 800 var(--pl-f1,12px)/1.3 Manrope, system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--bx-tenue); }
.bx-experto-conectores { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; margin: 0; padding: 0; list-style: none; min-width: 0; }
@media (min-width: 640px) { .bx-experto-conectores { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bx-experto-con { grid-template-columns: 40px minmax(0, 1fr); }
.bx-experto-logo { display: grid; place-items: center; width: 40px; height: 40px; border-radius:12px; background: var(--papel); box-shadow: 0 0 0 1px rgba(110,118,132,.18); }
.bx-experto-logo .bx-marca-svg { width: 24px; height: 24px; }
.bx-experto-logo .bx-marca-ancha, .p3-aliado .p3-logo .bx-marca-ancha { width: 34px; height: auto; }
.bx-experto-con-txt { display: grid; gap: 1px; min-width: 0; }
.bx-experto-con-txt strong { font: 800 var(--pl-f2,14px)/1.2 Manrope, system-ui, sans-serif; }
.bx-experto-con-txt small { color: var(--bx-tenue); font-size: var(--pl-f2,14px); line-height: 1.35; }
.bx-experto-ligas { margin: 0; display: flex; flex-wrap: wrap; gap: 0 16px; }
.bx-experto a { display: inline-flex; align-items: center; min-height: 44px; text-underline-offset: 3px; overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) { .bx-experto-abrir, .bx-experto-con { transition: none; } }
/* Las tarjetas de Aliados son botones que abren su hoja de vidrio (28-oct-2026). */
button.p3-aliado, button.bx-ficha-boton { width: 100%; margin: 0; border: 0; font: inherit; text-align: left; cursor: pointer; }
button.p3-aliado { border: 1px solid rgba(255,255,255,.9); }
button.bx-ficha-boton { padding: 0; background: var(--papel); box-shadow: 0 0 0 1px rgba(110,118,132,.18); }
button.bx-ficha-boton:focus-visible { outline: 3px solid var(--bx-ambar); outline-offset: 3px; }
/* «Que me llamen en 15 minutos» (Alex, 26-oct): el número ahí mismo, una columna en celular. */
.bx-llamar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.bx-llamar label { font: 800 var(--pl-f3,16px)/1.25 Manrope, system-ui, sans-serif; }
.bx-llamar-fila { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.bx-llamar-fila input { flex: 1 1 200px; min-width: 0; min-height: 44px; padding: 0 16px; border: 1px solid rgba(20, 20, 30, .18); border-radius:999px; background: rgba(255, 255, 255, .85); font: inherit; font-size: var(--pl-f3,16px); color: inherit; }
.bx-llamar-fila input:focus { outline: 2px solid var(--bx-ambar-fuerte); outline-offset: 2px; }
.bx-llamar-listo { margin: 0; font-weight: 700; }
/* La portada como recorrido (paso 3, 26-oct-2026): secciones numeradas, con aire, que terminan en la cuenta y el plan. */
.bx-recorrido .b-ayuda-grupo{margin-bottom:8px}
.bx-seccion{margin-top:36px;padding-top:32px;border-top:1px solid var(--bx-linea)}
.bx-seccion-cab{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;margin-bottom:18px}
.bx-seccion-cab b{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--bx-tinta);color:var(--papel);font:800 var(--pl-f3,16px)/1 Manrope,system-ui,sans-serif}
.bx-seccion[data-seccion="herramientas"] .bx-seccion-cab b{background:var(--bx-ambar);color:var(--bx-tinta)}
.bx-seccion-titulo{margin:4px 0 0;font:800 var(--pl-f4-5,20px)/1.15 Manrope,system-ui,sans-serif;letter-spacing:-.01em;color:var(--bx-tinta)}
.bx-seccion-cab p{margin:6px 0 0;max-width:62ch;color:var(--bx-tenue);font-size:var(--pl-f3,16px);line-height:1.5}
.bx-seccion .bx-servicios{margin-top:14px}
.bx-seccion .b-asesor-botones{margin-top:16px}
@media (min-width:900px){.bx-seccion{margin-top:48px;padding-top:40px}}
/* Las herramientas de la portada: en celular se deslizan de lado (una y un pedazo de la siguiente); en escritorio, 3 por fila. */
@media (max-width:639px){
  .bx-seccion .bx-rejilla{grid-auto-flow:column;grid-auto-columns:82%;grid-template-columns:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:2px 2px 10px;scrollbar-width:none}
  .bx-seccion .bx-rejilla::-webkit-scrollbar{display:none}
  .bx-seccion .bx-rejilla>.bx-ficha{scroll-snap-align:start}
}
@media (min-width:640px){.bx-seccion .bx-rejilla{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:960px){.bx-seccion .bx-rejilla{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Al bajar, el header de Hostess se hace chico (paso 3, 26-oct-2026; buscar/_/al-bajar.js pone body.hdr-chico). */
body.en-buscar .hdr{transition:height .3s cubic-bezier(.22,1,.36,1),padding .3s cubic-bezier(.22,1,.36,1)}
body.en-buscar .hdr>.hdr-in{transition:height .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
body.en-buscar .marca img{transition:height .3s cubic-bezier(.22,1,.36,1)}
body.en-buscar.hdr-chico .hdr{height:64px;padding:8px 0}
body.en-buscar.hdr-chico .hdr>.hdr-in{height:48px;box-shadow:0 6px 24px rgba(20,26,38,.08)}
body.en-buscar.hdr-chico .marca img{height:24px}
@media (max-width:640px){body.en-buscar.hdr-chico .hdr{height:60px;padding:6px 0}}
@media (prefers-reduced-motion:reduce){body.en-buscar .hdr,body.en-buscar .hdr>.hdr-in,body.en-buscar .marca img{transition:none}}
/* La barra guardada (buscar/_/al-bajar.js): aparece debajo del header chico cuando la de vidrio sube con la página. */
.bx-guardada{position:fixed;z-index:41;left:50%;top:72px;display:flex;align-items:center;gap:8px;width:min(calc(100vw - 32px),560px);height:48px;padding:0 4px 0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.9);background:linear-gradient(125deg,rgba(255,255,255,.92),rgba(241,243,246,.82));-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);box-shadow:inset 0 1px 0 var(--papel),0 10px 30px rgba(20,26,38,.12);opacity:0;transform:translate(-50%,-12px) scale(.96);pointer-events:none;transition:opacity .25s ease,transform .35s cubic-bezier(.22,1,.36,1)}
.bx-guardada.bx-visible{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.bx-guardada input{flex:1;min-width:0;height:44px;border:0;background:transparent;font:500 var(--pl-f3,16px)/1.2 Manrope,system-ui,sans-serif;color:var(--bx-tinta);outline:none}
.bx-guardada input::placeholder{color:#7D838D}
.bx-guardada button{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;cursor:pointer;color:var(--bx-tinta)}
.bx-guardada .bx-guardada-ir{width:40px;height:40px;background:var(--bx-tinta);color:var(--papel)}
.bx-guardada .bx-guardada-ir svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bx-guardada-h img{width:22px;height:auto}
.bx-guardada:focus-within{box-shadow:inset 0 1px 0 var(--papel),0 0 0 2px var(--bx-tinta),0 10px 30px rgba(20,26,38,.12)}
@media (max-width:640px){.bx-guardada{top:66px}}
@media (prefers-reduced-motion:reduce){.bx-guardada{transition:none}}
.bx-retomar{margin:4px 0 8px}
/* «¿Por qué ves esto?» (porque.js): cerrado, discreto, y su resumen es un control de 44 px. */
.bx-porque{margin:2px 0 12px;font-size:var(--pl-f2,14px);line-height:1.45;color:var(--bx-tenue)}
.bx-porque summary{display:list-item;padding:12px 0;line-height:20px;cursor:pointer;font-weight:700;color:var(--bx-tinta)}
.bx-porque ul{margin:4px 0 8px;padding-left:20px}
.bx-porque-sin{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.bx-seccion{scroll-margin-top:132px}
/* Más como Anthropic (paso 3, Alex): la portada abre con un titular grande, texto que respira y más margen. */
.bx-recorrido>.b-asesor-cab{padding:6px 0 10px}
.bx-recorrido>.b-asesor-cab .b-asesor-titular{font-size:var(--pl-f6,40px);line-height:1.06;letter-spacing:-.03em;max-width:20ch;text-wrap:balance}
.bx-recorrido>.b-asesor-cab .b-asesor-social{margin-top:14px;max-width:60ch;font-size:var(--pl-f3-4,16px);line-height:1.55;color:var(--bx-tenue)}
@media (min-width:900px){#capa-buscar .b-respuestas[data-vista=inicio]{padding:44px 56px 40px}}
/* Tu diagnóstico en 3 preguntas (buscar/_/tres-preguntas.js), dentro de «Herramientas para tu negocio». */
.bx-diag{display:grid;gap:10px;margin:0 0 20px;padding:20px;border-radius:20px;background:var(--bx-ambar-suave);border:1px solid var(--bx-ambar-borde)}
.bx-diag-paso{margin:0;color:var(--bx-ambar-texto);font:800 var(--pl-f1,12px)/1.2 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.bx-diag-pregunta{margin:0;font:800 var(--pl-f4-5,20px)/1.2 Manrope,system-ui,sans-serif;letter-spacing:-.01em;color:var(--bx-tinta)}
.bx-diag-ayuda{margin:0;max-width:66ch;color:var(--bx-tenue);font-size:var(--pl-f3,16px);line-height:1.5}
.bx-diag .b-ayuda-chips{display:flex;flex-wrap:wrap;gap:8px}
.bx-diag .b-ayuda-chip[aria-pressed=true]{background:var(--bx-tinta);color:var(--papel);border-color:var(--bx-tinta)}
.bx-diag .b-asesor-btn[disabled]{opacity:.45;cursor:not-allowed}
.bx-paso-redes{margin:4px 0}.bx-paso-redes>summary{list-style:none;width:fit-content}.bx-paso-redes>summary::-webkit-details-marker{display:none}.bx-paso-redes[open]>summary{margin-bottom:10px}
.bx-plan-tuyo{outline:3px solid var(--bx-tinta);outline-offset:2px}
.bx-plan-para-ti{justify-self:start;padding:4px 10px;border-radius:999px;background:var(--bx-tinta);color:var(--papel);font:800 var(--pl-f1,12px)/1.3 Manrope,system-ui,sans-serif}
/* En celular, los 11 giros del diagnóstico van en dos columnas (en una sola fila cada uno se hacía muy largo). */
/* Elegir la herramienta antes de crear la cuenta (elegir.js · tres-preguntas.js · su-herramienta.js, 28-oct-2026) */
.bx-elegir-op{position:relative;display:grid;grid-template-rows:1fr auto;gap:8px;min-width:0}
.bx-elegir-botones{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.bx-elegir-botones .b-asesor-btn{min-height:44px;flex:1 1 auto;justify-content:center;white-space:normal;text-align:center}
.bx-elegir-ya{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--bx-ok);font-weight:800}
.bx-elegida>.bx-ficha{box-shadow:0 0 0 2px var(--bx-tinta)}
[data-diag-elegir]{min-width:0}
.bx-seccion .bx-rejilla>.bx-elegir-op{scroll-snap-align:start}
.bx-nace p,.bx-su-herramienta p{margin:0 0 8px}
.bx-nace p>svg{width:18px;height:18px;margin-right:6px;vertical-align:-3px}
.bx-su-herramienta{display:grid;gap:6px;margin:0 0 16px}
.bx-su-nombre{margin:0;font:800 var(--pl-f4,20px)/1.25 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
/* En el paso de elegir de las 3 preguntas, en celular, tarjetas compactas: «Elegir esta» a la vista, no al ras (29-oct-2026). */
@media (max-width:639px){.bx-elegir-paso .bx-ficha-media{aspect-ratio:2/1}.bx-elegir-paso .bx-ficha-txt{gap:4px;padding:10px 14px 12px}.bx-elegir-paso .bx-ficha-txt .eyebrow,.bx-elegir-paso .bx-calif{display:none}.bx-elegir-paso .bx-ficha-frase{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}}
@media (max-width:639px){.bx-diag [aria-label="Giros"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.bx-diag{padding:16px}.bx-diag [aria-label="Giros"]{gap:6px}.bx-diag [aria-label="Giros"] .b-ayuda-chip{justify-content:center;padding:8px 10px;text-align:center;white-space:normal;overflow-wrap:normal;word-break:normal;font-size:var(--pl-f2,14px)}}
/* Herramientas por tarea (paso 3, mejora 8 de la investigación): seis tarjetas y el giro como filtro plegable. */
.bx-tareas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@media (min-width:900px){.bx-tareas{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bx-tarea{display:grid;gap:2px;min-height:64px;align-content:center;padding:12px 14px;border-radius:16px;border:1px solid var(--bx-linea);background:var(--papel);color:var(--bx-tinta);text-decoration:none;transition:border-color .2s,transform .2s}
.bx-tarea:hover{border-color:var(--bx-tinta);transform:translateY(-1px)}
.bx-tarea strong{font:800 var(--pl-f3,16px)/1.25 Manrope,system-ui,sans-serif}
.bx-tarea span{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-tarea.bx-activo{background:var(--bx-tinta);border-color:var(--bx-tinta);color:var(--papel)}
.bx-tarea.bx-activo span{color:var(--bx-borde-fuerte)}
.bx-tarea:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:2px}
.bx-por-giro summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;font:700 var(--pl-f2,14px)/1.2 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
.bx-por-giro[open] summary{margin-bottom:8px}
@media (prefers-reduced-motion:reduce){.bx-tarea{transition:none}}
.bx-por-giro summary::after{content:"+";margin-left:8px;font-weight:800}
.bx-por-giro[open] summary::after{content:"−"}
/* La barra guardada con el material de vidrio del buscador (Alex, 26-oct: «que tenga el diseño del buscador inteligente»):
   la misma imagen de la barra grande, estirada por los lados, y la H plateada. */
.bx-guardada{border:0 solid transparent;border-width:0 26px;padding:0 0 0 0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-image:url(/buscar/_/material-barra.webp) 0 160 fill / 0 26px stretch;box-shadow:0 12px 30px rgba(20,26,38,.16)}
.bx-guardada:focus-within{box-shadow:0 0 0 2px var(--bx-tinta),0 12px 30px rgba(20,26,38,.16)}
.bx-guardada-h img{filter:grayscale(1) contrast(.85) brightness(1.08) drop-shadow(0 1px 0 rgba(255,255,255,.9))}
.bx-guardada input::placeholder{color:#555B66}

/* Auditoría visual del 26-oct-2026 contra el sistema de diseño: contraste, controles de 44 px, texto mínimo y foco de 3 px.
   Bloque aparte, al final, para no mover lo demás. */
.bx-plan-oscuro .b-asesor-plan-nombre{color:var(--bx-ambar)}
.bx-guardada .bx-guardada-ir{width:44px;height:44px}
.b-respuestas .estado{font-size:var(--pl-f1,12px)}
.b-respuestas .eyebrow{font-size:var(--pl-f2,14px)}
.b-respuestas .th-fuente,.b-respuestas .th-fuente a{font-size:var(--pl-f1,12px)}
a.bx-ficha:focus-visible,.bx-paso-ir:focus-visible,.bx-acceso:focus-visible,.bx-avatar-hdr:focus-visible{outline-width:3px}
.bx-sigue-paso:focus-visible,.bx-tarea:focus-visible{outline-width:3px}
.bx-perfil summary:focus-visible{outline-width:3px}
.bx-campo input:focus-visible,.bx-campo select:focus-visible,.bx-campo textarea:focus-visible,a.bx-fuente:focus-visible{outline:3px solid var(--bx-tinta);outline-offset:2px}
.gsi-boton:focus-visible{outline-width:3px}
a.b-ayuda-chip:focus-visible,a.b-asesor-btn:focus-visible,a.fs-item:focus-visible{outline-width:3px}
.b-asesor a:focus-visible{outline-width:3px}
/* La moneda del Token en «Comprar Tokens» ocupa los dos renglones, como los iconos (se desacomodaba). */
.bx-acceso>.moneda{grid-row:span 2}
@media (max-width:640px){.bx-guardada{border-width:0 14px;border-image-width:0 14px;gap:4px}.bx-guardada input{font-size:var(--pl-f3,16px)}}
/* Enfoques de la respuesta y la caja para subir información (buscar/_/enfoque.js). */
.bx-enfoques{display:grid;gap:8px}
.bx-enfoques .bx-nota{margin:0}
.bx-subir{display:grid;gap:8px;margin-top:6px;padding:14px;border-radius:16px;background:var(--bx-ambar-suave);border:1px solid var(--bx-ambar-borde)}
.bx-subir .bx-nota svg{width:18px;height:18px;margin-right:6px;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Paginación de Herramientas, como la de Google (1 2 3 … Siguiente), con controles de 44 px. */
.bx-paginacion{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:20px}
.bx-pag{display:inline-grid;place-items:center;min-width:44px;min-height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--bx-linea);background:var(--papel);color:var(--bx-tinta);font:700 var(--pl-f3,16px)/1 Manrope,system-ui,sans-serif;text-decoration:none}
.bx-pag:hover{border-color:var(--bx-tinta)}
.bx-pag-actual{background:var(--bx-tinta);border-color:var(--bx-tinta);color:var(--papel)}
.bx-pag-paso{padding:0 16px}
.bx-pag-hueco{min-width:20px;text-align:center;color:var(--bx-tenue)}
.bx-pag:focus-visible{outline:3px solid var(--bx-tinta);outline-offset:2px}
.bx-pag-cuenta{margin:0 0 10px}
/* Celular (hallazgo visual del 26-oct-2026: a 360 px la paginación se partía a media fila): los números en una fila y
   Anterior y Siguiente debajo, cada uno en su mitad. */
@media (max-width:480px){.bx-paginacion{gap:4px}.bx-pag-paso{order:2;flex:1 1 40%}.bx-pag-hueco{min-width:16px}}
/* Aliados · Tecnología: la misma tarjeta de los conectores del panel, como liga (vistas.js · aliados). */
.bx-aliados-tec{grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none}
@media (min-width:640px){.bx-aliados-tec{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.bx-aliados-tec{grid-template-columns:repeat(4,minmax(0,1fr))}}
.p3-aliado{display:grid;grid-template-columns:40px minmax(0,1fr);gap:4px 12px;align-items:center;min-height:64px;padding:12px 14px;color:inherit;text-decoration:none}
.p3-aliado .p3-logo .bx-marca-svg{width:24px;height:24px}
.p3-aliado:focus-visible{outline:3px solid var(--bx-ambar);outline-offset:2px}
/* Mientras piensa: la pregunta, tres pasos que se encienden uno tras otro y renglones que laten; alto fijo para que la
   página no brinque mientras llega la respuesta. */
.bx-pensando{display:grid;gap:16px;min-height:min(60vh,520px);align-content:start}
.bx-pensando-q{margin:0;color:var(--bx-tinta);font-weight:600;font-size:var(--pl-f3-4,16px);overflow-wrap:anywhere}
.bx-pensando-pasos{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.bx-pensando-pasos li{display:flex;align-items:center;gap:10px;color:var(--bx-tenue);opacity:.45;animation:bx-paso var(--pensar-paso) calc(var(--i) * var(--pensar-paso)) both}
.bx-pensando-pasos li::before{content:"";flex:none;width:10px;height:10px;border-radius:999px;background:var(--bx-linea)}
@keyframes bx-paso{0%,100%{opacity:.45}15%,85%{opacity:1;color:var(--bx-tinta)}}
.bx-pensando-pasos li:last-child{animation-name:bx-paso-final}
@keyframes bx-paso-final{0%{opacity:.45}15%,100%{opacity:1;color:var(--bx-tinta)}}
.bx-pensando-hueso{display:grid;gap:10px}
.bx-pensando-hueso span{height:14px;border-radius:999px;background:var(--bx-linea);animation:bx-latido var(--pensar-latido) ease-in-out infinite alternate}
.bx-pensando-hueso span:nth-child(2){width:86%}.bx-pensando-hueso span:nth-child(3){width:62%}
@keyframes bx-latido{from{opacity:.5}to{opacity:1}}
/* Claude ya escribe (buscador.js · mostrarParcial): los pasos quedan encendidos y el último late; el texto a medias no se ve. */
.bx-pensando[data-escribiendo] .bx-pensando-pasos li{animation:none;opacity:1;color:var(--bx-tinta)}
.bx-pensando[data-escribiendo] .bx-pensando-pasos li:last-child{animation:bx-latido var(--pensar-latido) ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){.bx-pensando-pasos li,.bx-pensando-hueso span{animation:none;opacity:1}}
/* Grupo PointCare en el header (Alex, 27-oct-2026): su símbolo antes de «Elige tu sector»; el nombre queda para lectores
   de pantalla. Abre ?ver=grupo y escribe «Grupo PointCare» en la barra como los demás links del header. */
.hdr-grupo img{display:block;width:auto;height:28px}
.hdr-grupo span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Grupo PointCare (?ver=grupo): su logo en el crema de la marca y las tres empresas, una por columna en escritorio */
.bx-grupo-logo{display:grid;place-items:center;margin:8px 0 24px;padding:clamp(12px,3vw,28px);border-radius:20px;background:var(--pointcare-crema)}
.bx-grupo-logo img{display:block;width:min(100%,240px);height:auto}
@media (min-width:1100px){.bx-grupo{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bx-grupo-empresa{align-items:start;min-height:44px}
.bx-grupo-empresa .p3-logo img{width:26px;height:26px;object-fit:contain}
.bx-grupo .p3-logo.bx-grupo-oscuro{background:var(--pointcare-tinta)}
.bx-grupo-area{font-weight:600}
.p3-aliado .p3-logo-texto{background:var(--papel);color:var(--bx-tinta);font-size:var(--pl-f1,12px)}
/* Esencial y Empresarial van aparte, a todo lo ancho, después de los planes (se contratan con el equipo, no en línea).
   Antes Empresarial era la cuarta columna y, a 1280 px, se estiraba al alto de las otras (con Vértice) como un recuadro
   oscuro vacío (captura de Alex, 28-oct-2026). */
@media (min-width:640px){.bx-plan-esencial,.bx-planes>.bx-plan-oscuro{grid-column:1/-1}}
@media (min-width:900px){
  .bx-plan-esencial,.bx-planes>.bx-plan-oscuro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;column-gap:28px;align-items:start}
  .bx-plan-esencial>*:not(ul):not(a),.bx-planes>.bx-plan-oscuro>*:not(ul):not(a){grid-column:1}
  .bx-plan-esencial>ul,.bx-planes>.bx-plan-oscuro>ul{grid-column:2;grid-row:1/span 4;align-self:center;margin:0}
  .bx-plan-esencial>a,.bx-planes>.bx-plan-oscuro>a{grid-column:3;grid-row:1/span 4;align-self:center}
  .bx-planes>.bx-plan-oscuro .b-asesor-btn{margin-top:0}
}
/* Velo detrás del header chico y la barra guardada (al-bajar.js): tapa el hueco por donde se veía pasar el texto. */
.bx-velo-guardada{position:fixed;z-index:39;left:0;right:0;top:0;height:164px;pointer-events:none;opacity:0;background:linear-gradient(180deg,rgba(238,240,243,.94) 0,rgba(238,240,243,.9) 73%,rgba(238,240,243,0) 100%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-mask-image:linear-gradient(180deg,#000 73%,transparent);mask-image:linear-gradient(180deg,#000 73%,transparent);transition:opacity .25s ease}
.bx-velo-guardada.bx-visible{opacity:1}
/* El desvanecido empieza donde acaba la barra guardada (114 px) y baja 44 px más: así la tarjeta se va perdiendo debajo
   de ella en vez de cortarse en seco en su borde (encargo D de Alex, 26-oct-2026; hueco de #63 a 375 px). */
@media (max-width:640px){.bx-velo-guardada{height:158px;-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent);background:linear-gradient(180deg,rgba(238,240,243,.94) 0,rgba(238,240,243,.9) 72%,rgba(238,240,243,0) 100%)}}
@media (prefers-reduced-motion:reduce){.bx-velo-guardada{transition:none}}
/* El plan que llega elegido a Comprar (?plan=…): marcado como el del diagnóstico. */
.bx-plan[data-elegido]{outline:3px solid #1B1F27;outline-offset:2px}
/* «Herramientas por tipo de negocio» (portada): una pastilla por página de sector, de 44 px, en renglones que se acomodan. */
.bx-por-negocio{margin:18px 0 0;text-align:center}
.bx-negocios-t{margin:0 0 8px;font:700 var(--pl-f1,12px)/1.4 Manrope,system-ui,sans-serif;color:#4A5160;letter-spacing:.02em}
.bx-negocios{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0;padding:0;list-style:none}
.bx-negocios a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid #1B1F27;border-radius:999px;background:#fff;color:#1B1F27;font:700 var(--pl-f2,14px)/1.2 Manrope,system-ui,sans-serif;text-decoration:none}
.bx-negocios a:hover{background:#F6A623;border-color:#1A1D24}
.bx-negocios a:focus-visible{outline:3px solid #1B1F27;outline-offset:3px}
/* «Que me llamen» sin aviso: el botón a WhatsApp va en su propio renglón. */
.bx-llamar-wa{display:flex;width:fit-content;margin-top:8px}

/* «Lo que recordamos de ti» (encargo E, 26-oct-2026): cada cosa guardada en su bloque, con dónde vive y su botón. */
.bx-recuerdo{display:grid;gap:10px}
.bx-recuerdo-donde{margin:0;color:var(--bx-tenue);font-size:var(--pl-f2,14px);line-height:1.5}
.bx-recuerdo .bx-puntos{margin:0}

/* El código para borrar una conversación sin cuenta (3C, #148): discreto, junto al aviso del pie. */
.bx-codigo{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 8px}
.bx-codigo-que{flex:1 1 100%}
.bx-codigo code{max-width:100%;overflow-wrap:anywhere;padding:2px 8px;border-radius:999px;border:1px solid var(--bx-linea);background:var(--papel);font:600 var(--pl-f2,14px)/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--bx-tinta);user-select:all}
.bx-codigo-btn{min-height:44px;padding:0 14px;font-size:var(--pl-f2,14px)}
.bx-codigo-eti,.bx-codigo-que{font-size:var(--pl-f2,14px);line-height:1.5}

/* La ficha desglosada de cada herramienta (Alex, 26-oct-2026): problema, paso a paso, qué recibe y entrega, qué incluye,
   qué necesitas, preguntas y las dos salidas (Comprar y Agendar asesoría de 20 min) arriba y abajo. Una columna en celular. */
.bx-detalle{display:grid;gap:10px;min-width:0}
.bx-lista{margin:0;font-size:var(--pl-f3,16px);line-height:1.45;gap:8px}
.bx-lista svg{margin-top:4px}
.bx-salidas .b-asesor-btn{min-height:48px;padding-inline:18px}
.bx-pasos-detalle .bx-paso span{color:var(--bx-tinta);font-size:var(--pl-f3,16px)}
.bx-pasos-detalle .bx-paso strong+span{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-recibe,.bx-necesitas{padding:14px 16px;border-radius:16px;background:rgba(244,246,249,.92);border:1px solid var(--bx-borde)}
.bx-necesitas dd,.bx-recibe dd{font-size:var(--pl-f3,16px);line-height:1.45}
.bx-incluye{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:0;padding:0;list-style:none}
@media (min-width:640px){.bx-incluye{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}
.bx-incluye-item{display:grid;gap:10px;align-content:start;padding:14px 16px;border-radius:16px;background:rgba(244,246,249,.92);border:1px solid var(--bx-borde);min-width:0}
.bx-incluye-cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.bx-incluye-cab strong{font:800 var(--pl-f3,16px)/1.25 Manrope,system-ui,sans-serif}
.bx-incluye-item .bx-datos dd{font-size:var(--pl-f2,14px);line-height:1.45}
.bx-incluye-item .bx-paso-ir{justify-self:start}
.bx-faq{display:grid;gap:8px}
.bx-pregunta{border-radius:14px;background:rgba(244,246,249,.92);border:1px solid var(--bx-borde)}
.bx-pregunta summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:10px 16px;cursor:pointer;list-style:none;font:700 var(--pl-f3,16px)/1.3 Manrope,system-ui,sans-serif;color:var(--bx-tinta)}
.bx-pregunta summary::-webkit-details-marker{display:none}
.bx-pregunta summary::after{content:"+";flex:none;font-weight:800;font-size:var(--pl-f3,16px)}
.bx-pregunta[open] summary::after{content:"−"}
.bx-pregunta summary:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:-2px;border-radius:14px}
.bx-pregunta p{margin:0;padding:0 16px 14px;font-size:var(--pl-f3,16px);line-height:1.5;color:var(--bx-tenue);overflow-wrap:anywhere}
.bx-faq-liga{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--bx-tinta);font-weight:700;text-underline-offset:3px}
.bx-faq-liga svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bx-cierre{display:grid;gap:10px;padding:18px 16px;border-radius:18px;background:var(--bx-ambar-suave);border:1px solid var(--bx-ambar-borde)}
.bx-cierre p{margin:0;font-size:var(--pl-f3,16px);line-height:1.5}
/* Calificaciones de los usuarios (27-oct-2026): estrellas ámbar de la casa en cada herramienta y el aviso de Mi panel. */
.bx-calif{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:20px;font:600 var(--pl-f2,14px)/1.3 Manrope,system-ui,sans-serif;color:var(--bx-tenue)}
.bx-calif:empty{display:none}
.bx-calif strong{color:var(--bx-tinta);font-weight:800}
.bx-calif-n{white-space:nowrap}
.bx-calif-estrellas{display:inline-flex;gap:1px}
.bx-estrella svg,.bx-calif-btn svg{display:block;width:16px;height:16px;fill:var(--bx-borde-fuerte);stroke:none}
.bx-calif-btn svg{stroke:var(--bx-ambar-fuerte);stroke-width:1.2;stroke-linejoin:round;fill:#fff}
.bx-estrella.llena svg,.bx-calif-btn.llena svg{fill:var(--bx-ambar)}
.bx-calificar{border:2px solid var(--bx-ambar-borde);background:var(--bx-ambar-suave)}
.bx-calif-botones{display:flex;gap:4px;margin:4px 0 8px}
.bx-calif-btn{display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;border-radius:12px;background:transparent;cursor:pointer}
.bx-calif-btn svg{width:34px;height:34px}
.bx-calif-btn:hover svg,.bx-calif-btn:focus-visible svg{fill:var(--bx-ambar-medio)}
.bx-calif-btn:focus-visible{outline:2px solid var(--bx-ambar-fuerte);outline-offset:2px}
.bx-panel [data-calificar]~*{display:none!important}
/* Cambiar el Panel Hostess hablando (27-oct-2026): qué cambia, antes → después. */
.bx-cambios{display:grid;gap:8px;margin:0 0 12px;padding:0;list-style:none}
.bx-cambios li{display:grid;gap:2px;padding:12px 14px;border:1px solid var(--bx-borde);border-radius:14px;background:#fff}
.bx-cambios span{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-cambios b{color:var(--bx-ok)}
/* Foto → acciones (28-oct-2026): lo que se leyó de la foto y cada acción con su botón. */
.bx-foto .eyebrow{display:flex;align-items:center;gap:6px}
.bx-foto .eyebrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bx-foto-lectura{display:grid;gap:6px;margin:0 0 14px;padding:12px 14px;border:1px solid var(--bx-borde);border-radius:14px;background:#fff}
.bx-foto-lectura div{display:grid;grid-template-columns:72px 1fr;gap:8px}
.bx-foto-lectura dt{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-foto-lectura dd{margin:0;overflow-wrap:anywhere}
.bx-foto-acciones li{gap:6px}
.bx-foto-acciones strong,.bx-foto-acciones span{overflow-wrap:anywhere}
.bx-foto-acciones small{color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-foto-acciones .b-asesor-botones{margin:6px 0 0;flex-wrap:wrap}
.bx-foto-estado{margin:0;font-size:var(--pl-f2,14px)}
.bx-foto-estado:empty{display:none}
.bx-foto-fuera{margin:0 0 12px;padding-left:20px;color:var(--bx-tenue);font-size:var(--pl-f2,14px)}
.bx-foto-fuera li{overflow-wrap:anywhere}
/* El buscador como control de la dueña (28-oct-2026): la línea «todo se pide hablando», la misión por preguntas y el registro. */
.bx-habla{display:grid;gap:10px;margin:0 0 16px;padding:14px 16px;border:1px solid var(--bx-borde);border-radius:16px;background:#fff}
.bx-habla p{margin:0;overflow-wrap:anywhere}
.bx-habla strong{display:inline-flex;align-items:center;gap:6px}
.bx-habla svg,.bx-mision-voz>.eyebrow svg,.bx-orden .eyebrow svg{width:16px;height:16px;vertical-align:-3px}
.bx-habla .b-ayuda-chips{margin:0}
.bx-mision-voz{display:grid;gap:10px;margin:0 0 16px;padding:16px;border:2px solid var(--bx-ambar-medio,#E9B949);border-radius:18px;background:#fff}
.bx-mision-voz .b-ayuda-chips{margin:0}
.bx-registro .b-asesor-eti,.bx-orden .eyebrow,.bx-mision-voz>.eyebrow{display:flex;align-items:center;gap:6px}
.bx-registro .b-asesor-eti svg{width:16px;height:16px}
.bx-mision-voz .bx-nota svg{width:16px;height:16px;margin-right:4px;vertical-align:-3px}
.bx-registro{display:grid;gap:8px;margin:0 0 16px}
.bx-registro-lista{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.bx-reg{display:grid;gap:4px;min-width:0;padding:12px 14px;border:1px solid var(--bx-borde);border-radius:14px;background:#fff}
.bx-reg strong{overflow-wrap:anywhere}
.bx-reg small{color:var(--bx-tenue)}
/* Amigos de Hostess (amigos.js): movimientos en una columna y la liga de invitación que Alex copia. */
.bx-amigo-movs li{grid-template-columns:minmax(0,1fr);gap:4px}
.bx-amigo-movs strong{justify-self:start}
.bx-amigo-movs span{overflow-wrap:anywhere}
.bx-amigo-liga{display:grid;gap:10px;margin:0 0 14px}
.bx-amigo-codigo{width:100%;min-height:48px;padding:10px 14px;border-radius:14px;border:1px solid var(--bx-borde-fuerte);background:var(--papel);color:var(--bx-tinta);font:400 var(--pl-f2,14px)/1.4 ui-monospace,Menlo,monospace;box-sizing:border-box;text-overflow:ellipsis}
.bx-amigo .bx-saldo strong{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* Mi panel a pantalla completa (Alex, 27-oct-2026; misión m-panel-ancho-entrada): la tarjeta usa todo el ancho (buscador.js ·
   seguir). El header de Hostess SE QUEDA (Alex, 28-oct-2026: «cuando abro mi panel desaparece el header y ya no puedo volver
   a él»): antes salía deslizándose y dejaba a la persona sin menú. */
/* Los documentos que sube con el clip de la barra (documentos.js, 28-oct-2026): una lista de una columna en celular. */
.bx-docs{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}
.bx-docs li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 12px;padding:10px 14px;border-radius:14px;border:1px solid var(--bx-borde-fuerte,rgba(20,26,38,.12));background:var(--papel,#fff)}
.bx-doc-nombre{display:flex;gap:8px;align-items:center;min-width:0;font-weight:600;overflow-wrap:anywhere}
.bx-doc-nombre svg,.bx-doc-liga svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bx-docs small{grid-column:1/-1;color:var(--bx-tinta-suave,#5d636d);font-size:var(--pl-f2,14px)}
.bx-doc-liga{grid-row:1;grid-column:2;display:inline-flex;gap:6px;align-items:center;min-height:44px;padding:0 6px;font-weight:600;white-space:nowrap}
.bx-doc-no .bx-doc-nombre{color:var(--bx-tinta-suave,#5d636d)}
@media (max-width:420px){.bx-docs li{grid-template-columns:minmax(0,1fr)}.bx-doc-liga{grid-row:auto;grid-column:1}}
.bx-carpeta a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;overflow-wrap:anywhere}
.bx-carpeta code{font-size:var(--pl-f2,14px);overflow-wrap:anywhere}
/* La barra guardada es la pieza del buscador (al-bajar.js; Alex, 28-oct-2026: «aquí literal tiene que ser el buscador con
   las animaciones y diseño del buscador»): la H de mercurio con su reflejo y su brillo al acercarse, la línea que se dibuja
   al escribir, las ondas de líquido donde va el texto y la barra que crece al tocarla, con las curvas de vidrio.js. */
:root{--bx-t-aparece:.25s;--bx-t-sube:.55s;--bx-t-crece:1.1s;--bx-t-onda:.9s;--bx-t-h:.45s;--bx-t-linea:.6s;--bx-t-toque:.12s;--bx-t-reflejo:7s}
.bx-guardada{transition:opacity var(--bx-t-aparece) ease,transform var(--bx-t-sube) cubic-bezier(.22,1,.36,1),width var(--bx-t-crece) cubic-bezier(.22,1,.36,1),height var(--bx-t-crece) cubic-bezier(.22,1,.36,1)}
.bx-guardada.bx-visible:focus-within{width:min(calc(100vw - 20px),600px);height:52px}
@media (hover:hover){.bx-guardada.bx-visible:hover:not(:has(.bx-guardada-h:hover)){transform:translate(-50%,-3px) scale(1.01)}}
.bx-guardada-ondas{position:absolute;inset:0;border-radius:999px;overflow:hidden;pointer-events:none}
.bx-onda{position:absolute;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,0) 35%,rgba(255,255,255,.6) 52%,rgba(190,196,208,.3) 62%,rgba(255,255,255,0) 72%);animation:bx-onda var(--bx-t-onda) cubic-bezier(.22,1,.36,1) forwards}
@keyframes bx-onda{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(7)}}
.bx-guardada .bx-guardada-h{position:relative;z-index:1}
.bx-guardada-h::before{content:"";position:absolute;inset:6px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.6),rgba(255,255,255,0) 70%);opacity:0;transform:scale(.7);transition:opacity var(--bx-t-h),transform var(--bx-t-h) cubic-bezier(.22,1,.36,1)}
.bx-guardada-h:hover::before,.bx-guardada-h:focus-visible::before{opacity:1;transform:scale(1)}
.bx-h{position:relative;display:block;width:22px;height:25px;-webkit-mask:url(/img/hostess-mark-alpha-64.png) center/contain no-repeat;mask:url(/img/hostess-mark-alpha-64.png) center/contain no-repeat;background:linear-gradient(150deg,#fbfcfd 0%,#c4c8cf 22%,#5d636d 44%,#dfe2e6 55%,#7b818b 72%,#f1f2f4 88%,#a8adb5 100%);opacity:.9;transition:transform var(--bx-t-h) cubic-bezier(.22,1,.36,1),opacity var(--bx-t-h)}
/* El brillo se mueve con transform (lo anima el compositor, sin pintar cada cuadro): misión 12 de rendimiento. */
.bx-h::after{content:"";position:absolute;top:0;bottom:0;left:0;width:300%;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.85) 45%,transparent 60%);animation:bx-reflejo var(--bx-t-reflejo) ease-in-out infinite}
@keyframes bx-reflejo{0%{transform:translateX(-80%)}60%,100%{transform:translateX(40%)}}
.bx-guardada-h:hover .bx-h,.bx-guardada-h:focus-visible .bx-h{transform:translateY(-14%) scale(1.08);opacity:1}
.bx-guardada-h:active .bx-h{transform:translateY(-6%) scale(1.02);transition-duration:var(--bx-t-toque)}
.bx-guardada-campo{position:relative;z-index:1;flex:1;min-width:0;display:flex;align-items:center;height:44px}
.bx-guardada input{color:var(--bx-tinta);text-shadow:0 1px 0 rgba(255,255,255,.8);letter-spacing:.01em}
.bx-guardada-linea{position:absolute;left:0;right:0;bottom:6px;height:1px;background:linear-gradient(90deg,rgba(120,126,138,0),rgba(120,126,138,.4),rgba(120,126,138,0));transform:scaleX(0);transform-origin:left;transition:transform var(--bx-t-linea) ease}
.bx-guardada:focus-within .bx-guardada-linea{transform:scaleX(1)}
.bx-guardada .bx-guardada-ir{position:relative;z-index:1;transition:transform var(--bx-t-h) cubic-bezier(.22,1,.36,1),background-color var(--bx-t-aparece),box-shadow var(--bx-t-aparece);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 6px 14px -8px rgba(20,26,38,.6)}
.bx-guardada .bx-guardada-ir svg{transition:transform var(--bx-t-h) cubic-bezier(.22,1,.36,1)}
.bx-guardada:not(.bx-con-texto) .bx-guardada-ir{background:rgba(43,49,64,.72)}
.bx-guardada.bx-con-texto .bx-guardada-ir{background:var(--bx-ambar);color:var(--bx-sobre-ambar)}
.bx-guardada-ir:hover svg,.bx-guardada-ir:focus-visible svg{transform:translateX(2px)}
.bx-guardada-ir:active{transform:scale(.92)}
.bx-guardada-ir:focus-visible{outline:3px solid var(--bx-tinta);outline-offset:2px}
/* Al tocarla, como la barra grande: un halo de luz suave en vez del anillo negro, más la línea que se dibuja. */
.bx-guardada.bx-visible:focus-within{box-shadow:0 0 0 2px rgba(27,31,39,.38),0 0 0 6px rgba(246,166,35,.18),0 16px 36px rgba(20,26,38,.2)}
@media (max-width:640px){.bx-guardada.bx-visible:focus-within{width:calc(100vw - 28px)}}
@media (prefers-reduced-motion:reduce){.bx-guardada,.bx-guardada-linea,.bx-h,.bx-guardada-ir,.bx-guardada-ir svg,.bx-guardada-h::before{transition:none}.bx-h::after,.bx-onda{animation:none}.bx-guardada.bx-visible:hover{transform:translate(-50%,0)}}
/* ── El saldo de Token Hostess en el header y su hoja de vidrio (Alex, 28-oct-2026; saldo-header.js, hoja-vidrio.js) ── */
.hdr-saldo{flex:none;gap:8px;min-height:44px;min-width:44px;margin:0;padding:0 8px;border-radius:999px;font:800 var(--pl-f3,16px)/1 Archivo,Arial,sans-serif;color:var(--bx-tinta);pointer-events:auto;font-variant-numeric:tabular-nums}
.hdr-saldo .moneda{width:26px;height:26px}
.hdr-saldo:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:3px}
@media (max-width:1199px){.hdr-saldo{margin-left:auto;padding:0 6px;gap:6px}.hdr-saldo .moneda{width:24px;height:24px}}
dialog.hoja-vidrio{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:100%;max-height:min(86dvh,760px);padding:0;border:0;background:transparent;color:var(--bx-tinta);overflow:visible}
dialog.hoja-vidrio::backdrop{background:rgba(20,24,33,.28);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.hoja-vidrio-caja{display:grid;grid-template-rows:auto minmax(0,1fr);max-height:inherit;border-radius:20px;border-bottom-left-radius:0;border-bottom-right-radius:0;border:1px solid rgba(255,255,255,.85);border-bottom:0;background:linear-gradient(140deg,rgba(255,255,255,.86),rgba(246,248,251,.7));-webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);box-shadow:inset 0 1px 0 #fff,0 -12px 40px rgba(32,39,56,.18);overflow:hidden}
.hoja-vidrio-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 12px 6px 20px}
.hoja-vidrio-t{margin:0;font:800 var(--pl-f4,20px)/1.2 Archivo,Arial,sans-serif;letter-spacing:-.02em}
.hoja-vidrio-cerrar{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;border:1px solid rgba(32,39,56,.08);background:rgba(255,255,255,.7);color:var(--bx-tinta);cursor:pointer}
.hoja-vidrio-cerrar svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.hoja-vidrio-cerrar:focus-visible{outline:2px solid var(--bx-tinta);outline-offset:2px}
.hoja-vidrio-cuerpo{display:grid;gap:12px;align-content:start;padding:6px 20px calc(20px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;min-width:0}
@media (min-width:720px){dialog.hoja-vidrio{inset:84px 24px auto auto;width:420px;max-height:calc(100dvh - 108px)}.hoja-vidrio-caja{border-bottom-left-radius:20px;border-bottom-right-radius:20px;border-bottom:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #fff,0 18px 48px rgba(32,39,56,.18)}}
@media (prefers-reduced-motion:no-preference){dialog.hoja-vidrio[open] .hoja-vidrio-caja{animation:hoja-sube .3s cubic-bezier(.2,.8,.2,1)}}
@keyframes hoja-sube{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-transparency:reduce){.hoja-vidrio-caja{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}}
.tv-top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center}
.tv-top>div{display:grid;gap:2px;min-width:0}
.tv-eti{font-size:var(--pl-f2,14px);font-weight:700;color:var(--bx-tenue)}
.tv-cifra{font:800 var(--pl-f5,40px)/1.1 Archivo,Arial,sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tv-top small{font-size:var(--pl-f2,14px);color:var(--bx-tenue)}
.tv-cifras{grid-template-columns:repeat(2,minmax(0,1fr))}
.tv-usos{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.tv-uso{display:grid;gap:3px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 1px 0 #fff,0 4px 14px rgba(32,39,56,.06);min-width:0}
.tv-uso-cab{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.tv-uso-cab strong{font-size:var(--pl-f3,16px);min-width:0}
.tv-alcanza{font:800 var(--pl-f3,16px)/1.2 Archivo,Arial,sans-serif;color:var(--bx-ambar-texto);font-variant-numeric:tabular-nums}
.tv-costo{font-size:var(--pl-f2,14px);font-weight:700}
.tv-uso small{font-size:var(--pl-f2,14px);line-height:1.4;color:var(--bx-tenue);overflow-wrap:anywhere}
.tv-fuente{font-size:var(--pl-f1,12px)!important;opacity:.85}
.tv-regla{font-size:var(--pl-f2,14px)}
/* La misión por el buscador (Alex, 28-oct-2026: «"¿Me quieres dictar…?" aparece arriba en Liquid Glass»): una burbuja de
   vidrio fija bajo la barra (ordenes-duena.js la coloca con el borde de la barra) y los campos que se llenan solos brillan. */
:root{--mb-brillo:#FFF8E6}
.bx-mision-burbuja{position:fixed;z-index:60;left:50%;transform:translateX(-50%);top:96px;width:min(640px,calc(100vw - 32px));box-sizing:border-box;display:grid;gap:8px;margin:0;padding:16px 18px;border-radius:20px;border:1px solid rgba(255,255,255,.75);background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(22px) saturate(1.7);backdrop-filter:blur(22px) saturate(1.7);box-shadow:0 18px 48px rgba(20,26,38,.18),inset 0 1px 0 rgba(255,255,255,.9);color:var(--bx-tinta)}
.bx-mision-burbuja .b-asesor-titular{margin:0;font-size:var(--pl-f3-4,16px)}
.bx-mision-burbuja .bx-nota{margin:0}
.bx-mision-burbuja .b-asesor-botones{margin:4px 0 0;flex-wrap:wrap}
.bx-mision-burbuja .b-asesor-btn svg,.bx-mision-burbuja .bx-nota svg{width:16px;height:16px;vertical-align:-3px;margin-right:4px}
.bx-mision-va{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:var(--pl-f2,14px);overflow-wrap:anywhere}
.bx-mision-burbuja [data-mision-voz-estado]:empty{display:none}
@keyframes bx-lleno{from{box-shadow:0 0 0 3px var(--bx-ambar-medio,#E9B949);background:var(--mb-brillo)}to{box-shadow:none;background:inherit}}
.bx-lleno{animation:bx-lleno 2s ease-out}
@media (prefers-reduced-motion:reduce){.bx-lleno{animation:none}}

/* «Entrar como» (m-soporte-entrar-como, 28-oct-2026): la barra fija de arriba mientras la dueña ve la cuenta de un cliente
   (buscar/_/soporte.js). Una sola línea en navy con el punto naranja de la casa, como la franja del modo prueba; el texto
   largo se recorta con «…» y «Salir» mide 44 px. Empuja el header y la capa del buscador para no tapar nada. */
:root{--soporte-alto:48px}
.barra-soporte{position:fixed;left:0;right:0;top:0;z-index:60;height:var(--soporte-alto);background:var(--navy);color:#fff;border-bottom:2px solid var(--naranja);box-sizing:border-box}
.bs-in{display:flex;align-items:center;gap:0 10px;height:100%;min-width:0}
.bs-punto{width:10px;height:10px;border-radius:50%;background:var(--naranja);box-shadow:0 0 0 4px rgba(246,166,35,.28);flex:none}
.bs-texto{flex:1 1 auto;min-width:0;margin:0;font:500 var(--pl-f2,14px)/1.3 Manrope,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.bs-texto strong{font-weight:800;color:#fff}
.bs-sep{flex:none;color:var(--naranja);font-weight:800}
.bs-salir{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;padding:0 6px;margin:0;border:0;background:transparent;color:#fff;font:800 var(--pl-f2,14px)/1 Manrope,system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer;white-space:nowrap}
.bs-salir svg{width:18px;height:18px}
.bs-salir:hover,.bs-salir:focus-visible{color:var(--naranja)}
.bs-salir:disabled{opacity:.6;cursor:wait}
body.en-soporte{padding-top:var(--soporte-alto)}
body.en-soporte .hdr{top:var(--soporte-alto)}
body.en-soporte.en-buscar dialog.capa.capa-completa{top:var(--soporte-alto);height:auto}
body.en-soporte.en-buscar #capa-buscar .buscador-original{top:var(--soporte-alto);contain:layout}
@media (max-width:640px){.bs-texto{font-size:var(--pl-f2,14px)}.bs-sep{display:none}}

/* Modo prueba del cliente (Alex, 28-oct-2026; buscar/_/prueba.js): la franja fija de arriba mientras la sesión es de un
   correo de prueba. Naranja de la casa con texto oscuro (la de soporte es navy); «Volver a empezar» mide 44 px. Empuja el
   header y la capa del buscador como la de soporte. Si las dos coinciden, manda la de soporte. */
:root{--prueba-alto:48px}
.barra-prueba{position:fixed;left:0;right:0;top:0;z-index:60;height:var(--prueba-alto);background:var(--naranja);color:var(--naranja-texto);border-bottom:2px solid var(--navy);box-sizing:border-box}
.bp-in{display:flex;align-items:center;gap:0 10px;height:100%;min-width:0}
.bp-sello{flex:none;padding:3px 8px;border-radius:999px;background:var(--navy);color:#fff;font:800 var(--pl-f1,12px)/1.2 Manrope,system-ui,sans-serif;letter-spacing:.02em;white-space:nowrap}
.bp-texto{flex:1 1 auto;min-width:0;margin:0;font:600 var(--pl-f2,14px)/1.3 Manrope,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bp-reiniciar{flex:none;display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 6px;margin:0;border:0;background:transparent;color:inherit;font:800 var(--pl-f2,14px)/1 Manrope,system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer;white-space:nowrap}
.bp-reiniciar:hover,.bp-reiniciar:focus-visible{color:var(--navy)}
.bp-reiniciar:disabled{opacity:.6;cursor:wait}
body.en-prueba:not(.en-soporte){padding-top:var(--prueba-alto)}
body.en-prueba:not(.en-soporte) .hdr{top:var(--prueba-alto)}
body.en-prueba:not(.en-soporte).en-buscar dialog.capa.capa-completa{top:var(--prueba-alto);height:auto}
body.en-prueba:not(.en-soporte).en-buscar #capa-buscar .buscador-original{top:var(--prueba-alto);contain:layout}
body.en-soporte .barra-prueba{display:none}
@media (max-width:640px){.bp-texto{font-size:var(--pl-f2,14px)}}
@media (max-width:420px){.bp-texto{display:none}.bp-in{justify-content:space-between}.bp-sello::after{content:" · nada se cobra"}}
/* El sello «prueba» va DEBAJO de la cifra, dentro de los 44 px del botón: no ensancha el header en el celular. */
.hdr-saldo[data-prueba="1"]{position:relative}
.hdr-saldo-prueba{position:absolute;left:50%;bottom:0;transform:translateX(-50%);padding:0 4px;border-radius:999px;background:var(--navy);color:#fff;font:800 var(--pl-f1,12px)/1.4 Manrope,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;pointer-events:none}
.bx-aviso-prueba{display:flex;gap:8px;align-items:flex-start;border-left:4px solid var(--naranja)}
.bx-aviso-prueba strong{display:block}
.bx-nota-prueba{border-left:4px solid var(--naranja)}

/* Portada estática del visitante nuevo (index.html · «portada-estatica»): hasta que buscador.js pinta, lo que él acomoda
   junto a la barra y debajo de la tarjeta no se ve; la cabecera que ya estaba a la vista no vuelve a entrar animada. */
html.con-portada-estatica .que-es-junto,html.con-portada-estatica .aviso-buscador{visibility:hidden}
/* Mientras vidrio.js no monta la barra, su lugar lleva una píldora de cristal con las mismas reglas que .barra en vidrio.js
   (alto y ancho, y dónde va con respuesta: celular, tableta, computadora); al montarse la barra (shadow DOM), el ::before del
   anfitrión deja de pintarse solo. */
html.con-portada-estatica .buscador-original::before{content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(51.2vw,91vh,calc(100vw - 32px));height:clamp(46px,calc(10.2vw * .5625),10.5vh);border-radius:999px;background:var(--papel);border:1px solid var(--bx-borde);opacity:.7}
@media (max-aspect-ratio:1/1){html.con-portada-estatica .buscador-original::before{width:min(calc(100vw - 32px),640px);height:50px}}
@media (max-width:640px){html.con-portada-estatica .buscador-original::before{top:calc(env(safe-area-inset-top,0px) + 87px)}}
@media (min-width:1024px){html.con-portada-estatica .buscador-original::before{top:calc(var(--hdr,88px) + 16px);translate:-50% 0}}
.b-respuestas[data-estatica] .b-asesor>:is(.b-asesor-cab,.b-ayuda-grupo){animation:none}

/* El aviso de cookies sobre la portada (QA del cliente nuevo, 31-oct-2026: tapaba «Prueba con»). Solo dónde se acomoda; el
   texto y cuándo se pide no cambian. La portada se desplaza dentro de su capa (su contenido va en .b-respuestas, absoluta), no en el body: en su relleno de abajo (crece hacia abajo desde su lugar fijo: CLS 0 y sin scroll dentro de ella) se reserva el alto del aviso
   (--ck-alto, de consentimiento.js) para que lo de abajo pueda subir y nunca quede atrás. En escritorio va a la derecha, donde
   el hero está vacío, y más angosto para no tocar las sugerencias. */
body.con-aviso-cookies #capa-buscar .b-respuestas{padding-bottom:calc(var(--barra,0px) + env(safe-area-inset-bottom) + var(--ck-alto,0px) + 16px)}
@media(min-width:1240px){body.en-portada .hm-cookies{left:auto;right:24px;width:440px}}

/* Misión 12 (Equipo D, 1-nov-2026): la portada mide ≈ 9,000 px y, de la cuarta pieza para abajo, todo empieza fuera de la
   pantalla (≈ 750 elementos). Con content-visibility:auto el navegador no les calcula estilo, acomodo ni pintura hasta que
   se acercan; «auto» en el tamaño recuerda el real en cuanto ya se dibujaron (la barra de desplazamiento no salta). */
.b-respuestas .bx-portada>:is(section,nav){content-visibility:auto;contain-intrinsic-size:auto 900px}
/* En escritorio las secciones miden menos (medidas de O: 69–1536 px, la mitad cerca de 560): con 900 la página arrancaba
   2,700 px más larga y un salto al fondo se quedaba corto. */
@media(min-width:1024px){.b-respuestas .bx-portada>:is(section,nav){contain-intrinsic-size:auto 560px}}
/* La orden del buscador con cuenta (ordenes.js): el borrador del correo o el aviso de lo que pasó, debajo de la respuesta. */
.tj-orden{margin:12px 0 0}
.tj-orden-correo,.tj-orden-caja{display:grid;gap:10px;padding:14px;border-radius:18px;background:var(--pl-blanco);box-shadow:0 0 0 1px var(--pl-linea)}
.tj-orden-caja.es-ok{box-shadow:0 0 0 1px var(--pl-jade)}
.tj-orden-t{display:flex;gap:8px;align-items:center;margin:0;font:800 var(--pl-f3,16px)/1.25 Manrope,system-ui,sans-serif}
.tj-orden-t svg{width:20px;height:20px;flex:0 0 20px}
.tj-orden-caja p{margin:0;line-height:1.45}
.tj-orden-aviso{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:var(--pl-f2,14px);line-height:1.4;color:var(--pl-tenue)}
.tj-orden-aviso svg{width:16px;height:16px;flex:0 0 16px;margin-top:2px}
.tj-orden-correo .bx-campo input,.tj-orden-correo .bx-campo textarea{width:100%;box-sizing:border-box}
.tj-orden-correo .b-asesor-btn{white-space:normal;max-width:100%}
/* Confirmar tu cuenta (cuenta.js · confirmarVista, misión 11.20 con la vara del director de arte), sobre el molde .ms-vista:
   ceja, titular, la H de la casa (la moneda) como objeto, una línea y la acción (fija al pulgar en celular mientras se puede
   confirmar). Estados por data-estado: listo · cargando (el anillo gira en ámbar) · hecho (sello verde) · error (sello coral
   con «!», anillo coral y el aviso arriba de la acción) · vacío. */
.cf-vista [hidden]{display:none!important}
.b-respuestas .bx-cuenta.cf-vista{grid-template-columns:minmax(0,1fr);margin-inline:auto}
.b-respuestas .bx-cuenta.cf-vista > *{grid-column:1;grid-row:auto}
.cf-marca{position:relative;display:grid;place-items:center;justify-self:center;width:min(54vw,240px)!important;aspect-ratio:1;margin:0}
.cf-anillo{position:absolute;inset:0;border-radius:50%;border:1px solid var(--pl-linea);background:radial-gradient(circle at 50% 40%,var(--pl-blanco) 0%,var(--pl-fondo-2) 70%);box-shadow:var(--pl-sombra)}
.cf-marca .moneda.grande{position:relative;width:58%;height:58%;font-size:0;box-shadow:var(--pl-sombra-alta);animation:cf-entra var(--pl-t3) var(--pl-curva) both}
.cf-sello{position:absolute;right:13%;bottom:13%;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--pl-jade);color:var(--pl-blanco);font:800 var(--pl-f4,20px)/1 var(--pl-letra-grito);box-shadow:var(--pl-sombra);transform:scale(0);transition:transform var(--pl-t2) var(--pl-curva)}
.cf-sello svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2.4}
.cf-vista[data-estado=hecho] .cf-sello{transform:scale(1)}
.cf-vista[data-estado=cargando] .cf-anillo{border-width:2px;border-top-color:var(--pl-ambar);animation:cf-gira var(--pl-t4) linear infinite}
.cf-vista[data-estado=error] .cf-anillo{border:2px solid var(--pl-coral)}
.cf-vista[data-estado=error] .cf-marca .moneda.grande{filter:grayscale(.6);opacity:.8}
.cf-vista[data-estado=error] .cf-sello{transform:scale(1);background:var(--pl-coral)}
.cf-vista[data-estado=error] .cf-sello svg{display:none}
.cf-vista[data-estado=error] .cf-sello:after{content:"!"}
.cf-estado:empty{display:none}
.cf-accion .btn-primary[aria-busy=true]{cursor:progress;opacity:.85}
@keyframes cf-entra{from{transform:scale(.86);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes cf-gira{to{transform:rotate(1turn)}}
@media (min-width:768px){.cf-marca{width:140px!important}}
@media (max-width:767px){.cf-vista:is([data-estado=listo],[data-estado=cargando]) .cf-accion{position:sticky;bottom:calc(84px + env(safe-area-inset-bottom));z-index:2;padding:12px 0 4px;background:linear-gradient(to top,var(--pl-fondo) 70%,transparent)}}
@media (prefers-reduced-motion:reduce){.cf-marca .moneda.grande,.cf-vista[data-estado=cargando] .cf-anillo{animation:none}.cf-sello{transition:none}}
/* Se acabaron las preguntas gratis (respuesta.js · limiteGratis, misión 11.23 con la vara del director de arte), sobre el molde
   .ms-vista: ceja, titular de la piel, la cifra como objeto (en el degradado de la casa, con su barra al 100 % que entra),
   una línea y la acción a lo ancho (fija al pulgar en celular), con «Ver planes» como liga. */
.lm-cifra{display:grid;gap:10px;justify-items:center;width:min(100%,400px)!important;justify-self:center}
.lm-cifra strong{font:800 var(--pl-t-cifra)/.9 var(--pl-letra-grito);letter-spacing:-.04em;background:var(--pl-degradado-texto);-webkit-background-clip:text;background-clip:text;color:transparent}
.lm-barra{display:block;width:100%;height:8px;border-radius:999px;background:var(--pl-fondo-2);box-shadow:inset 0 0 0 1px var(--pl-linea);overflow:hidden}
.lm-barra i{display:block;height:100%;width:100%;border-radius:999px;background:var(--pl-degradado);transform-origin:left;animation:lm-llena var(--pl-t3) var(--pl-curva) both}
.lm-cifra small{color:var(--pl-tenue);font-size:var(--pl-f2,14px)}
.lm-accion{justify-items:center}
.lm-accion .btn-text{min-height:44px;display:inline-flex;align-items:center;justify-self:center}
@keyframes lm-llena{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:767px){.lm-accion{position:sticky;bottom:calc(84px + env(safe-area-inset-bottom));z-index:2;padding:12px 0 4px;background:linear-gradient(to top,var(--pl-fondo) 70%,transparent)}}
@media (prefers-reduced-motion:reduce){.lm-barra i{animation:none}}
/* La sesión de arranque (arranque.js, misión 11.21 con la vara del director de arte). Elegir la hora es pantalla de formulario
   (a la izquierda): los días en tarjetas de 1 px, las horas en una rejilla de 44 px (la elegida en ámbar) y, desde 1024 px,
   el formulario fijo a la derecha de los días. Agendada, liga mala y sin calendario son pantallas de mensaje (.ms-vista): la
   fecha agendada o el calendario de la casa como objeto. */
.ar-vista{display:grid;gap:18px}
.ar-cuerpo{display:grid;gap:16px}
.ar-dias{display:grid;gap:12px;align-items:start}
.ar-dia{display:grid;align-content:start;gap:10px;padding:14px;border-radius:16px;background:var(--pl-blanco);box-shadow:0 0 0 1px var(--pl-linea)}
.ar-dia .b-asesor-eti{margin:0;text-transform:none;letter-spacing:0;color:var(--pl-tinta)}
.ar-horas{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.ar-hora{justify-content:center;min-height:44px;margin:0;transition:background var(--pl-t1) var(--pl-curva),transform var(--pl-t1) var(--pl-curva)}
.ar-hora:active{transform:scale(.97)}
.ar-hora[aria-pressed=true]{background:var(--pl-ambar);color:var(--pl-tinta);box-shadow:0 0 0 1px var(--pl-ambar-texto)}
.ar-form{align-self:start;padding:16px;border-radius:16px;background:var(--pl-fondo-2);box-shadow:0 0 0 1px var(--pl-linea)}
.ar-form .btn-primary{width:100%;white-space:normal}
.ar-estado.es-error{color:var(--pl-coral-texto);font-weight:700}
.ar-marca,.ar-fecha{display:grid;place-items:center;justify-self:center;margin:0}
.ar-marca{width:min(44vw,180px)!important;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 40%,var(--pl-blanco) 0%,var(--pl-fondo-2) 70%);box-shadow:0 0 0 1px var(--pl-linea),var(--pl-sombra)}
.ar-marca svg{width:38%;height:38%;fill:none;stroke:var(--pl-ambar-texto);stroke-width:1.6}
.ar-fecha{gap:2px;width:min(46vw,190px)!important;padding:18px 0;border-radius:20px;background:var(--pl-blanco);box-shadow:0 0 0 1px var(--pl-linea),var(--pl-sombra-alta);animation:cf-entra var(--pl-t3) var(--pl-curva) both}
.ar-fecha small{text-transform:uppercase;letter-spacing:.12em;color:var(--pl-coral-texto);font-weight:800;font-size:var(--pl-f2,14px)}
.ar-fecha strong{font:800 var(--pl-t-cifra)/.95 var(--pl-letra-grito);color:var(--pl-tinta)}
.ar-fecha span{color:var(--pl-tenue);font-size:var(--pl-f3,16px)}
.ms-vista .bx-ok.ms-linea{justify-content:center}
.ms-vista .bx-ok.ms-linea svg{display:none}
@media (min-width:768px){.ar-marca{width:140px!important}.ar-fecha{width:160px!important}}
@media (min-width:1024px){.ar-cuerpo{grid-template-columns:minmax(0,1fr) 380px;align-items:start;column-gap:24px}.ar-form{position:sticky;top:96px}}
@media (prefers-reduced-motion:reduce){.ar-fecha{animation:none}.ar-hora{transition:none}}
/* Ya eligió su herramienta (elegir.js · elegidaHtml, misión 11.22 con la vara del director de arte): su herramienta es la
   protagonista (su escena a sangre en la tarjeta, el sello «Elegida», su nombre y una línea) y «Crear mi cuenta con …» justo
   debajo, a lo ancho (la tarjeta cabe en la primera pantalla del celular; fija, tapaba el nombre largo). Abajo, «O elige otra» con la rejilla de siempre (la elegida, marcada en ámbar). */
.el-elegida{display:grid;gap:14px;margin:0 0 8px;padding:0 0 16px;border-radius:20px;background:var(--pl-blanco);box-shadow:0 0 0 1px var(--pl-linea),var(--pl-sombra-alta);overflow:hidden;animation:cf-entra var(--pl-t3) var(--pl-curva) both}
.el-foto{position:relative;margin:0}
@media (max-width:767px){.el-foto .bx-ficha-media{aspect-ratio:auto;height:148px}.el-elegida{gap:12px}}
.el-sello{position:absolute;right:12px;top:12px;z-index:1;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 12px;border-radius:999px;background:var(--pl-ambar);color:var(--pl-tinta);font-weight:800;font-size:var(--pl-f2,14px)}
.bx-con-clip + .el-sello{top:16px;right:62px}
.el-txt{display:grid;gap:6px;padding:0 16px}
.el-txt .eyebrow{margin:0}
.el-nombre{font:800 var(--pl-f4,20px)/1.2 var(--pl-letra);color:var(--pl-tinta)}
.el-txt p{margin:0;color:var(--pl-tenue)}
.el-txt .bx-elegir-aviso{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.el-accion{display:grid;padding:0 16px}
.el-accion .btn-primary{white-space:nowrap;text-align:center}
.el-otra{margin:18px 0 10px;font:800 var(--pl-f3,16px)/1.2 var(--pl-letra);color:var(--pl-tinta)}
.bx-elegir .bx-elegida>.bx-ficha{box-shadow:0 0 0 1px var(--pl-ambar-texto)}
@media (min-width:1024px){.el-elegida{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;padding:0}.el-foto{grid-row:1 / span 2}.el-txt,.el-accion{padding:0 24px}.el-accion{align-self:start;padding-bottom:24px}}
@media (prefers-reduced-motion:reduce){.el-elegida{animation:none}}
/* El molde de las pantallas de mensaje del alta (regla del director de arte, 2-nov-2026: Confirmar, Límite, Agendada y Liga
   mala): todo centrado en una columna de 680 px, en este orden: ceja, titular, objeto, línea y acción. El aviso de error es
   UN componente (.ms-aviso: la caja de .oauth-aviso, a 16 px) y va ARRIBA de la acción. Las pantallas de formulario (elegir
   la hora) van a la izquierda. */
.b-respuestas .ms-vista{display:grid;gap:16px;max-width:680px;margin-inline:auto;text-align:center;justify-items:center}
.b-respuestas .ms-vista > *{width:100%}
.b-respuestas .ms-vista .b-asesor-cab{display:grid;justify-items:center;gap:12px;margin:0}
.b-respuestas .ms-vista .b-asesor-cab .b-asesor-titular{margin-inline:auto;max-width:none}
.ms-vista .ms-linea{margin:0;color:var(--pl-tenue)}
.ms-vista .ms-aviso{box-sizing:border-box;margin:0;font-size:var(--pl-f3,16px);text-align:left}
.ms-vista .ms-accion{display:grid;gap:10px;justify-items:stretch}
.ms-vista .ms-accion .btn-primary,.ms-vista .ms-accion .btn-glass{width:100%;white-space:normal;text-align:center}
@media (min-width:768px){.ms-vista .ms-accion,.ms-vista .ms-aviso{width:min(100%,400px);justify-self:center}.b-respuestas .ms-vista{gap:12px}.lm-cifra{gap:6px}}

/* El atajo a Mi panel (atajos-panel.js, 2-nov-2026): una tarjeta chica «Te llevo a tu Agenda», no un titular; dura lo que
   tarda en abrir la pestaña. */
.bx-atajo{display:flex;align-items:center;gap:12px;width:fit-content;max-width:100%;margin:0;padding:14px 18px;border:1px solid var(--bx-borde);border-radius:16px;color:var(--bx-tinta);font:600 var(--pl-f3,16px)/1.35 Manrope,system-ui,sans-serif}
.bx-atajo p{margin:0}
a.bx-atajo{min-height:44px;text-decoration:none}
a.bx-atajo:hover{border-color:var(--bx-borde-fuerte)}
.bx-atajo svg{flex:none;width:20px;height:20px;color:var(--bx-ambar-texto)}