@@ -205,9 +181,13 @@ function Escenificado() {
resolves against Container's padding box, so `left-0` lands on
the inside of the border and ignores the px-6 the rest of the
page is aligned to. On a phone that clipped the first glyph. */}
-
+ {/* The section's only heading now. Losing the header block cost
+ the recorrido its
, and a section this size with no heading
+ at all is a hole in the document outline — for a screen reader
+ the six exchanges would hang off nothing. */}
+
{puntosInflexion.lead}
-
+
{/* The rail. Where you are in the conversation, and how much is
left — a pinned section without it feels like a page that
diff --git a/components/sections/__tests__/PuntosInflexion.test.tsx b/components/sections/__tests__/PuntosInflexion.test.tsx
index e3c5f82..ab3db74 100644
--- a/components/sections/__tests__/PuntosInflexion.test.tsx
+++ b/components/sections/__tests__/PuntosInflexion.test.tsx
@@ -4,9 +4,14 @@ import { PuntosInflexion } from '../PuntosInflexion';
import { puntosInflexion } from '@/lib/content';
describe('', () => {
- it('renders the section title', () => {
+ it('still has a heading after losing its header block', () => {
render();
- expect(screen.getByText(/llegan a un punto de inflexión/i)).toBeInTheDocument();
+ // The eyebrow and the deck's title used to sit in a light strip above the
+ // pinned stage; with them gone the lead carries the heading level. A
+ // section this long with no heading at all is a hole in the outline —
+ // for a screen reader the six exchanges would hang off nothing.
+ const encabezado = screen.getByRole('heading', { name: /te reconoces/i });
+ expect(encabezado.tagName).toBe('H2');
});
it('labels both halves of every exchange with its inflection point', () => {