feat: rediseño «El documento» en curso, contacto real y enlaces externos

Primitivas y contenido del rediseño (escala tipográfica, Revelar,
MarcaSeccion, Seccion, Antetitulo, SimboloMarca, Resplandor, ClaridadHero,
sección Proceso de ocho etapas, lib/content.ts reestructurado en seis
secciones con alias para las viejas). Mecanismo y FormaTrabajar se retiran.

Encima, lo de esta sesión:
- recorrido: creeer vuelve a responder cada situación en vez de repetirla
  (el alias apuntaba respuesta a situacion); respuestas en plural. Créditos
  de las seis fotos de México.
- contacto: WhatsApp, email (con mailto:) y LinkedIn reales; iconos de las
  redes en el cierre y el footer (IconoRed, trazos de Simple Icons, CC0).
- enlaces: lo externo abre en otra pestaña con noopener y aviso para
  lectores de pantalla (lib/enlaces.ts); mailto y anclas se quedan.
- Proceso: las ocho tarjetas no aparecían nunca en móvil (amount 0.3 sobre
  una lista de ~3000px); ahora cada una se revela sola. El ≡ de la 08 ya no
  tapa un entregable, título equilibrado, etiqueta a 12px, sin elevar al
  hover lo que no es clicable.
- Disciplinas: la frase «No son la promesa — son los medios» gana peso y
  se agrupa con título e ilustración; sin cortes huérfanos en móvil.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

components/primitives/Revelar.tsx

@@ -0,0 +1,59 @@
+'use client';
+
+import { useEffect, useRef, type CSSProperties, type ReactNode } from 'react';
+
+// The page's only motion, and it is built the opposite way round from the
+// system it replaces.
+//
+// The hidden state lives in CSS and applies only under `html.js`, a class an
+// inline script in <head> adds before first paint. Nothing here writes
+// `opacity: 0` into the markup, so the static export ships a page that reads in
+// full — the previous architecture shipped 112 elements at opacity zero and
+// went blank whenever the JavaScript failed to arrive.
+//
+// One module-level observer for the whole page rather than one per block.
+
+let observador: IntersectionObserver | null = null;
+
+function observadorCompartido() {
+  if (observador) return observador;
+  observador = new IntersectionObserver(
+    (entradas) => {
+      for (const entrada of entradas) {
+        if (!entrada.isIntersecting) continue;
+        entrada.target.setAttribute('data-visible', '');
+        observador?.unobserve(entrada.target);
+      }
+    },
+    // Fires a touch before the block is fully in, so the gesture has finished
+    // by the time the reader's eye lands on it.
+    { rootMargin: '0px 0px -10% 0px' },
+  );
+  return observador;
+}
+
+export function Revelar({
+  children,
+  indice = 0,
+  className = '',
+}: {
+  children: ReactNode;
+  indice?: number;
+  className?: string;
+}) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const el = ref.current;
+    if (!el || typeof IntersectionObserver === 'undefined') return;
+    const obs = observadorCompartido();
+    obs.observe(el);
+    return () => obs.unobserve(el);
+  }, []);
+
+  return (
+    <div ref={ref} data-revelar className={className} style={{ '--i': indice } as CSSProperties}>
+      {children}
+    </div>
+  );
+}