/* «Apple Hostess» (Equipo L, 1-nov-2026). Lo que pidió Alex: «tiene que ser como un Apple Hostess… una sola idea por
   pantalla». Limpio, con mucho aire, tipografía grande y precisa, secciones negras para el drama y un solo acento (el
   ámbar de la casa, en degradado). Se quedan casi iguales el header y la barra del buscador; todo lo demás de /buscar se
   compone aquí, encima de v10.css, buscador.css y conoce.css, sin tocar la función de ninguna vista.
   El sistema completo: docs/sistema-diseno-2026.md. Reglas: solo variables --pl-* (nada suelto fuera de :root), 44 px en
   todo control, AA en todo texto, sin desborde a 360 px y quieto con prefers-reduced-motion. No restila .tj* (Equipo D),
   .bx-clip* ni la hoja .us-* (Equipo E). */

:root{
  /* Color */
  --pl-fondo:#FBFBFD;--pl-fondo-2:#F5F5F7;--pl-blanco:#FFFFFF;--pl-linea:#D2D2D7;--pl-linea-suave:rgb(0 0 0/.06);
  --pl-tinta:#1D1D1F;--pl-tenue:#6E6E73;
  --pl-noche:#0A0A0C;--pl-noche-2:#161618;--pl-noche-3:#232326;--pl-claro:#F5F5F7;--pl-claro-tenue:#A1A1A6;--pl-noche-linea:rgb(255 255 255/.12);
  --pl-ambar:#F6A623;--pl-ambar-claro:#FFC85C;--pl-ambar-texto:#8A5300;--pl-coral:#FF6B4A;--pl-coral-texto:#B4371B;--pl-jade:#2BC48A;--pl-jade-texto:#0E6B47;
  --pl-degradado:linear-gradient(100deg,#F6A623 0%,#FF6B4A 100%);
  --pl-cubo-cara:linear-gradient(150deg,#34343b 0%,#0A0A0C 46%,#1b1b20 78%,#2c2c33 100%);--pl-cubo-h:linear-gradient(160deg,#ffe2a8 0%,#F6A623 40%,#C9822C 75%,#7A4A00 100%);--pl-cubo-borde:rgb(246 166 35/.55);--pl-cubo-sombra:#000;
  --pl-degradado-texto:linear-gradient(100deg,#A35E00 0%,#C2410C 100%);
  --pl-sombra:0 2px 4px rgb(0 0 0/.04),0 20px 40px -24px rgb(0 0 0/.18);
  --pl-sombra-alta:0 4px 10px rgb(0 0 0/.05),0 36px 60px -30px rgb(0 0 0/.28);
  /* Letra */
  --pl-letra-grito:'Archivo',Manrope,system-ui,sans-serif;--pl-letra:Manrope,system-ui,sans-serif;
  --pl-t-hero:clamp(44px,6.2vw,80px);--pl-t-titulo:clamp(36px,6vw,72px);--pl-t-sub:clamp(18px,2vw,24px);--pl-t-cifra:clamp(56px,8vw,112px);
  /* Medidas */
  --pl-pad:clamp(20px,4.4vw,56px);--pl-aire:clamp(64px,9vw,120px);--pl-banda:clamp(56px,7vw,96px);
  --pl-r-s:12px;--pl-r-m:18px;--pl-r-l:28px;--pl-r-pill:999px;
  /* Movimiento */
  --pl-curva:cubic-bezier(.16,1,.3,1);--pl-t1:.16s;--pl-t2:.32s;--pl-t3:.6s;--pl-t4:.9s;--pl-t-entra:.4s;--pl-paso:70ms;--pl-chat-paso:.18s;--pl-chat-dura:.32s;--pl-latido:1s;
}

/* ── El lienzo: la tarjeta es la página ── */
/* Fondo liso (director de arte, 1-nov-2026): sin las esferas de cristal detrás; el script de la piel (en línea en index.html) apaga también la escena WebGL de
   la barra. El contenido es el protagonista. */
body.en-buscar,#capa-buscar.capa-completa:not(#pl),html.fx-con-cielo #capa-buscar.capa-completa{background:var(--pl-fondo)}
.fx-cielo{background:var(--pl-fondo)}
.fx-cielo:before,.fx-cielo:after{display:none}
/* Sin tarjeta que envuelva: las pantallas van a sangre y el texto respeta el margen de la página */
#capa-buscar section.b-respuestas:not(#pl){background:transparent;color:var(--pl-tinta);border-radius:0;box-shadow:none;padding-top:clamp(8px,2vw,24px);padding-left:0;padding-right:0;overflow:visible;font-family:var(--pl-letra)}
.b-respuestas .b-asesor{color:var(--pl-tinta)}
.b-respuestas .eyebrow,.b-respuestas .b-ayuda-eti,.b-respuestas .b-asesor-eti,.b-respuestas .bx-diag-paso{font:700 var(--pl-f2,14px)/1.3 var(--pl-letra);letter-spacing:.02em;text-transform:none;color:var(--pl-ambar-texto)}

/* La palabra de la casa: la última de cada titular, en el degradado ámbar (vistas.js · voz la pone en el HTML; el texto no cambia) */
.pl-voz{background:var(--pl-degradado-texto);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* ── Cabecera de cada vista: grande, precisa, con aire ── */
.b-respuestas .bx-vista>.b-asesor-cab:first-child{display:grid;gap:clamp(12px,1.6vw,20px);padding:clamp(16px,3vw,40px) 0 clamp(8px,2vw,24px)}
.b-respuestas .bx-vista .b-asesor-cab .b-asesor-titular{max-width:18ch;margin:0;color:var(--pl-tinta);font:700 var(--pl-f6,40px)/1.02 var(--pl-letra-grito);letter-spacing:-.035em;text-wrap:balance}
.b-respuestas .bx-vista .b-asesor-cab .b-asesor-social{max-width:56ch;margin:0;color:var(--pl-tenue);font:500 var(--pl-t-sub)/1.45 var(--pl-letra);text-wrap:pretty}
.b-respuestas .bx-vista .b-asesor-cab .eyebrow{font-size:var(--pl-f3,16px)}

/* ── Portada · pantalla 1: el héroe, centrado, con la escena como producto ── */
.b-respuestas .bx-portada>.bx-cx-hero:first-child{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:clamp(24px,3vw,40px);padding:clamp(8px,2.4vw,32px) 0 0;text-align:center}
/* El héroe no es la sección «Conoce»: sin eyebrow (el texto queda para lectores de pantalla) */
.b-respuestas .bx-portada .bx-cx-hero .eyebrow{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.b-respuestas .bx-portada .bx-cx-hero .b-asesor-cab{display:grid;justify-items:center;gap:clamp(14px,1.8vw,22px);padding:0}
.b-respuestas .bx-portada .bx-cx-hero .b-asesor-titular{max-width:14ch;font-size:var(--pl-t-hero);line-height:.98;letter-spacing:-.045em}
.b-respuestas .bx-portada .bx-cx-hero .b-asesor-social{max-width:40ch;margin-inline:auto}
.b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena{width:min(860px,100%);height:clamp(280px,30vw,380px);margin:0;text-align:left;border-radius:var(--pl-r-l);box-shadow:var(--pl-sombra-alta)}
.b-respuestas .bx-portada>.bx-cx-hero:first-child+.b-ayuda-grupo{display:grid;justify-items:center;gap:14px;margin-top:clamp(8px,2vw,24px);text-align:center}
.b-respuestas .bx-portada>.bx-cx-hero:first-child+.b-ayuda-grupo .b-ayuda-chips{justify-content:center}

/* ── Pastillas y botones: el ámbar es la acción; lo demás, tinta ── */
.b-respuestas .b-ayuda-chip{min-height:44px;border:0;background:var(--pl-blanco);color:var(--pl-tinta);box-shadow:inset 0 0 0 1px var(--pl-linea);font-weight:700;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background var(--pl-t2) var(--pl-curva),color var(--pl-t2) var(--pl-curva),box-shadow var(--pl-t2) var(--pl-curva),transform var(--pl-t2) var(--pl-curva)}
/* El :hover no se parece a «elegida» (tinta) y solo existe con mouse: en el celular, tras un toque, el :hover se quedaba
   pegado en la respuesta bajo el dedo y se veía elegida sin que nadie la tocara (Equipo O y coordinador, 1-nov-2026). */
@media (hover:hover) and (pointer:fine){.b-respuestas .b-ayuda-chip:hover{box-shadow:inset 0 0 0 2px var(--pl-ambar)}}
.b-respuestas .b-ayuda-chip:active,.b-respuestas .b-asesor-btn:active{transform:scale(.97)}
.b-respuestas .b-asesor-btn{gap:8px;min-height:48px;padding:0 24px;border:0;border-radius:var(--pl-r-pill);background:transparent;color:var(--pl-tinta);box-shadow:inset 0 0 0 1.5px var(--pl-tinta);font:700 var(--pl-f3,16px)/1 var(--pl-letra);transition:background var(--pl-t2) var(--pl-curva),color var(--pl-t2) var(--pl-curva),transform var(--pl-t2) var(--pl-curva)}
.b-respuestas .b-asesor-btn:hover{background:var(--pl-tinta);color:var(--pl-claro)}
.b-respuestas .b-asesor-btn.primario{background:var(--pl-ambar);color:var(--pl-tinta);box-shadow:none}
.b-respuestas .b-asesor-btn.primario:hover{background:var(--pl-ambar-claro)}
.b-respuestas .b-asesor-btn svg{transition:transform var(--pl-t2) var(--pl-curva)}
.b-respuestas .b-asesor-btn:hover svg{transform:translateX(4px)}
.b-respuestas :is(.b-asesor-btn,.b-ayuda-chip,a.bx-ficha):focus-visible{outline:3px solid var(--pl-ambar);outline-offset:3px}

/* ── Secciones de la portada: una idea por pantalla, centrada, sin numeritos ── */
.b-respuestas .bx-portada .bx-seccion,.b-respuestas .ap-pantalla{margin-top:var(--pl-aire);padding-top:0;border-top:0}
.b-respuestas .bx-portada .bx-seccion-cab,.b-respuestas .ap-cab{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:14px;margin:0 auto clamp(32px,5vw,64px);max-width:860px;text-align:center}
.b-respuestas .bx-portada .bx-seccion-cab>b{display:none}
.b-respuestas .bx-seccion-titulo,.b-respuestas .ap-titulo{margin:0;color:var(--pl-tinta);font:700 var(--pl-t-titulo)/1.02 var(--pl-letra-grito);letter-spacing:-.04em;text-wrap:balance}
.b-respuestas .bx-seccion-cab p,.b-respuestas .ap-sub{margin:0 auto;max-width:44ch;color:var(--pl-tenue);font:500 var(--pl-t-sub)/1.45 var(--pl-letra);text-wrap:pretty}
.b-respuestas .bx-portada .bx-seccion>.b-asesor-botones{justify-content:center;margin-top:clamp(24px,3vw,40px)}

/* Bandas a sangre: la tarjeta se abre de lado a lado */
.b-respuestas :is(.bx-portada .bx-seccion[data-seccion=conoce],.ap-cifras){margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:var(--pl-banda) calc(50vw - 50%);background:var(--pl-noche);color:var(--pl-claro)}

/* Pantalla «Atiende. Vende. Cobra. Ordena.»: cuatro tarjetas, cada una con su pantallita de ejemplo */
.ap-bento{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(12px,1.6vw,20px);margin:0;padding:0;list-style:none}
@media (min-width:700px){.ap-bento{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ap-bento{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ap-trabajo{position:relative;display:grid;grid-template-rows:1fr auto auto;gap:8px;padding:clamp(18px,2vw,28px);border-radius:var(--pl-r-l);background:var(--pl-fondo-2);overflow:hidden;isolation:isolate}
.ap-trabajo>b{font:700 var(--pl-f5,40px)/1 var(--pl-letra-grito);letter-spacing:-.04em}
.ap-trabajo>span{min-height:2.8em;color:var(--pl-tenue);font:500 var(--pl-f3,16px)/1.4 var(--pl-letra)}
.ap-trabajo:before{content:"";position:absolute;inset:-40% -30% auto;height:80%;z-index:-1;background:radial-gradient(50% 50% at 50% 50%,var(--pl-c),transparent 70%);opacity:.28}
.ap-atiende{--pl-c:var(--pl-jade)}.ap-vende{--pl-c:var(--pl-ambar)}.ap-cobra{--pl-c:var(--pl-coral)}.ap-ordena{--pl-c:var(--pl-claro-tenue)}
.ap-pantallita{display:grid;align-content:start;gap:8px;min-height:clamp(170px,16vw,210px);margin-bottom:12px;padding:14px;border-radius:var(--pl-r-m);background:var(--pl-blanco);box-shadow:var(--pl-sombra);font:600 var(--pl-f2,14px)/1.35 var(--pl-letra);color:var(--pl-tinta)}
.ap-pantallita p{margin:0}
.ap-pantallita small{justify-self:start;padding:3px 8px;border-radius:var(--pl-r-pill);background:var(--pl-fondo-2);color:var(--pl-tenue);font:700 var(--pl-f1,12px)/1.2 var(--pl-letra)}
.ap-burbuja{max-width:86%;padding:8px 11px;border-radius:var(--pl-r-m);background:var(--pl-fondo-2)}
.ap-burbuja.ap-tuya{justify-self:end;background:var(--pl-tinta);color:var(--pl-claro)}
.ap-renglon{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--pl-linea-suave)}
.ap-renglon:last-of-type{border-bottom:0}
.ap-total{display:flex;justify-content:space-between;align-items:center;font:700 var(--pl-f4,20px)/1 var(--pl-letra-grito);letter-spacing:-.03em}
.ap-sello{justify-self:start;padding:5px 10px;border-radius:var(--pl-r-pill);background:var(--pl-jade);color:var(--pl-tinta);font:800 var(--pl-f1,12px)/1 var(--pl-letra)}
.ap-barras{display:flex;align-items:end;gap:8px;height:100px}
.ap-barras i{flex:1;height:var(--h);border-radius:var(--pl-r-s) var(--pl-r-s) 0 0;background:var(--pl-fondo-2)}
.ap-barras i:last-child{background:var(--pl-degradado)}

/* Pantalla de cifras, en negro, números enormes en degradado */
.ap-cifras ul{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(36px,5vw,56px) clamp(24px,3vw,48px);max-width:1100px;margin:0 auto;padding:0;list-style:none;text-align:center}
@media (min-width:700px){.ap-cifras ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ap-cifras ul{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ap-cifras b{display:block;background:var(--pl-degradado);-webkit-background-clip:text;background-clip:text;color:transparent;font:700 var(--pl-t-cifra)/1 var(--pl-letra-grito);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.ap-cifras span{display:block;max-width:20ch;margin:10px auto 0;color:var(--pl-claro-tenue);font:500 var(--pl-f3,16px)/1.4 var(--pl-letra)}

/* «Conoce Hostess» en negro: los pasos son tarjetas de noche */
.b-respuestas .bx-portada .bx-seccion[data-seccion=conoce] .bx-seccion-titulo{color:var(--pl-claro)}
.b-respuestas .bx-portada .bx-seccion[data-seccion=conoce] .bx-seccion-titulo .pl-voz{background:var(--pl-degradado);-webkit-background-clip:text;background-clip:text}
.b-respuestas .bx-portada .bx-seccion[data-seccion=conoce] .bx-seccion-cab p{color:var(--pl-claro-tenue)}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-paso{background:var(--pl-noche-2);color:var(--pl-claro);border:0;box-shadow:inset 0 0 0 1px var(--pl-noche-linea);-webkit-backdrop-filter:none;backdrop-filter:none;padding:22px 20px}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-paso strong{color:var(--pl-claro);font-size:var(--pl-f3,16px)}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-paso :is(p,span,small){color:var(--pl-claro-tenue);font-size:var(--pl-f3,16px);line-height:1.5}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-paso b,.b-respuestas .bx-seccion[data-seccion=conoce] .bx-paso:first-child b{width:auto;height:auto;margin-bottom:10px;justify-content:start;border-radius:0;background:var(--pl-degradado);-webkit-background-clip:text;background-clip:text;color:transparent;font:700 var(--pl-f5,40px)/1 var(--pl-letra-grito);letter-spacing:-.04em}
.b-respuestas .bx-seccion[data-seccion=conoce] :is(.bx-paso a,.bx-paso-ir){color:var(--pl-ambar-claro)}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-servicios li{background:transparent;border:0;border-top:1px solid var(--pl-noche-linea);border-radius:0;padding:18px 4px 4px}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-servicios strong{color:var(--pl-claro)}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-servicios span{color:var(--pl-claro-tenue)}
.b-respuestas .bx-seccion[data-seccion=conoce] .bx-servicios li svg{color:var(--pl-ambar-claro)}
.b-respuestas .bx-seccion[data-seccion=conoce] .b-asesor-btn{color:var(--pl-claro);box-shadow:inset 0 0 0 1.5px var(--pl-claro)}
.b-respuestas .bx-seccion[data-seccion=conoce] .b-asesor-btn:hover{background:var(--pl-claro);color:var(--pl-tinta)}

/* Botones sobre fondo oscuro (plan Empresarial, Vértice): contorno claro, nunca tinta sobre negro */
.b-respuestas :is(.bx-plan-oscuro,.bx-vertice,.bx-beneficio-red) .b-asesor-btn:not(.primario){color:var(--pl-claro);box-shadow:inset 0 0 0 1.5px var(--pl-claro)}
.b-respuestas :is(.bx-plan-oscuro,.bx-vertice,.bx-beneficio-red) .b-asesor-btn:not(.primario):hover{background:var(--pl-claro);color:var(--pl-tinta)}

/* En la portada «Conoce» enseña solo los pasos; los cuatro servicios viven en la vista Conoce Hostess */
.b-respuestas .bx-portada .bx-seccion[data-seccion=conoce] .bx-servicios{display:none}

/* Un solo eyebrow por pantalla: «Prueba con» se entiende por sus pastillas (el grupo conserva su aria-label) */
.b-respuestas .bx-portada>.bx-cx-hero:first-child+.b-ayuda-grupo .b-ayuda-eti{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.b-respuestas a.bx-ficha:active{transform:scale(.98)}

/* El aviso de cookies es del Equipo D (consentimiento.js · su tira de una línea en todos los anchos): la piel no lo restila. */

/* La acción principal bajo el héroe */
.ap-accion{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(20px,3vw,32px)}
.b-respuestas .ap-accion .b-asesor-btn.primario{min-height:56px;padding:0 clamp(22px,3vw,32px);font-size:var(--pl-f3,16px);white-space:nowrap}

.b-respuestas .bx-portada .bx-seccion[data-seccion=conoce] .bx-paso:nth-child(n+4){display:none}
@media (min-width:900px){.b-respuestas .bx-portada .bx-seccion[data-seccion=conoce] .bx-pasos{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1000px;margin-inline:auto}}


/* «Crea tu cuenta»: una pantalla gris, la acción enorme */
.b-respuestas .bx-portada .bx-seccion[data-seccion=cuenta]{padding:0;background:none}
.b-respuestas .bx-seccion[data-seccion=cuenta] .b-asesor-btn.primario{min-height:56px;padding:0 32px;font-size:var(--pl-f3,16px);white-space:nowrap}
.b-respuestas .bx-seccion[data-seccion=cuenta] .bx-beneficio-red{max-width:860px;margin:clamp(32px,4vw,48px) auto 0}

/* ── Fichas, pasos y planes: superficies limpias, la foto manda ── */
.b-respuestas :is(.bx-ficha,.bx-paso,.bx-plan,.bx-marca,.bx-conector,.bx-acceso,.bx-clases){--mx:50%;--my:0%}
.b-respuestas :is(.bx-ficha,.bx-paso,.bx-marca,.bx-conector,.bx-acceso,.bx-clases){border:0;border-radius:var(--pl-r-l);background:var(--pl-blanco);box-shadow:var(--pl-sombra);-webkit-backdrop-filter:none;backdrop-filter:none}
.b-respuestas a.bx-ficha{transition:transform var(--pl-t3) var(--pl-curva),box-shadow var(--pl-t3) var(--pl-curva)}
.b-respuestas a.bx-ficha:hover{transform:translateY(-6px);box-shadow:var(--pl-sombra-alta)}
.b-respuestas .bx-ficha-media{background:var(--pl-fondo-2)}
.b-respuestas .bx-ficha-media img{transition:transform var(--pl-t4) var(--pl-curva)}
.b-respuestas a.bx-ficha:hover .bx-ficha-media img{transform:scale(1.04)}
.b-respuestas .bx-ficha-ir{color:var(--pl-tinta);font-weight:800}
.b-respuestas .bx-diag-ayuda{margin-inline:auto}
.b-respuestas .bx-diag{border:0;border-radius:var(--pl-r-l);background:var(--pl-fondo-2);box-shadow:none;text-align:center}
.b-respuestas .bx-diag .b-ayuda-chips{justify-content:center}
/* En la portada, 6 giros y «Más giros» (el script de la piel pone el botón) */
.b-respuestas .bx-portada .bx-diag .b-ayuda-chips.pl-pocos>.b-ayuda-chip:nth-child(n+7):not(.pl-mas-giros){display:none}
.b-respuestas .bx-diag-pregunta{font:700 var(--pl-f5,40px)/1.05 var(--pl-letra-grito);letter-spacing:-.035em}
.b-respuestas .bx-plan{border:0;border-radius:var(--pl-r-l);background:var(--pl-blanco);box-shadow:var(--pl-sombra);transition:transform var(--pl-t3) var(--pl-curva),box-shadow var(--pl-t3) var(--pl-curva)}
.b-respuestas .bx-plan:hover{transform:translateY(-4px);box-shadow:var(--pl-sombra-alta)}
.b-respuestas :is(.bx-plan-precio,.b-asesor-precio){font-family:var(--pl-letra-grito);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.b-respuestas .bx-plan-destacado{box-shadow:0 0 0 2px var(--pl-ambar),var(--pl-sombra-alta)}
.b-respuestas .bx-plan-oscuro{background:var(--pl-noche);color:var(--pl-claro)}

/* Planes en la portada, versión corta: precio, para quién y 3 puntos; lo demás vive en Precios («Ver precios y el Token») */
.b-respuestas .bx-portada :is(.bx-ya-claude,.bx-plan-asesoria,.bx-plan-claude,.bx-plan .bx-vertice,.bx-solo-su-claude){display:none}
.b-respuestas .bx-portada .bx-plan .bx-puntos li:nth-child(n+4){display:none}
/* En la portada, tres planes; Empresarial y Esencial viven en «Ver todos los planes» */
.b-respuestas .bx-portada :is(.bx-plan-oscuro,.bx-plan-esencial){display:none}
.b-respuestas .bx-portada .bx-plan{gap:12px;padding:clamp(22px,2.4vw,32px)}
.b-respuestas .bx-portada .bx-plan-precio{font-size:var(--pl-f5,40px)}

/* Planes mientras llegan (piden el cobro vivo): tres siluetas que respiran; si no llegan, queda «Ver precios» */
.b-respuestas .bx-planes-espera{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;min-height:280px}
.b-respuestas .bx-planes-espera:before,.b-respuestas .bx-planes-espera:after{content:"";border-radius:var(--pl-r-l);background:var(--pl-fondo-2);animation:ap-punto var(--pl-latido) ease-in-out infinite}

/* Contacto: una pantalla gris, centrada */
.b-respuestas .bx-contacto{margin-top:var(--pl-aire);padding:var(--pl-banda) clamp(20px,4vw,56px);border:0;border-radius:var(--pl-r-l);background:var(--pl-fondo-2);box-shadow:none;text-align:center;-webkit-backdrop-filter:none;backdrop-filter:none}
.b-respuestas .bx-contacto .b-asesor-eti{justify-content:center;color:var(--pl-tinta);font:700 var(--pl-t-titulo)/1.02 var(--pl-letra-grito);letter-spacing:-.04em}
.b-respuestas .bx-contacto p{max-width:44ch;margin-inline:auto;color:var(--pl-tenue);font-size:var(--pl-t-sub)}
.b-respuestas .bx-contacto .b-asesor-botones{justify-content:center}
.b-respuestas .bx-por-negocio,.b-respuestas .bx-portada .b-asesor-pie{text-align:center}
.b-respuestas .bx-por-negocio .bx-negocios{justify-content:center}
.b-respuestas .bx-negocios a{border-radius:var(--pl-r-pill)}
.b-respuestas .b-asesor-pie{color:var(--pl-tenue)}

/* ── Entrada al bajar (script de la piel, en línea): solo lo que está debajo de la pantalla cuando la persona empieza a bajar se marca
   pendiente y entra al verse (desvanecido y 12 px, 400 ms, escalonado). Sin JS, sin bajar o con reducir movimiento, todo se
   ve quieto: nunca una caja en blanco (tampoco en una captura de página entera). */
/* Pendiente = solo invisible: sin transform ni transición, no se vuelve capa mientras no se ve (lote 11). */
.pl-pendiente{opacity:0}
.pl-visto{animation:pl-entra var(--pl-t-entra) var(--pl-curva) both;animation-delay:calc(var(--pl-k,0) * var(--pl-paso))}
@keyframes pl-entra{from{opacity:0;transform:translateY(12px)}}

/* ── El héroe: el chat de restaurante (ejemplo) como pieza principal ── */
.b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;align-items:center;gap:clamp(16px,3vw,48px);width:min(1000px,100%);height:auto;min-height:0;padding:clamp(18px,3.4vw,48px);border-radius:var(--pl-r-l);background:radial-gradient(60% 70% at 85% 10%,rgb(246 166 35/.22),transparent 70%),radial-gradient(50% 60% at 0% 100%,rgb(43 196 138/.16),transparent 70%),var(--pl-fondo-2);box-shadow:none;overflow:hidden;text-align:left}

.ap-tel{width:min(400px,100%);border-radius:var(--pl-r-l);background:var(--pl-blanco);box-shadow:var(--pl-sombra-alta);overflow:hidden}
.ap-tel-cab{display:flex;align-items:center;gap:10px;margin:0;padding:14px 16px;background:var(--pl-noche);color:var(--pl-claro)}
.ap-tel-cab b{display:block;font:700 var(--pl-f3,16px)/1.2 var(--pl-letra)}
.ap-tel-cab small{display:block;color:var(--pl-claro-tenue);font:500 var(--pl-f1,12px)/1.3 var(--pl-letra)}
.ap-tel-foto{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--pl-r-pill);background:var(--pl-ambar);color:var(--pl-tinta);font:800 var(--pl-f3,16px)/1 var(--pl-letra-grito)}
.ap-msjs{display:grid;gap:8px;margin:0;padding:16px;list-style:none;min-height:340px;align-content:start}
.ap-m{max-width:84%;padding:9px 13px;border-radius:var(--pl-r-m);font:500 var(--pl-f2,14px)/1.4 var(--pl-letra);animation:ap-llega var(--pl-chat-dura) var(--pl-curva) both;animation-delay:calc(var(--t) * var(--pl-chat-paso) + var(--pl-t1))}
.ap-cliente{justify-self:end;background:var(--pl-fondo-2);color:var(--pl-tinta)}
.ap-hostess{justify-self:start;background:var(--pl-noche);color:var(--pl-claro)}
.ap-tarjeta{display:grid;gap:2px;min-width:62%;background:var(--pl-blanco);color:var(--pl-tinta);box-shadow:inset 0 0 0 1px var(--pl-linea)}
.ap-tarjeta b{font:700 var(--pl-f3,16px)/1.2 var(--pl-letra-grito);letter-spacing:-.01em}
.ap-tarjeta span{color:var(--pl-tenue);font-size:var(--pl-f2,14px)}
.ap-cobro{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;padding-top:8px;border-top:1px solid var(--pl-linea-suave);color:var(--pl-tinta)!important;font-weight:700}
.ap-tarjeta .ap-pagado{padding:3px 9px;border-radius:var(--pl-r-pill);background:var(--pl-jade);color:var(--pl-tinta);font-weight:800}
.ap-hechos{display:none;margin:0;padding:0;list-style:none}
@media (min-width:860px){
  .ap-hechos{display:grid;gap:14px;width:100%}
  .ap-hechos li{display:grid;gap:4px;padding:20px 24px;border-radius:var(--pl-r-m);background:var(--pl-blanco);box-shadow:var(--pl-sombra);animation:ap-llega var(--pl-chat-dura) var(--pl-curva) both;animation-delay:calc(var(--t) * var(--pl-chat-paso) + var(--pl-t1))}
  .ap-hechos b{font:700 var(--pl-f5,40px)/1 var(--pl-letra-grito);letter-spacing:-.04em}
  .ap-hechos span{color:var(--pl-tenue);font:500 var(--pl-f3,16px)/1.35 var(--pl-letra)}
  .ap-hechos li{grid-template-columns:auto minmax(0,1fr);column-gap:20px;align-items:center}
  .ap-hechos li>i{grid-row:span 2;display:grid;place-items:center;width:64px;height:64px;border-radius:var(--pl-r-m);background:var(--pl-fondo-2)}
  .ap-hechos li>i svg{width:34px;height:34px;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .ap-h-atiende>i svg{stroke:var(--pl-jade-texto)}.ap-h-vende>i svg{stroke:var(--pl-ambar-texto)}.ap-h-cobra>i svg{stroke:var(--pl-coral-texto)}
  .ap-h-atiende b{color:var(--pl-jade-texto)}.ap-h-vende b{color:var(--pl-ambar-texto)}.ap-h-cobra b{color:var(--pl-coral-texto)}
}
@keyframes ap-llega{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes ap-punto{0%,100%{opacity:.3}50%{opacity:1}}

@media (prefers-reduced-motion:reduce){
  .ap-m,.ap-hechos li{animation:none}
    .pl-pendiente{opacity:1;transform:none}
  .b-respuestas :is(.b-asesor-btn,.b-ayuda-chip,a.bx-ficha,.bx-plan,.bx-ficha-media img){transition:none}
  .b-respuestas :is(a.bx-ficha,.bx-plan):hover{transform:none}
}
/* Entrar y Crear cuenta van en una tarjeta angosta */
.b-respuestas[data-ancho=angosto] .bx-vista .b-asesor-cab .b-asesor-titular{font-size:var(--pl-f5,40px)}

/* ── Header: solo ajustes (decisión del coordinador, 1-nov-2026; Alex: «se queda casi casi») ──
   Escritorio: cinco enlaces a la vista y «Más» (el menú completo); Aliados y Proyectos viven ahí y en el pie. El remolino de
   Grupo PointCare se queda junto al logo, más chico y discreto (su nombre sigue para lectores de pantalla).
   Celular: una sola barra (logo y menú); «¿Qué es el buscador?» va dentro del menú. */
.hdr .nav a[data-ver=aliados],.hdr .nav a[data-ver=proyectos]{display:none}
.hdr .nav .hdr-grupo{min-width:44px;padding-inline:6px;opacity:.7;transition:opacity var(--pl-t2) var(--pl-curva)}
.hdr .nav .hdr-grupo:hover,.hdr .nav .hdr-grupo:focus-visible{opacity:1}
.hdr .nav .hdr-grupo img{width:auto;height:22px}
.hdr .nav .hdr-grupo span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hdr .nav a[data-ver=herramientas]{order:1}.hdr .nav a[data-ver=mentorias]{order:2}.hdr .nav a[data-ver=precios]{order:3}.hdr .nav a[data-ver=conoce]{order:4}.hdr .nav a[data-ver=sectores]{order:5}.hdr .nav .hdr-grupo{order:6}.hdr .nav .hdr-mas{order:7}
@media (max-width:640px){
  .hdr .hdr-que-es{display:none}
  /* Una sola barra de 50 px (de 6 a 56 px) para que la del buscador termine a ≤ 112 px */
  body.en-buscar .hdr{padding-top:0}
  body.en-buscar .hdr .hdr-in{height:50px;margin-top:6px;padding-block:0}
  body.en-buscar .hdr .marca img{height:34px;width:auto}
  body.en-buscar .hdr #btn-menu{width:44px;height:44px;min-height:44px}
}
.bx-menu button.b-asesor-rec{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer}

/* Mentorías (F): las dos tarjetas no se desbordan; si no caben lado a lado, se apilan */
.b-respuestas .bx-mentor-par{grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr))}
.b-respuestas .bx-mentor{min-width:0;border-radius:var(--pl-r-l)}
/* El titular del héroe: la primera frase en su renglón (vistas.js · frases) */
.pl-frase{display:block}

@media (max-width:640px){
  .b-respuestas .bx-portada>.bx-cx-hero:first-child{gap:20px;padding-top:4px}
  .b-respuestas .bx-portada .bx-cx-hero .eyebrow{display:none}
  .b-respuestas .bx-portada .bx-cx-hero .b-asesor-titular{font-size:var(--pl-f5,40px)}
  .b-respuestas .bx-portada .bx-cx-hero .b-asesor-social{font-size:var(--pl-f3,16px)}
  .b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{padding:10px;background:none}
  .ap-msjs{min-height:0;gap:6px;padding:12px}
  .ap-m{padding:7px 11px;font-size:var(--pl-f2,14px)}
  .ap-tel-cab{padding:10px 14px}
}
/* El héroe a tamaño completo en escritorio: teléfono de ~380×560 y los tres trabajos a su altura */
@media (min-width:860px){
  .b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{grid-template-columns:minmax(0,380px) minmax(0,1fr);align-items:stretch;width:min(1040px,100%)}
  .ap-tel{width:100%;display:grid;grid-template-rows:auto 1fr}
  .ap-msjs{min-height:0;gap:14px;padding:24px 20px;align-content:end}
  .ap-m{font-size:var(--pl-f3,16px);padding:13px 17px}
  .ap-tarjeta b{font-size:var(--pl-f3,16px)}.ap-tarjeta span{font-size:var(--pl-f3,16px)}
  .ap-hechos li{min-height:150px}
  .ap-hechos{grid-template-rows:repeat(3,1fr);align-self:stretch}
  .ap-hechos li{align-content:center;padding:28px 32px}
}/* Escritorio: el héroe en dos renglones (cada frase en el suyo) y el subtítulo en uno, para que el teléfono asome arriba del
   pliegue con su primera burbuja (director de arte, revisión 6) */
@media (min-width:1024px){
  .b-respuestas .bx-portada .bx-cx-hero .b-asesor-titular{max-width:none;font-size:var(--pl-f6,40px)}
  .b-respuestas .bx-portada .bx-cx-hero .b-asesor-social{max-width:60ch}
}

/* ── Escala tipográfica global de 6 pasos (director de arte, calificador medible: ≤ 6 tamaños por vista) ──
   12 · 14 · 16 · 20 · 40 · 72 (el último es 40 en celular y tableta: ahí la vista usa 5). Todo texto de /buscar cae en uno
   de estos pasos; !important porque reemplaza tamaños sueltos de hojas viejas (v10.css, buscador.css, conoce.css) que
   ganaban por especificidad. Las ilustraciones (texto dentro de un SVG) no son tipografía de la interfaz. */
/* Lote 25 (D, TBT): estas reglas eran «body.en-buscar :is(…)», que el navegador no indexa por clase y probaba contra unos
   3000 elementos en cada recálculo. Abiertas en selectores sueltos; cada uno lleva :not(.zz-nunca)/:not(zz-nunca) hasta la
   especificidad que :is() le daba (la mayor de su lista), para que la cascada quede idéntica. */
body.en-buscar .ap-pantallita small:not(.zz-nunca),body.en-buscar .ap-tel-cab small:not(.zz-nunca),body.en-buscar .ap-sello:not(.zz-nunca),body.en-buscar .ap-pagado:not(.zz-nunca),body.en-buscar .estado:not(.zz-nunca),body.en-buscar .bx-plan-sello:not(.zz-nunca),body.en-buscar .bx-negocios-t:not(.zz-nunca),body.en-buscar .b-asesor-pie:not(.zz-nunca),body.en-buscar .b-asesor-pie a:not(.zz-nunca),body.en-buscar .b-asesor-pie time:not(.zz-nunca),body.en-buscar .aviso-buscador:not(.zz-nunca),body.en-buscar .bx-lugar span:not(.zz-nunca),body.en-buscar .que-es-junto small:not(.zz-nunca),body.en-buscar .hdr .moneda,body.en-buscar .hm-ck-tira:not(.zz-nunca),body.en-buscar .hm-ck-tira a:not(.zz-nunca),body.en-buscar .b-ayuda-eti:not(.zz-nunca),body.en-buscar .bx-diag-paso:not(.zz-nunca),body.en-buscar .b-asesor-plan-nombre:not(.zz-nunca),body.en-buscar .bx-plan-kicker:not(.zz-nunca),body.en-buscar .bx-plan-precio small:not(.zz-nunca){font-size:var(--pl-f1,12px)!important}
body.en-buscar .ap-m:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .ap-m span:not(.zz-nunca):not(zz-nunca),body.en-buscar .ap-burbuja:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .ap-renglon span:not(.zz-nunca):not(zz-nunca),body.en-buscar .ap-renglon b:not(.zz-nunca):not(zz-nunca),body.en-buscar .b-ayuda-chip:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .bx-ficha-txt span:not(.zz-nunca):not(zz-nunca),body.en-buscar .bx-paso-ir:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .bx-puntos span:not(.zz-nunca):not(zz-nunca),body.en-buscar .bx-negocios a:not(.zz-nunca):not(zz-nunca),body.en-buscar .hm-ck-acciones button:not(.zz-nunca):not(zz-nunca),body.en-buscar .hm-ck-acciones button span:not(.zz-nunca),body.en-buscar .hm-ck-d:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .hdr .nav a:not(zz-nunca),body.en-buscar .hdr .nav a span,body.en-buscar .cuenta-hdr a:not(.zz-nunca):not(zz-nunca),body.en-buscar .que-es-junto span:not(.zz-nunca):not(zz-nunca),body.en-buscar .skip-link:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .ap-tel-foto:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .bx-diag-ayuda:not(.zz-nunca):not(zz-nunca):not(zz-nunca),body.en-buscar .bx-paso>span:not(.zz-nunca):not(zz-nunca),body.en-buscar .bx-beneficio-red p:not(.zz-nunca):not(zz-nunca),body.en-buscar .bx-plan-tokens span:not(.zz-nunca):not(zz-nunca){font-size:var(--pl-f2,14px)!important}
body.en-buscar .b-asesor-btn:not(.zz-nunca),body.en-buscar .bx-plan-tokens strong:not(.zz-nunca),body.en-buscar .bx-ficha-txt strong:not(.zz-nunca),body.en-buscar .bx-beneficio-red strong:not(.zz-nunca),body.en-buscar .ap-trabajo>span:not(.zz-nunca),body.en-buscar .ap-hechos span:not(.zz-nunca),body.en-buscar .ap-tel-cab b:not(.zz-nunca),body.en-buscar .ap-tarjeta b:not(.zz-nunca),body.en-buscar .bx-paso strong:not(.zz-nunca),body.en-buscar .hm-ck-t:not(.zz-nunca),body.en-buscar .bx-cx-hero .eyebrow{font-size:var(--pl-f3,16px)!important}
body.en-buscar .b-asesor-social:not(zz-nunca),body.en-buscar .ap-sub:not(zz-nunca),body.en-buscar .bx-seccion-cab p,body.en-buscar .bx-contacto p,body.en-buscar .ap-total:not(zz-nunca),body.en-buscar .ap-total span,body.en-buscar .ap-cifras span{font-size:var(--pl-f4,20px)!important}
body.en-buscar .bx-diag-pregunta:not(zz-nunca),body.en-buscar .bx-paso b,body.en-buscar .ap-trabajo>b,body.en-buscar .ap-hechos b,body.en-buscar .bx-plan-precio strong{font-size:var(--pl-f5,40px)!important}
body.en-buscar .b-asesor-titular:not(.zz-nunca),body.en-buscar .b-asesor-titular span:not(.zz-nunca),body.en-buscar .ap-titulo:not(.zz-nunca),body.en-buscar .bx-seccion-titulo:not(.zz-nunca),body.en-buscar .bx-seccion-titulo span:not(.zz-nunca),body.en-buscar .bx-contacto .b-asesor-eti,body.en-buscar .ap-cifras b:not(.zz-nunca){font-size:var(--pl-f6,40px)!important}
@media (min-width:1024px){body.en-buscar .ap-m{font-size:var(--pl-f3,16px)!important}}
/* Las ligas del pie miden 44 px de alto (WCAG 2.5.8) */
body.en-buscar .b-asesor-pie a{display:inline-flex;align-items:center;min-height:44px}
/* La barra que aparece al bajar (al-bajar.js): sus dos botones miden 44 px aun mientras entra con su escala (.96) */
body.en-buscar .bx-guardada :is(.bx-guardada-h,.bx-guardada-ir){width:46px;height:46px;min-width:46px}
/* Medida de lectura de 45 a 75 caracteres por línea (Bringhurst) en los textos corridos que quedaban anchos */
body.en-buscar .b-asesor-pie{max-width:62ch;margin-inline:auto}
body.en-buscar .bx-beneficio-red p{max-width:60ch}

/* En reposo nada se repite para siempre (director de arte: 58+ cps justo después de cargar): el reflejo de la H de la barra que
   aparece al bajar da dos vueltas y queda quieto, y mientras esa barra está oculta, en pausa. (El de la H de la barra de vidrio,
   en su Shadow DOM, lo limita el script de la piel.) */
body.en-buscar .bx-h::after{animation-iteration-count:1}
body.en-buscar .bx-guardada:not(.bx-visible) .bx-h::after{animation-play-state:paused}
/* El brillo del botón «Crear cuenta» del header (v10.css) daba vueltas para siempre: una pasada al cargar y otra al pasar el puntero */
body.en-buscar .btn-crear:before{animation-iteration-count:1}
@media (hover:hover){body.en-buscar .btn-crear:hover:before{animation-iteration-count:infinite}}

/* El héroe con la firma del Equipo N (director de arte, 9.1): a la izquierda el cubo de Hostess que se abre y suelta el chat, el
   ticket pagado, la moneda y el calendario (data-firma="heroe", firmas.js en reposo); a la derecha el teléfono con el chat real,
   que se forma con «revela». Sin JS o con reducir movimiento, el póster del cubo queda quieto. En celular, solo el teléfono:
   el héroe completo cabe en la primera pantalla. */
.ap-cubo{display:none}
@media (min-width:860px){
  .b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{grid-template-columns:minmax(0,1fr) minmax(0,380px)}
  .ap-cubo{display:block;align-self:stretch;width:100%;height:100%;min-height:420px;aspect-ratio:auto;background:var(--pl-noche);border-radius:var(--pl-r-l)}
  .ap-cubo .p-heroe{--u:clamp(40px,4.4vw,60px);display:block}
  .ap-cubo .p-heroe .fh-obj{position:absolute}
  .ap-cubo .p-heroe-cubo{position:absolute;left:50%;bottom:9%;width:calc(var(--u) * 2.3);aspect-ratio:1;transform:translateX(-50%);border-radius:var(--pl-r-s);display:grid;place-items:center;background:var(--pl-cubo-cara);border:1px solid var(--pl-cubo-borde)}
  .ap-cubo .p-heroe-cubo .firma-h{width:56%;background:var(--pl-cubo-h);filter:drop-shadow(1.5px 2px 0 var(--pl-cubo-sombra))}
}

/* El calendario del póster del cubo trae <i class="hoy">: la regla .hoy del panel (panel.css) no lo toca */
body.en-buscar .fh-calendario i.hoy{display:block}

/* Revisión 8 del director de arte: la escena entera (cubo y teléfono) asoma arriba del pliegue a 1280×800, sin marco crema */
@media (min-width:860px){
  .b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{padding:0;background:none;box-shadow:none;gap:clamp(16px,2vw,28px)}
}
@media (min-width:1024px){
  .b-respuestas .bx-portada>.bx-cx-hero:first-child{gap:clamp(20px,2.2vw,32px);padding-top:0}
  .b-respuestas .bx-portada .bx-cx-hero .b-asesor-cab{gap:12px}
}

/* Medida de lectura (45–75 caracteres por línea) para todo párrafo de /buscar */
body.en-buscar .b-respuestas p{max-width:37em}
/* «Ya tengo Claude Max 20x» (Precios y Comprar): la casilla mide 44 px */
body.en-buscar .bx-ya-claude input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:none;display:grid;place-content:center;width:44px;height:44px;margin:0;border:2px solid var(--pl-tinta);border-radius:var(--pl-r-s);background:var(--pl-blanco);cursor:pointer}
body.en-buscar .bx-ya-claude input[type=checkbox]:checked{background:var(--pl-ambar);border-color:var(--pl-ambar)}
body.en-buscar .bx-ya-claude input[type=checkbox]:checked::before{content:"";width:12px;height:20px;margin-top:-4px;border:solid var(--pl-tinta);border-width:0 3px 3px 0;transform:rotate(45deg)}
body.en-buscar .bx-ya-claude input[type=checkbox]:focus-visible{outline:3px solid var(--pl-ambar);outline-offset:3px}
/* Sin el «borde de luz» de la V10 en /buscar (lote 11): animaba --b-giro (@property) con un conic-gradient enmascarado en
   cada chip, plan y tarjeta, en el hilo principal: un recálculo de estilo de ~640 elementos por cuadro durante 1.5 s al
   cargar. La piel ya le da a cada pieza su filo fijo. */
body.en-buscar .b-asesor-diag::before,body.en-buscar .b-asesor-rec::before,body.en-buscar .b-asesor-precio::before,body.en-buscar .b-asesor-plan::before,body.en-buscar .b-ayuda-paso::before,body.en-buscar .b-ayuda-chip::before{animation:none}
/* En la portada solo entra el héroe al cargar: lo de abajo entra al verse (.pl-visto). Antes cada sección corría su entrada
   fuera de la pantalla (recálculos de estilo al cargar) y, con fill both, le ganaba al opacity:0 de lo pendiente. */
body.en-buscar .bx-portada > :not(.bx-cx-hero, .pl-visto),body.en-buscar .bx-portada .bx-paso:not(.pl-visto){animation:none}
/* Portada para el 10 (lote 15, director de arte). En celular, el héroe ocupa lo visible (sin el header ni la barra de
   lugares): el primer pantallazo termina con el teléfono completo y lo siguiente no asoma cortado. El aire de 1280 se
   ajusta junto con la composición nueva del héroe (N), con el héroe completo en 800 px. */
/* Lote 20 (O; D midió el sello «Pagado» detrás de la barra a 375×667 y 360×800): el héroe mide justo lo visible y el
   teléfono toma lo que sobra, nunca más que su alto natural. Si no cabe, se comporta como un chat de verdad: los mensajes
   se quedan abajo (el último, con «Pagado», siempre a la vista) y los primeros se cortan arriba. Con la tira de cookies
   abierta (--ck-alto, más los 12 px que la separan de la barra), el héroe resta también su alto; al cerrarla, vuelve (lote 22). */
@media (max-width:640px){
.b-respuestas .bx-portada>.bx-cx-hero:first-child{height:calc(100svh - 137px - var(--bx-lugares-alto,72px) - 8px - var(--ck-alto,0px) - min(var(--ck-alto,0px),12px));min-height:0;grid-template-rows:auto minmax(0,1fr);align-content:stretch}
.b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{min-height:0;align-self:stretch;grid-template-rows:minmax(0,max-content);align-content:start;align-items:stretch}
.b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-tel{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0}
.b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-msjs{overflow:hidden;align-content:end;-webkit-mask-image:linear-gradient(transparent,var(--pl-tinta) 20px);mask-image:linear-gradient(transparent,var(--pl-tinta) 20px)}
}
/* En pantallas bajas (O, lote 20): el titular cabe en 3 renglones también a 360 (un pelo más de interletra, sin tope de
   ancho), con su mismo tamaño, y la tarjeta «Mesa apartada» se ve completa. En celular, --pl-f4-5 vale 20 px: no se baja. */
@media (max-width:640px) and (max-height:700px){
body.en-buscar .b-respuestas .bx-portada .bx-cx-hero .b-asesor-titular{max-width:none;letter-spacing:-.05em}
}
/* Entrar y Crear cuenta (lote 14, juicio del director de arte). Una sola marca en «Primero elige tu herramienta»: el borde
   ámbar, sin el subrayado amarillo. La nota legal en un solo bloque de 12 px: sus ligas van en línea dentro de la frase,
   sin el alto de 44 px que abría un hueco entre renglones; el relleno de arriba y abajo les da 44 px para tocar sin mover
   los renglones (en un elemento en línea, el relleno no cambia el alto de la línea). */
.b-respuestas .bx-cuenta .bx-nace strong{background:none}
.b-respuestas .bx-cuenta > p.bx-nota{font-size:var(--pl-f1,12px);line-height:1.4}
.b-respuestas .bx-cuenta > p.bx-nota a{display:inline;min-height:0;padding:14px 0}
/* Desde 1024 px, dos columnas en la rejilla de /buscar: el titular y su texto a la izquierda (x = 40, paso 6) y lo demás
   a la derecha en una columna de 440 px, con Google y el formulario en una tarjeta. Igual en las dos vistas. */
@media (min-width:1024px){
  .b-respuestas .bx-cuenta{display:grid;grid-template-columns:minmax(0,1fr) 440px;column-gap:clamp(48px,6vw,96px);align-items:start;width:auto;max-width:none;margin:0}
  .b-respuestas .bx-cuenta > *{grid-column:2;min-width:0}
  .b-respuestas .bx-cuenta > .b-asesor-cab{grid-column:1;grid-row:1 / span 12}
  .b-respuestas .bx-cuenta > .b-asesor-cab .b-asesor-titular{font-size:var(--pl-f6,72px);max-width:none}
  .b-respuestas .bx-cuenta > .bx-entrar{padding:24px;border-radius:var(--pl-r-l);background:var(--pl-fondo-2)}
}
/* Un solo protagonista (lote 16; director de arte y Equipo N): desde 1024 px el cubo es el panel grande (todo el ancho menos
   322 px) y el teléfono sale de él: se encima 38 px sobre su borde derecho y empieza 40 px más arriba. La escena de N deja
   libre solo esa franja y su margen (data-libre-ancho="60") y se centra en el resto, sin hueco negro (O y N, camino «a»). A 1280×800 el héroe entra completo con 40 px entre la bajada y el teléfono y 24 px de margen abajo: la
   escena mide 341 px y el teléfono se aprieta en rellenos y separaciones (no en contenido) para caber completo con «Pagado».
   data-libre="derecha" (firmas.js de N) compone el cubo y su abanico en el 76 % izquierdo y deja libre la esquina del teléfono. */
@media (min-width:1024px){
  .b-respuestas .bx-portada .bx-cx-hero .bx-cx-escena.ap-chat{display:block;position:relative;width:min(1040px,100%);height:341px;min-height:0;padding:0}
  .b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-cubo{position:absolute;left:0;bottom:0;width:calc(100% - 322px);height:calc(100% - 40px);min-height:0}
  .b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-tel{position:absolute;right:0;top:0;z-index:1;width:360px;height:100%}
  .b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-tel-cab{padding-block:8px}
  .b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-msjs{padding:10px 18px;gap:8px}
  .b-respuestas .bx-portada .bx-cx-hero .ap-chat .ap-m{padding-block:8px}
}
@media (min-width:1200px){.b-respuestas .bx-portada>.bx-cx-hero:first-child{gap:40px}}
/* Las cuatro pantallitas de «Atiende. Vende. Cobra. Ordena.» alinean su contenido arriba con el mismo relleno: las cejas
   «Ejemplo · …» quedan a la misma altura (lote 17, director de arte). El halo de Ordena es un neutro de la casa (antes lila,
   un color que no salía en ningún otro lado). */
.ap-ordena .ap-pantallita{grid-template-rows:auto 1fr}
.ap-ordena .ap-barras{align-self:end}

/* Precios para el 10 (lote 27, juicio del director de arte). El glosario: cada tarjeta mide lo suyo (sin el hueco de su
   vecina), negrita sola para el término que se define y el resaltado ámbar solo en la cifra clave de cada tarjeta. */
.bx-vista[data-vista=precios] .bx-banda{align-items:start}
.bx-vista[data-vista=precios] .bx-banda .b-asesor-diag strong{background:none}
.bx-vista[data-vista=precios] .bx-banda .b-asesor-diag strong.bx-cifra{background:linear-gradient(transparent 60%,rgba(246,166,35,.5) 0)}
/* ── Héroe de la portada (Alex, 3-nov-2026: sin cubo). En celular el titular es más chico («está muy grande en el
   teléfono»). */
:root .bx-portada{--hx-escena:radial-gradient(60% 55% at 50% 40%,#17141F 0%,#0B0B10 55%,#060608 100%);--hx-noche:#060608;
 --hx-luces:radial-gradient(40% 30% at 22% 18%,rgb(255 80 160/.10),transparent 70%),radial-gradient(40% 30% at 80% 26%,rgb(40 180 255/.10),transparent 70%);
 --hx-sombra:0 40px 90px -50px rgb(12 10 24/.75);--hx-brillo:0 -1px 0 rgb(255 255 255/.85),0 -10px 36px rgb(255 236 214/.30),0 -50px 110px rgb(246 166 35/.22);
 --hx-claude:linear-gradient(135deg,#F7F1E6,#FBF8F2);--hx-claude-borde:rgb(201 120 15/.18);--hx-gris:#5E6372;--hx-cinta:38s;
 --pl-f-heroe:clamp(30px,8.2vw,40px);--pl-f-formas:clamp(26px,6.6vw,40px);--pl-f-heroe-pc:clamp(44px,5vw,68px)}
@media (max-width:899px){
  body.en-buscar .b-respuestas .bx-portada .bx-cx-hero .b-asesor-titular{font-size:var(--pl-f-heroe);line-height:1.02;letter-spacing:-.04em;max-width:15ch}
  body.en-buscar .b-respuestas .bx-portada .bx-cx-hero .b-asesor-social{font-size:var(--pl-f3);line-height:1.5;max-width:32ch}
}
@media (min-width:900px){body.en-buscar .b-respuestas .bx-portada .bx-cx-hero .b-asesor-titular{font-size:var(--pl-f-heroe-pc)}}
/* Cinta «Negocios que ya trabajan con Hostess» y la franja de tecnología (2-nov-2026) */
.hx-ceja{margin:0 0 18px;text-align:center;font-size:var(--pl-f1);font-weight:700;line-height:1.4;letter-spacing:.2em;text-transform:uppercase;color:var(--hx-gris)}
.hx-confian{margin:clamp(28px,5vw,56px) 0 0}
.hx-cinta{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,var(--pl-tinta) 12%,var(--pl-tinta) 88%,transparent);mask-image:linear-gradient(90deg,transparent,var(--pl-tinta) 12%,var(--pl-tinta) 88%,transparent)}
.hx-cinta-in{display:flex;width:max-content}
.hx-corre .hx-cinta-in{animation:hx-cinta var(--hx-cinta) linear infinite}
.hx-cinta:hover .hx-cinta-in{animation-play-state:paused}
.hx-cinta ul{display:flex;align-items:center;gap:clamp(36px,6vw,72px);margin:0;padding:0 clamp(36px,6vw,72px) 0 0;list-style:none}
.hx-cinta li{flex:none;display:flex;align-items:center;height:52px}
.hx-cinta img{height:var(--alto,28px);width:auto;max-width:none;filter:grayscale(1) contrast(1.1);opacity:.62;transition:opacity var(--pl-t2),filter var(--pl-t2)}
.hx-cinta li:hover img{filter:none;opacity:1}
@keyframes hx-cinta{to{transform:translateX(-50%)}}
.hx-tec{margin:clamp(40px,7vw,88px) auto 0;max-width:1040px}
.hx-tec-claude{display:flex;gap:18px;align-items:center;padding:clamp(20px,3vw,32px);border-radius:var(--pl-r-l);background:var(--hx-claude);border:1px solid var(--hx-claude-borde)}
.hx-tec-a{flex:none;width:64px;height:64px;border-radius:var(--pl-r-m);background:var(--pl-blanco);display:grid;place-items:center;box-shadow:var(--pl-sombra)}
.hx-tec-a svg{width:38px;height:auto}
.hx-tec-t{margin:0 0 6px;font-size:var(--pl-f4);line-height:1.15;letter-spacing:-.025em}
.hx-tec-claude p{margin:0;color:var(--pl-tenue);font-size:var(--pl-f3);line-height:1.55}
.hx-tec-logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:12px 0 0;padding:0;list-style:none}
.hx-tec-logos li{display:flex;align-items:center;justify-content:center;gap:10px;min-height:64px;padding:0 14px;border-radius:var(--pl-r-m);background:var(--pl-blanco);border:1px solid var(--pl-linea-suave);font-weight:600;font-size:var(--pl-f2);color:var(--pl-tinta)}
.hx-tec-logos svg{height:22px;width:auto;max-width:84px;flex:none}
.hx-tec-logos svg.bx-marca-ancha{height:18px}
.hx-tec-nota{margin:10px 0 0;font-size:var(--pl-f1);color:var(--pl-tenue);text-align:center}
@media (max-width:599px){.hx-tec-claude{flex-direction:column;align-items:flex-start}.hx-tec-logos{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.hx-corre .hx-cinta-in{animation:none}}
/* «Dos formas de trabajar contigo» (2-nov-2026, estructura de astreatechnologies.com) */
.hx-formas{margin:clamp(48px,8vw,104px) auto 0;max-width:1040px}
.hx-formas-t{margin:0 0 clamp(20px,3vw,32px);font-size:var(--pl-f-formas);line-height:1.04;letter-spacing:-.04em;text-wrap:balance}
.hx-formas-t span{color:var(--pl-tenue)}
.hx-formas-rejilla{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.hx-forma{display:grid;align-content:start;gap:10px;padding:clamp(22px,3vw,34px);border-radius:var(--pl-r-l);background:var(--pl-fondo-2)}
.hx-forma-hecho{background:var(--pl-noche);color:var(--pl-claro)}
.hx-forma-hecho p{color:var(--pl-claro-tenue)}
.hx-forma-eti{font-size:var(--pl-f1);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--pl-ambar-texto)}
.hx-forma-hecho .hx-forma-eti{color:var(--pl-ambar)}
.hx-forma h3{margin:0;font-size:var(--pl-f4);line-height:1.2;letter-spacing:-.02em}
.hx-forma p{margin:0 0 6px;font-size:var(--pl-f3);line-height:1.55;color:var(--pl-tenue)}
.hx-forma .b-asesor-btn{justify-self:start}
@media (min-width:760px){.hx-formas-rejilla{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* «Atiende. Vende. Cobra. Ordena.» en celular: carrusel que se desliza con el dedo, no cuatro tarjetas apiladas. */
@media (max-width:699px){
  .b-respuestas .bx-portada .ap-bento{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:80%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:2px;padding:2px 2px 10px;scrollbar-width:none}
  .b-respuestas .bx-portada .ap-bento::-webkit-scrollbar{display:none}
  .b-respuestas .bx-portada .ap-bento .ap-trabajo{scroll-snap-align:start}
  body.en-buscar .b-respuestas .bx-portada .ap-bento .ap-trabajo>b{font-size:var(--pl-f4)!important}
  .b-respuestas .bx-portada .ap-bento .ap-pantallita{min-height:150px}
}
/* Ronda 3 (2-nov-2026): en celular la parte de abajo deja de ser una pila larga. Los planes y las herramientas se
   deslizan con el dedo (como las tarjetas de Apple y Stripe) y las cifras van en dos columnas compactas. */
@media (max-width:699px){
  .b-respuestas .bx-portada .bx-planes,.b-respuestas .bx-portada .bx-seccion .bx-rejilla{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:86%;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:4px 2px 12px;scrollbar-width:none}
  .b-respuestas .bx-portada .bx-planes::-webkit-scrollbar,.b-respuestas .bx-portada .bx-seccion .bx-rejilla::-webkit-scrollbar{display:none}
  .b-respuestas .bx-portada .bx-planes>*,.b-respuestas .bx-portada .bx-seccion .bx-rejilla>*{scroll-snap-align:start;min-width:0}
  .b-respuestas .ap-cifras ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}
  .b-respuestas .ap-cifras b{font-size:var(--pl-f5)}
  .b-respuestas .ap-cifras span{font-size:var(--pl-f2)}
}
/* Preguntas frecuentes (2-nov-2026): acordeón nativo (<details>), sin JavaScript. */
.hx-faq{max-width:820px;margin:var(--pl-aire) auto 0}
.hx-faq-t{margin:0 0 clamp(18px,3vw,28px);text-align:center;font-size:var(--pl-f-formas);line-height:1.05;letter-spacing:-.04em}
.hx-faq-lista{border-top:1px solid var(--pl-linea)}
.hx-faq-p{border-bottom:1px solid var(--pl-linea)}
.hx-faq-p summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:14px 4px;cursor:pointer;list-style:none;font-weight:700;font-size:var(--pl-f3);line-height:1.35}
.hx-faq-p summary::-webkit-details-marker{display:none}
.hx-faq-p summary::after{content:"+";flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:var(--pl-r-pill);background:var(--pl-fondo-2);font-size:var(--pl-f4);font-weight:500;transition:transform var(--pl-t2) var(--pl-curva)}
.hx-faq-p[open] summary::after{transform:rotate(45deg)}
.hx-faq-p p{margin:0;padding:0 4px 18px;max-width:62ch;color:var(--pl-tenue);font-size:var(--pl-f3);line-height:1.6}
.hx-faq-mas{display:flex;justify-content:center;margin:clamp(20px,3vw,28px) 0 0}
/* La caja grande del buscador en el héroe (2-nov-2026: «el buscador en grande»). */
@media (max-width:899px){.b-respuestas .bx-portada>.bx-cx-hero:first-child{grid-template-rows:auto auto minmax(0,1fr)}}
/* En celular el héroe ya no tiene alto fijo (era para el chat de antes): con el cubo en video, los chips «Prueba con»
   se encimaban sobre él. Cada pieza toma su alto y el cubo queda entero. */
@media (max-width:899px){
  body.en-buscar .b-respuestas .bx-portada>.bx-cx-hero:first-child{height:auto;min-height:0;grid-template-rows:none}
}
/* Con JS: 5 pantallas de recorrido y un escenario que se queda fijo. */

/* Revelado al llegar: solo tras el primer gesto (html.hx-corre) y sin «reducir movimiento». */
:root .bx-portada{--hx-t-revela:900ms;--hx-t-revela-paso:80ms}
html.hx-corre .hx-revela{transition:opacity var(--hx-t-revela) var(--pl-curva),transform var(--hx-t-revela) var(--pl-curva),filter var(--hx-t-revela) var(--pl-curva)}
html.hx-corre .hx-revela:not(.hx-visto){opacity:0;transform:translateY(56px);filter:blur(6px)}
html.hx-corre .hx-revela :is(h2,.hx-ceja,.eyebrow){transition:opacity var(--hx-t-revela) var(--pl-curva),transform var(--hx-t-revela) var(--pl-curva);transition-delay:var(--hx-t-revela-paso)}
html.hx-corre .hx-revela:not(.hx-visto) :is(h2,.hx-ceja,.eyebrow){opacity:0;transform:translateY(24px)}
html.hx-corre .hx-revela :is(article,li,details){transition:opacity var(--hx-t-revela) var(--pl-curva),transform var(--hx-t-revela) var(--pl-curva)}
html.hx-corre .hx-revela:not(.hx-visto) :is(article,li,details){opacity:0;transform:translateY(32px)}
html.hx-corre .hx-revela :is(article,li,details):nth-child(2){transition-delay:calc(var(--hx-t-revela-paso) * 2)}
html.hx-corre .hx-revela :is(article,li,details):nth-child(3){transition-delay:calc(var(--hx-t-revela-paso) * 3)}
html.hx-corre .hx-revela :is(article,li,details):nth-child(4){transition-delay:calc(var(--hx-t-revela-paso) * 4)}
html.hx-corre .hx-revela :is(article,li,details):nth-child(n+5){transition-delay:calc(var(--hx-t-revela-paso) * 5)}
@media (prefers-reduced-motion:reduce){html.hx-corre .hx-revela,html.hx-corre .hx-revela *{transition:none!important}html.hx-corre .hx-revela:not(.hx-visto),html.hx-corre .hx-revela:not(.hx-visto) *{opacity:1!important;transform:none!important;filter:none!important}}

/* Qué es Hostess: tres pilares (Alex, 3-nov-2026) en un panel oscuro, la primera sección después del héroe. */
:root .bx-portada{--hx-pilar-borde:rgb(255 255 255/.08);--hx-pilar-fondo:rgb(255 255 255/.04);--hx-pilar-luz:radial-gradient(120% 80% at 50% 0%,rgb(246 166 35/.16),transparent 60%)}
.hx-pilares{margin:clamp(40px,7vw,96px) auto 0;max-width:1180px;padding:clamp(28px,5vw,64px) clamp(18px,4vw,56px);border-radius:var(--pl-r-l);background:var(--hx-pilar-luz),var(--pl-noche);color:var(--pl-claro)}
.hx-pilares .hx-ceja{color:var(--pl-ambar)}
.hx-pilares-t{margin:6px 0 clamp(22px,3.4vw,40px);max-width:18ch;font-size:var(--pl-f-formas);line-height:1.04;letter-spacing:-.04em;text-wrap:balance}
.hx-pilares-rejilla{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.hx-pilar{display:grid;align-content:start;gap:10px;padding:clamp(22px,2.6vw,32px);border:1px solid var(--hx-pilar-borde);border-radius:var(--pl-r-m);background:var(--hx-pilar-fondo)}
.hx-pilar-n{font-family:var(--pl-letra-grito);font-size:var(--pl-f5);font-weight:800;line-height:1;background:var(--pl-degradado);-webkit-background-clip:text;background-clip:text;color:transparent}
.hx-pilar h3{margin:0;font-size:var(--pl-f4);line-height:1.2;letter-spacing:-.02em}
.hx-pilar p{margin:0;font-size:var(--pl-f3);line-height:1.55;color:var(--pl-claro-tenue)}
.hx-pilar-ir{display:inline-flex;align-items:center;gap:6px;min-height:44px;justify-self:start;color:var(--pl-ambar);font-weight:700;text-decoration:none}
.hx-pilar-ir svg{width:18px;height:18px}
@media (min-width:860px){.hx-pilares-rejilla{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Computadora (Alex, 3-nov-2026: «lo estás haciendo como si todos usaran teléfono»): cada sección centrada en la
   página y su ceja alineada con su título; la cinta de logos, centrada. */
body.en-buscar .b-respuestas .bx-portada>:is(.hx-pilares,.hx-tec,.hx-formas,.hx-faq){justify-self:center;width:100%}
body.en-buscar .b-respuestas .bx-portada :is(.hx-pilares,.hx-tec,.hx-formas,.hx-faq)>.hx-ceja{text-align:left}
body.en-buscar .b-respuestas .bx-portada .hx-confian>.hx-ceja{text-align:center}
/* Crear cuenta: lo que trae tu cuenta, en un panel oscuro (Alex, 3-nov-2026: sin pedazos blancos). */
.bx-cuenta-trae{display:grid;gap:10px;margin:22px 0 0;padding:clamp(18px,2.4vw,28px);list-style:none;border-radius:var(--pl-r-l);background:var(--hx-pilar-luz),var(--pl-noche);color:var(--pl-claro)}
.bx-cuenta-trae li{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--hx-pilar-borde)}
.bx-cuenta-trae li:first-child{border-top:0;padding-top:0}
.bx-cuenta-trae b{flex:none;font-family:var(--pl-letra-grito);font-size:var(--pl-f4);font-weight:800;line-height:1;background:var(--pl-degradado);-webkit-background-clip:text;background-clip:text;color:transparent}
.bx-cuenta-trae span{display:grid;gap:2px;font-size:var(--pl-f2);line-height:1.5;color:var(--pl-claro-tenue)}
.bx-cuenta-trae strong{font-size:var(--pl-f3);color:var(--pl-claro)}
:root .bx-cuenta{--hx-pilar-borde:rgb(255 255 255/.08);--hx-pilar-luz:radial-gradient(120% 80% at 50% 0%,rgb(246 166 35/.16),transparent 60%)}
/* Piezas de Higgsfield (Alex, 3-nov-2026: «toda la página es totalmente blanca… con imagen, con estilo»): el héroe en
   grafito con la cinta de luz ámbar de fondo, los pilares con su pieza de vidrio y las primeras herramientas con la suya. */
:root .bx-portada{--hx-grafito:#121318;--hx-fondo-heroe:url(/buscar/_/portada/fondo-cel.webp);--hx-velo-heroe:linear-gradient(180deg,rgb(18 19 24/.15) 0%,rgb(18 19 24/.55) 55%,rgb(18 19 24/.85) 100%)}
:root .bx-rejilla{--hx-grafito:#121318}
body.en-buscar .b-respuestas .bx-portada>.bx-cx-hero:first-child{box-sizing:border-box;width:100%;margin-inline:auto;padding:clamp(40px,9vw,96px) clamp(18px,4vw,64px) clamp(36px,6vw,72px);border-radius:var(--pl-r-l);background:var(--hx-velo-heroe),var(--hx-fondo-heroe) center/cover no-repeat,var(--hx-grafito);color:var(--pl-claro)}
body.en-buscar .b-respuestas .bx-portada>.bx-cx-hero:first-child .eyebrow{color:var(--pl-ambar)}
body.en-buscar .b-respuestas .bx-portada>.bx-cx-hero:first-child .b-asesor-titular{color:var(--pl-claro)}
body.en-buscar .b-respuestas .bx-portada>.bx-cx-hero:first-child .b-asesor-social{color:var(--pl-claro-tenue)}
@media (min-width:900px){:root .bx-portada{--hx-fondo-heroe:url(/buscar/_/portada/fondo.webp);--hx-velo-heroe:radial-gradient(70% 70% at 50% 45%,rgb(18 19 24/.72) 0%,rgb(18 19 24/.25) 70%,transparent 100%)}}
.hx-pilar-arte{display:block;width:calc(100% + 2 * clamp(22px,2.6vw,32px));max-width:none;height:auto;aspect-ratio:4/3;object-fit:cover;margin:calc(-1 * clamp(22px,2.6vw,32px)) calc(-1 * clamp(22px,2.6vw,32px)) 4px}
.hx-pilar{overflow:hidden}
.bx-ficha-media.bx-con-arte{background:var(--hx-grafito)}
.bx-ficha-media.bx-con-arte .bx-arte-hf{object-fit:cover;object-position:center}