Port de la plantilla licenciada a Cloudflare. Los valores no son a ojo: salen de leer los estilos computados del sitio en vivo.
El negro medido es #0A0A0A, no #000. Tres grises de
superficie: nieve, hueso y línea.
La escalera medida: 7 · 11 · 12 · 14 · 18 · 50. El 18 es el de
tarjetas y marcos; el 50 es la píldora.
Peso 600 y tracking -0.06em en todo lo grande; -0.04em de
30px para abajo. Interlínea 1.0 en display y 0.92 en h2.
Grande de 58px con padding 0/30; chico de 30px con 0/12.
La etiqueta rueda al pasar el cursor: dos copias apiladas, una entra cuando la otra sale.
Por eso el marcado trae el texto dos veces.
El subrayado entra por la izquierda y sale por la derecha. Nunca subrayado fijo.
El dato entre paréntesis acompaña cada cabecera de sección, en gris y a peso 600. Nunca compite con el título.
Tres zonas: cuenta a la izquierda, título centrado con punto final, nota a la derecha a 32 caracteres.
Lo que frena a la gente no es si va a estar bueno.
Al pasar el cursor la fila se enciende y se recorre 12px a la derecha.
Píldoras fantasma con borde de línea; al hover se rellenan de nieve.
Tarjeta de nieve a radio 18, y el bloque invertido, único momento oscuro de la página.
El signo gira 45 grados al abrir. Es <details> nativo: funciona sin JS.
No. Es un entrenamiento dirigido y todo tiene versión más suave.
Sí, y mucha gente va así.
Contenedor de 1368px con márgenes de 36. Secciones a
120px arriba y abajo; las densas a 200px.
Lenis a 1.1 de duración. Las entradas suben 24px con la curva de la casa. Con
prefers-reduced-motion no se mueve nada y las píldoras no ruedan.