/* ============================================================================ v5 — pulido de teléfono y arreglo del titular POR QUÉ ESTA HOJA EXISTE Y NO SE EDITA EL BLOQUE Todo el CSS visual de v5 vive EN LÍNEA dentro del bloque (v5.html:63-476). Una sincronización desde Claude Design regenera ese bloque y borra lo que se le haya editado — es la regla 1 de la casa. Por eso el pulido vive aquí fuera y por eso casi todo lleva !important: no es descuido, es la única forma de ganarle a un estilo en línea sin escribir dentro de la zona que se borra sola. El a esta hoja va en el , que termina en la línea 62: fuera del bloque, así que sobrevive. REGLAS QUE ESTA HOJA RESPETA A PROPÓSITO · Cero literales de color, salvo UNO documentado abajo. setTheme() reescribe las cinco fichas sobre en cada cambio de tema y el agente puede mover --accent en vivo: un color cocido aquí se desincroniza solo. · Ningún @keyframes se redefine POR SU NOMBRE. `weave` y sus ocho hermanos los inyecta support.js en tiempo de ejecución, posiblemente DESPUÉS de esta hoja, y la última definición que carga gana. Por eso el arreglo del titular declara un nombre NUEVO (nerv-weave) y sólo reapunta la propiedad. · Nada de transform, filter, contain ni opacity<1 sobre #dc-root ni sus envoltorios: crearían un contexto de apilamiento nuevo y romperían la escalera de z-index del lienzo y el velo. · Nada de opacity/transform con !important sobre [data-float] y [data-reveal] FUERA del bloque de movimiento reducido: el bucle de scroll les escribe transform y opacity en cada cuadro y se pelearían para siempre. · Nada de max-width global: las medidas de línea son tapas en `ch` a propósito (20ch en el h1, 46ch en el párrafo del hero, 66ch en el FAQ). Punto de quiebre: 600px para lo que es teléfono de verdad, 900px para las rejillas que sólo necesitan más aire. ========================================================================= */ /* ── 1 · EL TITULAR: LA TINTA CORTADA ──────────────────────────────────────── El bug que se veía en escritorio: las colas de g, p, q y j cortadas, y más evidente en la palabra que rota porque casi todas las traen (portafolios, paneles, catálogos, agentes, landings). NO ES EL INTERLINEADO. La causa es que @keyframes weave TERMINA en clip-path:inset(0 0 0 0) y los dos lo aplican con fill-mode `both`: el recorte se queda PERMANENTE pegado a la caja de borde. Y con line-height:.9 esa caja es más corta que lo que la fuente necesita, así que la cola sobra por abajo y el clip se la come. Medido en vivo a 1440: clip-path computa `inset(0px 0% 0px 0px)` y hay 11px de tinta afuera. Se descartó subir el line-height, que fue la primera hipótesis: barrido a 1440, hace falta 1.15 para dejar de cortar, y eso engorda el titular de 197 a 252px — aplana justo el apretado que ES la dirección de arte. El line-height no se toca. La cura es abrir el recorte HACIA ABAJO. -.34em cubre el peor descendente de las cuatro fuentes de la pila con holgura, y como el inset sólo crece hacia afuera no mueve ni un píxel del texto: el h1 sigue midiendo lo mismo. Va SIN media query porque el recorte es el mismo en las dos pantallas. */ @keyframes nerv-weave { from { clip-path: inset(0 100% -.34em 0); filter: blur(7px); opacity: .25 } to { clip-path: inset(0 0 -.34em 0); filter: blur(0); opacity: 1 } } #inicio h1 > span[style*="weave"] { animation-name: nerv-weave !important } /* Efecto secundario que hay que atender EN EL MISMO CAMBIO: el componente le pone a la palabra que rota un border-bottom azul que caía por debajo del recorte, así que nadie lo había visto nunca. Al abrir el clip aparecería cruzando las descendentes. Primero se cambió por un subrayado de texto; el 2026-09-01 Daniel pidió que no hubiera subrayado ninguno: la palabra va limpia, en el color de acento, y el cursor que parpadea ya la señala. */ #inicio h1 span[style*="border-bottom"] { border-bottom: 0 !important; padding-bottom: 0 !important; text-decoration: none !important; } /* ── 2 · EL CARRIL DE 44px ─────────────────────────────────────────────────── En escritorio el