/* PUBLICACIÓN EN kwiq.io (6-oct-2026) — ajustes de publicación sobre el prototipo aprobado, medidos con Playwright.
 *
 * 1. Encabezado entre 960 y 1119 px: los seis enlaces + «Mi cuenta» + «Calcula tu plan» miden 1087 px, así que a
 *    1024 la página se iba de lado 63 px. En ese tramo se usa el menú (como en tableta) en lugar de desbordar.
 * 2. «Ver qué cambia por especialidad» es la herramienta de revisión del prototipo (pinta contornos punteados con
 *    el nombre de cada variable). No es para el visitante, y además estaba fija en la misma esquina que el botón
 *    de WhatsApp, encimados.
 *
 * Lo que vive dentro de un shadow DOM no lo alcanza esta hoja, así que esos arreglos van en su archivo, marcados:
 *   - kwiq-v2/v2.css (al final): la tarjeta del hero medía 97 px en celular.
 *   - kwiq-sitio/planes.js (busca «.rs2>.rs2__kb»): en celular el resultado del cotizador se iba de lado — el bloque
 *     «Todo esto, conectado…» en una sola fila de 725 px, «Se pagan aparte» sin poder partir renglón, los cuatro
 *     niveles en dos columnas de 114 px y el botón «Comenzar con este plan →» más ancho que su caja.
 * Y dos de recursos: kwiq-v2/views.js pedía foto-02/03/04 en .png (las fotos se publicaron optimizadas en .jpg), y
 * kwiq-sitio/image-slot.js ya no pide .image-slots.state.json fuera de la herramienta de diseño (era un 500 en consola).
 */
@media (min-width: 960px) and (max-width: 1119.98px) {
  .hd__nav { display: none !important; }
  .hd__menu { display: grid !important; }
  .mnav.is-open { display: flex !important; }
}
.vtoggle { display: none !important; }

/* 3. El testimonio en video ocupa la portada al reproducirse (publicacion.js). En el shadow DOM ya lo hace v2.css. */
figure.reel { position: relative; }
figure.reel video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; z-index: 2; background: #011515; }

/* Prueba en vivo (6-oct-2026, Juan: «le faltan muchos casos como handovers»): casos de un toque dentro del chat,
   el handover visible en tono cálido —distinto de la IA (verde) y de «Prueba» (rosa)— y el panel del equipo como
   línea de tiempo. */
.dxc__sug{align-items:center}
.dxc__sugt{width:100%;font:600 12px var(--font-body,Inter,sans-serif);letter-spacing:.06em;text-transform:uppercase;color:#3d5a55}
.dxc__sug button{display:inline-flex;align-items:center;gap:6px}
.dxc__sug button .ico{display:none;width:16px;height:16px}
.dxc__sug button.is-done{background:#e3f6ef;border-color:#09a27e;color:#064f40}
.dxc__sug button.is-done .ico{display:inline-block}
@media(max-width:700px){.dxc__sug{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}.dxc__sug::-webkit-scrollbar{display:none}.dxc__sug button{flex:0 0 auto}.dxc__sugt{display:none}}
.dxsys{align-self:center;display:flex;align-items:center;gap:8px;max-width:92%;margin:4px 0;padding:8px 14px;border-radius:999px;background:#fff1d6;border:1px solid #f0c36d;color:#5c3a00;font-size:13px;line-height:1.35}
.dxsys .ico{width:16px;height:16px;flex:0 0 auto}
.dxp__pr{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:10px;border-bottom:1px solid #e1eee9}
.dxp__pr span{font-size:13px;color:#3d5a55}
.dxp__pr b{font-size:18px;color:#011515}
.dxp__tl{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.dxp__e{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:start}
.dxp__e b{display:block;font-size:14px;color:#011515}
.dxp__e p{margin:2px 0 0;font-size:13px;color:#3d5a55;line-height:1.4}
.dxp__e small{font-size:12px;color:#3d5a55}
.dxp__i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#e3f6ef;color:#064f40}
.dxp__i .ico{width:16px;height:16px}
.dxp__e--equipo .dxp__i{background:#fff1d6;color:#5c3a00}
.dxp__e--no .dxp__i{background:#eef2f1;color:#3d5a55}
.dxp__vacio{margin:0;font-size:14px;color:#3d5a55;line-height:1.5}
.dxp__tl + .dxp__f{margin-top:8px;padding-top:10px;border-top:1px solid #e1eee9}

/* Prueba en vivo · «Platícame de tu negocio» (retro de Porfirio, 6-oct-2026).
   Un solo formulario (sin «Probar un ejemplo / Usar mis datos»), estado y horario visibles ANTES del precio, la comparación
   del precio contra su región debajo del precio, cuatro acciones al terminar con una sola principal, y accesibilidad:
   «para una persona mayor no lo va a poder leer bien. Todos los contrastes claros» → todo texto ≥14 px, AA o más
   (texto oscuro #0c2a2a / #3d5a55 sobre blanco = 14.8:1 / 7.4:1), etiqueta visible y foco visible en cada campo. */
.dx .dxf{gap:8px}
.dx .dxf__head{display:grid;gap:4px;margin-bottom:6px}
.dx .dxf__h{margin:0;font:700 24px/1.2 var(--font-display,Sora,sans-serif);color:#011515}
.dx .dxf__sub{margin:0;font-size:15px;line-height:1.5;color:#3d5a55}
.dx .dxf__fs{border:0;margin:0 0 6px;padding:0;min-width:0}
.dx .dxf__lg{padding:0;margin:0 0 6px;font-size:15px;font-weight:600;color:#0c2a2a}
.dx .dxf__tipo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.dx .dxf__tipo button{min-height:52px;padding:6px 8px;border-radius:12px;border:2px solid #9cc5b9;background:#fff;color:#0c2a2a;font:600 15px/1.2 var(--font-body,Inter,sans-serif);cursor:pointer}
.dx .dxf__tipo button:hover{background:#eef7f3}
.dx .dxf__tipo button[aria-checked=true]{background:#011515;border-color:#011515;color:#fff}
.dx .dxf__l{display:block;margin-top:8px;font-size:15px;font-weight:600;color:#0c2a2a}
.dx .dxf__l span{display:block}
.dx .dxf__in{display:block;box-sizing:border-box;width:100%;min-height:48px;margin-top:6px;border:1px solid #6f9990;border-radius:12px;padding:10px 12px;font:400 16px var(--font-body,Inter,sans-serif);color:#0c2a2a;background:#fff}
.dx textarea.dxf__in{min-height:110px;line-height:1.45}
.dx select.dxf__in{cursor:pointer}
.dx .dxf__in::placeholder,.dx .dxn__f input::placeholder{color:#55706b;opacity:1}
.dx .dxf__in:focus-visible,.dx .dxn__f input:focus-visible,.dx .dxf__tipo button:focus-visible,.dx .dxf__more2 summary:focus-visible,.dx .dxn__ses:focus-visible,.dx a:focus-visible,.dx .dxc__in input:focus-visible,.dx .chk input:focus-visible,.dx .bk button:focus-visible{outline:3px solid #0a7f63;outline-offset:2px}
.dx .dxf__in:focus-visible{border-color:#0a7f63}
.dx .dxf__row2{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.dx .dxf__pr2{display:flex;align-items:center;gap:8px}
.dx .dxf__pr2 span{margin-top:6px;font-size:20px;font-weight:700;color:#0c2a2a}
.dx .dxf__pr2 .dxf__in{max-width:220px}
.dx .dxf__more2{margin-top:10px;border:1px solid #cfe2dc;border-radius:12px;padding:0 14px}
.dx .dxf__more2[open]{padding-bottom:14px}
.dx .dxf__more2 summary{cursor:pointer;min-height:48px;display:flex;align-items:center;gap:6px;font-weight:600;font-size:15px;color:#0c2a2a}
.dx .dxf__more2 summary span{font-weight:400;color:#3d5a55}
.dx .dxf__more2 .dxf__l{font-weight:400;color:#3d5a55;font-size:14px}
.dx .dxf__go{margin-top:10px;width:100%;min-height:52px;font-size:16px}
.dx .dxf__what2{margin:4px 0 0;font-size:14px;line-height:1.5;color:#3d5a55}
.dx .dm__err{margin:8px 0 0;padding:10px 14px;border-radius:12px;background:#fde6ef;border:1px solid #c8648f;color:#3a0f24;font-size:15px}
@media(max-width:560px){.dx .dxf__row2{grid-template-columns:1fr;gap:0}.dx .dxf__tipo button{font-size:14px;padding:6px 4px}.dx .dxf__pr2 .dxf__in{max-width:none}}

/* Comparación de precio contra su región (datos de planes.js · Doctoralia). */
.dxr{display:grid;gap:6px;margin-top:10px;padding:14px;border-radius:12px;background:#f4faf7;border:1px solid #cfe2dc}
.dxr[hidden]{display:none}
.dxr__v{justify-self:start;display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;font:700 14px var(--font-body,Inter,sans-serif)}
.dxr__v--ok{background:#d8f5ec;color:#064f40}
.dxr__v--lo{background:#e3ecfb;color:#163a72}
.dxr__v--hi{background:#fff1d6;color:#5c3a00}
.dxr__t{margin:0;font-size:16px;font-weight:600;line-height:1.35;color:#011515}
.dxr__l{margin:0;font-size:15px;color:#3d5a55}
.dxr__l b{color:#011515}
.dxr__bar{position:relative;height:12px;margin:14px 8px 4px;border-radius:999px;background:#dbe8e3;border:1px solid #6f9990}
.dxr__band{position:absolute;top:-1px;bottom:-1px;background:#2e8a74;border-radius:999px}
.dxr__med{position:absolute;top:-5px;bottom:-5px;width:3px;margin-left:-1.5px;background:#011515;border-radius:2px}
.dxr__you{position:absolute;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:#011515;border:3px solid #fff;box-shadow:0 0 0 2px #011515}
.dxr__sc{display:flex;justify-content:space-between;gap:8px;font-size:14px;color:#3d5a55}
.dxr__f{margin:4px 0 0;font-size:14px;line-height:1.45;color:#3d5a55}

/* «¿Te sirvió?»: una acción principal (la recomendación en #/tu-plan) y tres secundarias. */
.dx .dxn{gap:12px}
.dx .dxn__t{font:700 18px var(--font-display,Sora,sans-serif);color:#011515}
.dx .dxn p{font-size:15px;line-height:1.5;color:#0c2a2a}
.dx .dxn__main{min-height:56px;padding:10px 20px;white-space:normal;text-align:center;line-height:1.3;font-size:16px;background:#011515;color:#fff!important}
.dx .dxn__main:hover{background:#064f40}
.dx .dxn__sec{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dx .dxn__sec .dxb{min-height:48px;padding:6px 12px;white-space:normal;text-align:center;line-height:1.25;font-size:15px}
.dx .dxn__ses{font-size:15px;color:#064f40}
@media(max-width:380px){.dx .dxn__sec{grid-template-columns:1fr}}

/* Texto de contenido a 14 px o más (antes había 12 y 13 px) y contraste AA en todo lo de la demo. */
.dx .dxc__n,.dx .dxc__h small,.dx .dxp__f,.dx .dxp__pr span,.dx .dxp__e p,.dx .dxp__e small,.dx .dxsys,.dx .dxe,.dx .dxe small,.dx .dxf__what,.dx .chk,.dx .dxn__f .chk{font-size:14px}
.dx .dxm small,.dx .dxm em{font-size:14px}
.dx .dxt{font-size:14px;min-height:28px}
.dx .dxv__k,.dx .dxc__sugt{font-size:14px;letter-spacing:.04em}
.dx .dxm--out small{color:#011515}
.dx .dxv__k{color:#064f40}
.dx .t-small,.dx .bk__inc li,.dx .fld>span,.dx .chk span{color:#0c2a2a}
.dx .t-small{font-size:15px}
.dxh .eyebrow{font-size:14px}
.dx .tbd{font-size:14px}