# Registro de cambios que afectan al theme

Todo lo que UI toca **por encima de lo que dev tiene publicado** queda anotado aquí, con la
fecha, el porqué y qué habría que hacer del lado del theme. Es el histórico para quien trabaje
en `dev/`: si algo de la maqueta no coincide con staging, la explicación está en esta tabla.

- **Petición** → hay receta en [`output/new/`](new/); ahí está el contrato completo.
- **Desviación** → la maqueta se separa a propósito de lo publicado; no hay componente nuevo.
- **Bug de staging** → algo que dev tiene roto o incompleto hoy en el sitio publicado.

Lo más reciente arriba.

## Dónde está la entrega

**`ui/output/` es la entrega**: todo lo que hay ahí está revisado y cerrado, y es lo que dev
debe coger. Cuatro páginas:

| Página | Sprint | Ruta |
|---|---|---|
| **Educación Infantil** | 5 | `output/pages/sek-schools/educacion-infantil.html` |
| **Educación Primaria** | 5 | `output/pages/sek-schools/educacion-primaria.html` |
| **Espacios deportivos** | 5 | `output/pages/sek-schools/espacios-deportivos.html` |
| **Etapas educativas y Programas IB** | 5 | `output/pages/sek-schools/etapas-educativas-y-programas-ib.html` |
| **Logros y calificaciones** | 5 | `output/pages/sek-schools/logros-y-calificaciones.html` |
| **Aula para familias** | 6 | `output/pages/sek-schools/aula-para-familias.html` |
| **Bachillerato** | 6 | `output/pages/sek-schools/bachillerato.html` |
| **Educación Secundaria** | 6 | `output/pages/sek-schools/educacion-secundaria.html` |
| **Por qué SEK** | 6 | `output/pages/sek-schools/porque-sek.html` |
| **Residencias** | 6 | `output/pages/sek-schools/residencias.html` |
| **UCJC** | 6 | `output/pages/sek/ucjc.html` |

montadas y en verde técnicamente, pero **sin revisión cerrada**, así que siguen en el taller
(`ui/guille/`) y **pueden moverse**. El índice
([`output/index.html`](index.html)) las lista como «en taller», sin enlace, para que
se vea qué está por venir. En cuanto se cierran, se publican aquí.

Las **28 peticiones** con su contrato están en [`output/new/`](new/) y listadas en el
índice con su estado, tipo y bloque de destino.

---

## 2026-08-28 · Logros y calificaciones, rediseño de estructura

Feedback de Guille sobre la maqueta del Sprint 5: no era pulido, eran cambios de estructura en
9 de los 12 módulos de la página. Aplicado y publicado.

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 📐 Criterio | **Símbolo `%` (y cualquier sufijo) en cifras: más pequeño y en la base**, no al tamaño del número | Logros hoy; criterio nuevo, no aplicado aún a las otras 10 páginas | Helper `cifra()` en `_staging/lib.mjs`. Generaliza el `<span style="font-size:.5em">` que el propio wireframe ya usaba a mano para la nota EBAU |
| 🐞 Bug de staging | **El contador animado (`data-sek-count`) se come la coma decimal**: una cifra como "13,5" cuenta hasta "135" | `sek-ui.js`, función `runStatCount` — global, no solo Logros | El parseo (`raw.match(/\d[\d.,]*/)` + `parseInt(digits.replace(/[.,]/g,''),10)`) trata la coma como separador de miles, no decimal. Cualquier cifra no entera en una celda con `data-sek-count` sale mal. En Logros se evita quitando el atributo cuando el valor lleva coma; si aparecen más casos, el parseo del script necesita distinguir coma decimal de coma de miles |
| 🐞 Bug de staging | **El overtitle de sección "roba" el primer teléfono de una lista de contacto** | `08-sek-colegio-info` — mismo bloque que Residencias | `dividerOvertitle()` (global, en `pulido()`) busca el primer `<span>` de texto suelto dentro de `.sek-section-heading` para convertirlo en overtitle. Si la sección no trae uno propio, encuentra el `(+34)` del primer `<a href="tel:…">` de la lista de contacto (que sí vive dentro de `.sek-section-heading` en esta plantilla) y lo desplaza arriba, partiendo el teléfono en dos. En Logros se resuelve insertando un overtitle real ("Contacto") antes que el teléfono en el documento. **Residencias probablemente tiene el mismo bug** — no revisado hoy |
| ⚙️ Rediseño | **Ubicación**: de `08-sek-colegio-info` tal cual a `ubicacionMapa()` (helper ya existente en `lib.mjs`, hasta hoy sin usar en ninguna página) | Contacto | Reordena dirección/teléfono/mapa en listado vertical en vez del reparto horizontal descuadrado |
| ⚙️ Rediseño | **Insights ("Resultados")**: de fila plana de cifras a 3 cards con superficie crema e icono `badge-check` arriba | Resumen de resultados | Sin bloque publicado equivalente — compuesto a mano sobre `sek-stats` |
| ⚙️ Rediseño | **Evolución por convocatoria**: de lista horizontal numerada a rejilla de cards verticales (overtitle numerado + texto + imagen) | Evolución | Sin bloque publicado equivalente — compuesto a mano sobre `sek-content-list` |
| ⚙️ Rediseño | **Cómo acompañamos**: de grid 2×4 de iconos a listado vertical (icono izquierda, texto derecha) | Orientación | `listaCeldas()` de `lib.mjs`, forzando una columna — primer uso real de este helper en una página |
| ⚙️ Rediseño | **Hero**: de `sek-hero-simple` (sin foto) a `sek-hero` con imagen, como el resto del sistema | Hero | Era la única de las 11 páginas sin foto de fondo |
| ⚙️ Rediseño | **Historias**: cabecera y testimonio centrados, no a dos columnas | Historias | Se sustituyó `cabeceraDoble()` por la cabecera apilada de `06-sek-content-grid`, más overrides de centrado en el slide |
| ⚠️ Desviación | **Universidades**: contenedor de logo a tamaño fijo + `filter:grayscale(1) brightness(0)` para normalizar todos a negro | Grids de universidades | Dos de los 18 assets (`digipen`, `columbia-college`) traían fondo blanco sólido pintado, no transparente — se procesaron con Pillow para quitarlo antes de aplicar el filtro |
| ❓ Sin cerrar | **"Acceso a la universidad"** se dejó como fila de cifras (solo con la regla de `cifra()`), no como cards numeradas | Acceso a la universidad | Guille no confirmó si esta sección debía llevar el mismo tratamiento de card que Evolución — pendiente de que lo revise |

---

## 2026-08-28 (tarde) · Actividades extraescolares, reestructuración por módulos

Feedback de Guille sobre la primera pasada: reutilizar mucho más de lo que ya hay publicado en
vez de piezas sueltas. Aplicado, sigue sin cerrar.

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| ⚙️ Rediseño | **Programas** pasa de 2 cards sueltas + card destacada a `sek-doble-card` estándar (el mismo de "Vive SEK"), con foto en vez de vídeo en ambos slots | Extraescolares · Programas | Sin petición nueva: el bloque ya admite imagen fija (`donde-sucede-el-aprendizaje` lo usa así en su 2º slide) |
| ⚙️ Rediseño | **SISA** deja de ser una descripción extendida (`content-welcome`) y pasa a ser el `sek-banner-cta` que **ya promociona SISA en su propia página** (verde `#095434`, foto y URL reales) | Extraescolares · Alto rendimiento | Reuso literal, sin editar apenas — el contenido publicado ya es correcto para este hueco |
| ⚙️ Rediseño | **Colaboradores** pasa a usar el mismo bloque y la misma celda con fallback icono+nombre que `universidades()` en Logros (`content-grid` + `grid-logos`) | Extraescolares · Más experiencias | Mismo patrón, no receta nueva — sigue en [`grid-logos`](new/grid-logos.md) |
| ⚙️ Rediseño | **Contacto de cierre** pasa de `sek-colegio-info` (bloque de ficha de colegio) a `sek-banner-cta` genérico | Extraescolares · Contacto | Encaja mejor con "Solicite información" como CTA que como ficha informativa |
| 🐞 Bug de staging (ya conocido) | **`sek-banner-cta` publica su titular como `div.font-title`, no `h2`** — afecta a los 2 banner-cta de esta página | SISA, Contacto | Mismo bug de los otros 5 sitios ya registrados; receta [`banner-cta-heading`](new/banner-cta-heading.md) |
| 🔴 Nuestro | **Reveal anidado al usar `ponOvertitle()` sobre `sek-doble-card`**: la fila de overtitle de ese bloque ya trae `data-sek-reveal="fade"`, y `dividerOvertitle()` le añade su propia línea con `data-sek-reveal="rule"` dentro — dos gestos en el mismo nodo | Extraescolares · Programas | Corregido en el build de la página (se retira el reveal del contenedor cuando ya lo lleva un hijo). Si `ponOvertitle()`/`dividerOvertitle()` se usan sobre más bloques con esa fila premarcada, conviene resolverlo en `lib.mjs` en vez de en cada build |
| ⚙️ Rediseño | Filtro de **Categoría** pasa de `<select>` a pestañas; **Colegio/Etapa** de dos selects siempre visibles a un botón "Filtros" con panel de checkboxes | Extraescolares · Catálogo | Receta [`catalogo-filtrable`](new/catalogo-filtrable.md) actualizada. Mismo hueco de tabs ya pedido en [`tabs-seccion`](new/tabs-seccion.md) |
| ⚙️ Rediseño | **Nuestras escuelas** pasa de cabecera + rejilla apiladas a composición asimétrica: título en columna izquierda, rejilla 3×2 en la derecha | Extraescolares · Nuestras escuelas | Receta [`highlights-con-tags`](new/highlights-con-tags.md) actualizada, mismo contrato de datos |
| 📝 Contenido | **4 cifras de la intro, cada una con icono** (antes sin icono) | Extraescolares · La experiencia SEK | Reusa `sek-stats`, que ya admite icono por celda — solo se rellenó el slot |

---

## 2026-08-28 · Logros y calificaciones, segunda ronda (contra Figma real)

Guille pasó los nodos reales de Figma para 4 módulos. Comparados contra lo montado y corregido.

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| ⚙️ Rediseño | **Insights**: no era una fila de `sek-stats` — es **`Content/Highlights`** (Figma `855:33746`), un bloque real del catálogo con título+texto a dos columnas y 3 cards **escalonadas** (`mt-0/50/100`) debajo del título. Se remontó con `tpl('desarrollo-integral-del-talento', '03-sek-content-highlights')` en vez de construir a mano | Resultados | El escalón ya vive en el bloque publicado — no hace falta el helper `escalonScroll()`, es CSS nativo de la plantilla (`min-[1024px]:mt-[Npx]`) |
| 🐞 Nuestro | **`sinMedia()` es global al documento**: quita *todos* los `<img>`, no solo la foto de cabecera. Al usarlo en `Content/Highlights` borraba también los 3 iconos de las cards, que son `<img src="*.svg">` | `resumen()` | Quitado `sinMedia()` de esta función — el bloque no trae foto de cabecera que retirar |
| 🐞 Nuestro | **Un `$('.sek-section-heading p').remove()` genérico se llevaba los párrafos de las cards**: en `Content/Highlights` las cards viven *dentro* de `.sek-section-heading` (a diferencia de `sek-content-lg`, donde viven fuera) | `resumen()` | Acotado a `columna($).find('p').remove()` |
| 📐 Criterio | **Proporción icono:cifra**: el icono del bloque nativo mide 40→48px (`h-10 w-10 min-[768px]:h-12 min-[768px]:w-12`), no 32px. Aplicado en IB, PAU y Acceso a la universidad (las tres llevan icono ahora, antes solo IB) | Filas de cifras (`sek-stats`) | Confirmado contra Figma `254-24213` |
| ⚙️ Rediseño | **Evolución → tabla comparativa**, no cards con foto (se había hecho así en la ronda anterior). El nodo Figma `1973:11869` — el documento de estrategia original de la página, no un diseño de UI — especifica para este bloque "gráfico temporal o tabla comparativa": Evolución PAU, Evolución IB, comparativas entre promociones. Confirmado con Guille | Evolución | No hay tabla comparativa multi-columna en el catálogo (`tablaDatos()` es clave/valor a una columna, para Ubicación) — se construyó una `<table>` semántica a mano |
| ⚠️ Desviación | **Fotos reemplazadas por contenido real**: el hero tenía niños de Infantil (reutilizado sin mirar de otra página) y los dos avatares de Historias eran un árbol en flor y un aula de profesor con niños — ninguna encajaba con una página de Bachillerato/PAU/universidad | Hero, Historias | Elegidas a mano en Pexels por contenido: adolescentes en biblioteca (hero), dos retratos de universitarios (avatares). **Criterio nuevo para todas las páginas**: imagen relevante al contenido de la sección, nunca reutilizada solo porque "ya está en el sistema" |

---

## 2026-08-28 · Actividades extraescolares (primera pasada, sin cerrar)

Página nueva, Sprint 7, aún en el taller (`ui/guille/pages/sek-schools/extraescolares.html`) —
sin revisión de Guille, no publicada a `output/`. Origen: Figma `AI-SEK` (nodo `513:70`, texto
UX) + wireframe de referencia externo (`estrella-sparkle.lovable.app/extraescolares`), sin HTML
de UX propio.

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 🧩 Petición | **No hay catálogo con filtros combinables, chips y modal** en todo el catálogo de bloques | Extraescolares · Catálogo de actividades | Receta [`catalogo-filtrable`](new/catalogo-filtrable.md). En la maqueta va con HTML/JS propios de la página, sin bloque publicado del que partir |
| 🧩 Petición | **`content-highlights` no admite una fila de tags por celda** | Extraescolares · Nuestras escuelas | Receta [`highlights-con-tags`](new/highlights-con-tags.md). Refinamiento sobre el bloque publicado (`sek-content-highlights`), no un componente nuevo |
| 📝 Contenido | **Sin dato de colegio ni etapa por actividad**: el documento del cliente lista las 26 actividades por categoría, sin asociarlas a colegio o etapa educativa | Extraescolares · Catálogo | Los filtros de Colegio y Etapa quedan en la maqueta **deshabilitados**, con aviso, hasta que el cliente lo facilite — ver Casuística de la receta |
| ⚠️ Desviación | **`sek-colegio-info` reutilizado sin su dirección, teléfono ni mapa** (los de SEK-Alborán) | Extraescolares · Contacto | Esta página cubre los siete colegios; la dirección de un solo centro es incorrecta aquí. Se retira todo lo posterior a la cabecera y queda solo título + texto. Mismo bug de origen que ya se registró en Residencias (2026-08-20): el bloque trae los datos de Alborán clavados |
| ⚠️ Desviación | **`content-welcome--gallery` reutilizado sin el "ver más" ni la galería de vídeo** | Extraescolares · Programas (SEK International Sports Academy) | Se reusa el mismo contenido de la página propia de SISA, pero sin el colapso ni el modal de YouTube: aquí es una card de apoyo, no la página del programa |

---

## 2026-08-24 · Por qué SEK, revisión de estilos

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 🐞 Bug | **La píldora del anchor bar no acompaña al desplazamiento** | `sek-anchornav`, global | `.sek-anchornav-pill` cuelga de la barra y se posiciona respecto a ella. Si quien se desplaza es la lista, los ítems se mueven y la píldora se queda clavada a la izquierda, tapando el texto. El scroll tiene que ocurrir en el mismo contenedor que la píldora |
| 📐 Criterio | **Dos gestos distintos, no uno**: la ola (`data-sek-wave-col`) y la entrada (`data-sek-reveal`) | animación, global | La **ola** desplaza la pieza de forma permanente y ligada al scroll: es un mosaico, y sobre una rejilla de celdas iguales solo las descuadra. La **entrada** es fade + 20 px de subida, una vez. En rejillas que deben leerse alineadas: entrada sí, ola no |
| 🧩 Petición | **Entrada en cascada** para rejillas alineadas | animación, global | El motor escalona 60 ms y reinicia cada cuatro piezas, así que en una fila de tres no se nota. La variante retrasa **el mismo gesto** 90 ms por posición y todas reposan alineadas. Hoy hay que forzarlo por CSS con `!important`, porque `sek-motion.js` escribe `transitionDelay` inline al entrar: convendría que el paso fuera configurable |
| 📐 Criterio | **Los enlaces van en negro**, no en azul de marca | todas las páginas | Decisión del 24/08. Lo que distingue a un enlace es el **subrayado**, no el color; el azul se reserva a la marca. Incluye el hover, que saltaba a azul. Sobre superficie oscura siguen en inversa, y los **botones** conservan su color de marca |
| 🐞 Bug | **La tinta inversa sobrevive al cambio de fondo**: muchos bloques se publican en versión inversa (`text-…-inverse`) y al reutilizarlos sobre crema o blanco el texto se queda en #fbfbfb. Contraste **1,1** — ilegible | global (25 casos en esta página) | La tinta debe depender de la superficie del bloque, no venir clavada en el marcado. Ojo: en cards **sobre foto** la inversa sí es la correcta, aunque la sección sea clara |
| 📐 Criterio | **Los iconos decorativos van en tinta, no en azul**: el azul es del enlace | todas las páginas | Si icono y enlace comparten color, el ojo no distingue qué es pulsable |
| ⚠️ Desviación | El editorial de esta página se pintaba **su propio ritmo** con márgenes inline, en vez del cuerpo del sistema | Por qué SEK | Corregido: usa el helper común, así hereda 40/16 y la regla de texto destacado |

---

## 2026-08-21 · Residencias, cierre

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 🧩 Petición | **Tarjeta superpuesta + proporción por instancia** en `sek_c_map` | Residencias · Ubicación | Los dos mapas llevan altura clavada (`h-[436px]`) y el pequeño no queda cuadrado; y no hay slot para la tarjeta que va a caballo del borde. Receta [`mapa-card-superpuesta`](new/mapa-card-superpuesta.md) |
| 🧩 Petición | **Barrido** al cambiar la foto del acordeón `sek-programas` | Residencias · Así es el día a día | El swap del theme pasa por `opacity:0` y se ve el fondo: lee como un parpadeo. Prototipo en la maqueta. Receta [`programas-barrido`](new/programas-barrido.md) |
| 🐞 Bug | Mapa con las **coordenadas de Alborán** (36,71 / −2,79 · Almería) | Residencias · Ubicación | Heredadas de la plantilla. Las de SEK-El Castillo son **40.473333, −3.940556** (publicadas por el colegio en *Dónde estamos*) |
| 🐞 Bug | La **entrada** (`data-sek-reveal`) va en el propio `.sek-map` | Residencias · Ubicación | Si el mapa lleva una pieza superpuesta, esta no acompaña el movimiento y se ve descolgada durante toda la animación. El reveal debe ir en el envoltorio |
| ⚠️ Desviación | La `dl` del mapa **no es la Table del componente**: 3 columnas, línea `hairline` en vez de `disabled`, apilado en ≥768 y etiqueta en medium 16 | Residencias · Ubicación | El componente `20:3345` pide columna de 584 con filas de dos columnas al 50 %. Receta [`location-tabla-datos`](new/location-tabla-datos.md) |
| 🐞 Bug | Titular de sección a `w-[50%] shrink-0` **se sale 32 px** de la retícula si la columna de contenido es fija | Residencias · Ubicación | 680 + 128 + 584 = 1392 sobre un contenedor de 1360. Debe ser `flex:1 1 auto; min-width:0` |
| 🐞 Bug | **Los superíndices salen planos**: el reset deja `sup` en `vertical-align:baseline` | global (visto en Residencias · Ubicación) | "40.000 m²" se lee con el dos a media altura. Afecta a cualquier unidad al cuadrado o cúbica. Arreglo: `sup{vertical-align:baseline;position:relative;top:-.35em;font-size:.68em;line-height:0}`. Ojo, **`vertical-align:super` sube demasiado** y despega el dígito de la unidad: la elevación se marca a mano (~⅓ de eme) |
| 🧩 Petición | **Overtitle/Sm a 14 en medium** | Residencias · Ubicación | Cuando la etiqueta convive con un valor ya reducido, 14 en regular pierde cuerpo; el peso devuelve el contraste tipográfico que ya no da el tamaño |

---
## 2026-08-20 · Residencias

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| ✨ Petición | **El ritmo 40/16 del Title Section pasa a ser global**: se aplica a toda la página, no módulo a módulo. En una misma página convivían 12, 16, 36 y "normal" | `sek_c_section_heading` | Receta `section-heading-espaciado`, ampliada: el bloque de texto también respira 40 respecto al titular, salvo en cabeceras a dos columnas |
| 🐞 Bug | **Los mapas apuntaban a Almería** (36,71 / −2,79): el bloque viene de Alborán y arrastra sus coordenadas. También traía el teléfono del colegio | `sek-colegio-info` | Los datos de mapa y contacto deben venir del centro, no del bloque de origen |
| 🎛️ Desviación | **El doble-card se queda sin media** al retirar las cards de plantilla, y el heading cae en una columna de 432 px | `sek-doble-card` | Ya recogido en `content-feature-list`: media propia del bloque |
| 🎛️ Desviación | La rejilla de cards iba a **327 px**; pasa a la retícula del sistema, tres de 432 con 24 de calle | `sek-content-grid` | Misma retícula en todos los módulos de card |

| 🐞 Bug | **Ola y reveal en el mismo nodo**: al marcar la card con `data-sek-wave-col` teniendo ya `data-sek-reveal`, los dos gestos escriben su `transform` y la entrada da saltos —y el texto de la card llega a verse cortado mientras dura—. El theme separa capas: la ola en el contenedor, el reveal en la card | animación | La ola nunca en el mismo nodo que el reveal |
| ✨ Petición | **El cambio de foto del acordeón debería ser un barrido**, no el split-and-fade actual (`SEK_PROG_SWAP_LIFT` + opacidad en `sek-ui.js`) | `sek-programas` | Variante de transición para el swap; no se reimplementa por fuera para no volver a pelear con el motion del theme |
| 🎛️ Desviación | **La tarjeta de ubicación se monta a caballo del borde del mapa**, como en Figma `20:3345`: pegada al borde se lee como un pie | `sek-colegio-info` | Que la tarjeta pueda desbordar el frame |
| 🐞 Bug | **El splitter de titulares parte el nombre del centro**: hace `replace(/\s+/g, ' ')` y `\s` **incluye el espacio duro**, así que lo convierte en espacio normal y "Residencia SEK-El Castillo" rompe como `SEK-El / Castillo`. Regla: el nombre del centro no se parte nunca | `sek-motion.js` | Que el splitter respete `\u00A0` (dividir por espacios normales, no por `\s`) y no trocee elementos marcados `nowrap` |
| ✨ Petición | **El banner de SEK Sports va sobre superficie primary**, no crema | `sek-banner-cta` | — |
| 🐞 Bug | **Dos animaciones compitiendo por el mismo `transform`**: la entrada escalonada iba con un script propio y el theme tiene su ola (`data-sek-wave`), con rAF compartido con el parallax. Las cards entraban a saltos | animación | La entrada usa la ola del theme; ajustar la amplitud es un cambio global del componente |
| 🎛️ Desviación | **El listado de Location va en vertical**: una fila por dato, etiqueta a la izquierda y valor a la derecha. El bloque lo reparte en tres columnas de 184 px y trae seis filas cuando los datos son cuatro | `sek-colegio-info` | Filas, no columnas, y que las filas sobrantes no se pinten |
| ✨ Petición | **Listado de características en el banner**: icono de 24 + texto en dos columnas, como campo booleano. Los destacados iban como etiquetas y a partir de tres se leen como nube de palabras | `sek_c_banner_cta` | Receta `banner-feature-list` |
| ✨ Petición | **Norma de rejilla**: si las cards caben en una fila, van en una fila; solo se abre la siguiente cuando no entran. Cuatro cards a 322, que es la medida nativa | módulos de card | Que la retícula dependa del número de cards, no de un valor fijo |
| 🎛️ Desviación | **Location con la tabla de datos en la segunda columna** (Figma `20:3345`): cabecera a dos columnas y los datos bajo el texto. El bloque publicado la deja a ancho completo bajo el heading | `sek-colegio-info` | Registrar esa instancia; hoy no existe en el theme |
| 🎛️ Desviación | **"Así es el día a día" pasa a acordeón** con la descripción dentro y **la foto cambia al abrir cada apartado**, usando el mapa de imágenes del propio bloque (`data-sek-programas-config`) | `sek-programas` | — |
| ✨ Petición | **El Title Section nunca va a ancho completo**: 584 px apilado, dos columnas de 667 en el doble. A 1360 el titular se estira y deja de leerse como cabecera | `sek_c_section_heading` | Ampliado en `section-heading-espaciado`. Aplicado en las siete páginas |
| 🎛️ Desviación | **La media de la card viene en vertical (322×660)**, pensada para columna estrecha: en una rejilla de dos columnas se estira a 661 de alto. En ese formato va apaisada (3/2) | `sek-content-grid` | Proporción de media según el número de columnas |
| 📝 Contenido | UX pide el **mapa como foto** y el bloque monta dos mapas interactivos de Leaflet | `sek-colegio-info` | Campo para elegir mapa o imagen |

## 2026-08-20 · UCJC, revisión v2

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 🐞 Bug | **El velo se aplicaba a todas las cards del Cross**, y en el prefooter conviven dos tipos: a sangre y con caja de color. Absolutizar la media de las segundas las rompía | `sek-cross` | El velo y la foto a sangre solo en la variante alpha |
| 🐞 Bug | **El theme ya tiene contador** (`data-sek-count`) en las cifras: marcarlas también con el nuestro hacía que se pisaran —el nuestro ponía 0 y el suyo lo tomaba como valor final— y se quedaban en cero. Donde ya hay contador del theme, no se toca | animación | El contador propio solo para nodos nuevos, como los numerales de la lista |
| 🎛️ Desviación | **La regla del overtitle, unificada**: borde suave al 50 % sobre fondo claro y blanco al 40 % sobre marca u oscuro. Cada bloque traía el suyo, alguno en negro sólido | global | Que el color lo resuelva el componente por superficie |
| 🎛️ Desviación | En UCJC, el **accent naranja de Schools pasa al granate** de la universidad, con el contenido en el blanco de la paleta | `sek-cert` | Que el accent lo dé la marca de la página |
| 📝 Contenido | **Fuera el bloque de vídeo**: no lo pedía UX —lo había añadido UI como apoyo al Think Tank—. Si se recupera, Life Long Learning iría solo con el vídeo, sin el par de imágenes | UCJC | Confirmar con UX |
| ✨ Petición | **La superficie `tertiary` se resuelve contra el fondo del bloque**, igual que el badge de la Agenda: sobre blanco es el azul (`blue-100`) y sobre crema, el crema oscuro (`cream-400`). En Ejes, con fondo crema, Bienestar no puede ir en azul | `sek-cert` y todo el sistema | Es la misma mecánica de superficies del backlog: que la resuelva el componente, no la instancia |
| 🎛️ Desviación | **El CTA cierra el listado como una fila más**: hueco del numeral vacío y el botón donde arranca el título de cada item, así comparten vertical | `sek-content-list` | Slot de acción al final de la lista |
| 🎛️ Desviación | **Lista con numeral, ajustes de la variante**: 16 px entre la cifra y su contenido (eran 24), divider al 18 % —al 30 % pesaba—, **sin la primera línea** (solo separaba del Title Section) y la lista **centrada** respecto a la imagen | `sek-content-list` | Recogerlo en la variante, no por instancia |
| 🐞 Bug | **El escudo de los ejes tiene dos superficies**, una para el contenido y otra para la parte del icono, con su propio fondo cada una: se pueden desincronizar (pasó al cambiar solo una) y dejan costura entre ambas. Basta **una superficie en el contenedor**, con el radius inferior | `sek-cert` | Una sola superficie por card; las capas internas, transparentes |
| 🐞 Bug | **El script del contador no se ejecutaba**: iba dentro del sub-documento del módulo, y un `<script>` que llega como HTML dentro de otro elemento no corre. Los números se quedaban en cero | animación | Inyectarlo una vez en el documento, no por módulo |
| ✨ Petición | **Animación de entrada** en tres gestos: escalón scroll-driven, regla del overtitle que se dibuja y contadores desde cero | global | Receta `animacion-entrada` |
| 🎛️ Desviación | **La regla del overtitle** pasa al borde suave (30 %), no al primario | global | Token de borde para la regla |
| 🎛️ Desviación | **Retícula de La Colmena** a la especificación: tres columnas iguales con 24 de calle (432 px en 1440). El bloque las dejaba en 389 con 67 de separación | `sek-content-grid` | Revisar la retícula del bloque |
| 🎛️ Desviación | **Dividers del listado de Estudios** en blanco al 30 % sobre el granate | `sek-content-list` | Que el color del divider dependa de la superficie |
| 🐞 Bug | **El escudo crema** de los ejes se leía como un hueco en la rejilla: pasa al blanco de la paleta | `sek-cert` | — |

## 2026-08-20 · UCJC, revisión

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| ✨ Petición | **Logotipo de la universidad en el header**, arriba a la derecha, como campo booleano de plantilla | `sek_c_header` | Receta `header-logo-universidad` |
| 🎛️ Desviación | **Estudios y las cifras eran dos módulos seguidos**: van fusionados en uno (Figma `1406:37521`), en granate y con la cifra como numeral gigante del item | `sek-content-list` | Variante del item con numeral en vez de icono |
| 🎛️ Desviación | **Life Long Learning** pasa al módulo de contenido con par de imágenes (Figma `1320:37286`) | `sek-content-lg` | — |
| 🎛️ Desviación | **Escudos de los ejes**: esquinas inferiores a `9999px` y el icono toma su color de la superficie —blanco de paleta sobre las oscuras, tinta sobre las claras—. El de Tecnología tiene escudo crema: en blanco desaparecía | `sek-cert` | Que el color del icono lo resuelva el componente por contraste |
| 🎛️ Desviación | **Las cifras se pegan al módulo anterior**: `padding-top` reducido para que se lean como parte de él | `sek-stats` | Campo de espaciado superior, o herencia del bloque anterior |
| 📝 Recurso | **Falta el logotipo de La Colmena**: no existe como archivo en ucjc.edu, la marca aparece solo como texto | Modelo educativo | Pedirlo a la universidad |

## 2026-08-19 · Educación Infantil, v5 (guía de módulos de UX)

UX recopiló, módulo a módulo, qué componente quiere en cada sección (`1710:52629`). Al montarlos
aparecen estas diferencias con lo publicado:

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 🐞 Bug | **El velo de las cards no oscurecía**: la capa de color lleva `mix-blend-mode: multiply` y el contenedor tenía `z-index`, que crea contexto de apilamiento — el blend se mezclaba consigo mismo y no con la foto. Sin `z-index` funciona | velo de cards a sangre | No poner `z-index` en la capa del velo: el orden del DOM ya la coloca sobre la imagen |
| ⚠️ Contraste | Con texto largo sobre foto, el velo de Figma (0,40 sobre el 60 % inferior) no llega a AA. En la maqueta esas cards usan velo al 100 % de alto y 0,55 | Cross de contenido | Variante de velo para cards con descripción, o subir el token |
| 🎛️ Desviación | El **Cross mezcla dos tipos de card** en el mismo reel: texto sobre foto y foto con caja debajo. La guía las quiere todas a sangre, con numeral y descripción, y la última en superficie de marca | `sek-cross` | Campos: tipo de card, numeral y superficie por card |
| ✨ Petición | **Espaciado del Title Section**: 40 px entre bloques del cuerpo y 16 entre el título de un bloque y su descripción (`4:1385`). Hoy cada módulo lo resuelve por su cuenta | `sek_c_section_heading` | Receta `section-heading-espaciado`. Si el componente no existe como tal, crearlo |
| 🐞 Bug | El **título del acordeón** se queda a 16 px y peso normal si el texto se escribe en el `span` contenedor: el estilo vive en un `span` interno con `font-title` | `sek-programas` | Que el campo escriba en el nodo correcto |
| 🎛️ Desviación | En "Así es un día" se **retira la card con vídeo de fondo** que trae el bloque: la sección es el listado de momentos y su foto | `sek-agenda` | Que la card de vídeo sea opcional **y que su columna deje de estar reservada**: el grid mantiene `grid-cols-[minmax(0,1fr)_322px]` aunque no haya card, y la lista se queda en 951 px de los 1360 |
| 🎛️ Desviación | **El velo va dentro de la caja de texto**, no sobre la card entera (`1714:54387`): así ocupa solo lo que ocupa el texto y la foto se ve limpia por encima. Y en esa franja el desenfoque llega a 12 px, no a 24 | cards a sangre | Recogido en la receta `card-scrim-overlay` |
| ✨ Petición | **Revisión de atomización de todo el sistema**, como una librería de design system: un cambio atómico debe afectar a todas las instancias y solo un *override* explícito romper la herencia. El caso del trazo lo ilustra: cinco valores distintos conviviendo sin decisión detrás | todo el theme | Petición de Guille (20/08). En el backlog del proyecto |
| ✨ Petición | **Un solo grosor de trazo para todos los iconos: 1,5 px de pantalla.** Lucide viene a 2 y el theme mezcla 1 y 1,25 | iconos de todo el sitio | Fijarlo en el pipeline de iconos, no instancia a instancia |
| 🐞 Bug | **Hay iconos del theme con el grosor en sus `path` o `g`**, no en el `svg`, y con valores propios (1,6 · 1,7 · 1,8). Tocar solo el `svg` raíz deja fuera a la mitad del set | iconos de todo el sitio | Normalizar el atributo en el svg **y en sus formas** |
| 🐞 Bug | **El trazo escala con el tamaño del icono**: `stroke-width` va en unidades del `viewBox`, así que el mismo 1 se pinta a **2 px** en un icono de 48 y a **0,83** en uno de 20. Se ve en el `+` del acordeón | iconos de todo el sitio | `vector-effect="non-scaling-stroke"` en el svg y sus formas: el trazo pasa a medirse en píxeles de pantalla y deja de depender del tamaño |
| 🐞 Bug | **Los estilos de texto se desvían de Figma**: el overtitle lleva el tracking **al revés** (−2 % frente al +2 % de Figma) y con interlineado 1,6 en vez de 1,3; los titulares de 24 y 32 van a 1,3 cuando el estilo es 1,2; el cuerpo, a 1,5 con tracking negativo cuando debe ser 1,4 y sin tracking | definición de estilos | Receta `estilos-texto-figma` |
| 🎨 Token que falta | El crema oscuro es **`--bg-tertiary` de Figma (#e8e6dd)** y en el theme no existe: el bloque de testimonial lo escribe a pelo con `bg-[#e8e6dd]` | tokens | Añadirlo como token y sustituir el hardcode |
| ✨ Petición | **Badge numérico de la Agenda con superficie automática**: crema sobre blanco, crema oscuro sobre crema, azul en Schools y negro en Group sobre marca. Hoy trae un azul claro fijo (`#F1F6FF`) heredado del calendario | `sek_c_event_card` | Receta `agenda-badge-superficie` |
| ✨ Petición | **Todas las piezas entran fuera de su posición**: celdas, cards de rejilla y de carrusel. Antes la primera de cada tira nacía ya colocada y el gesto no se leía | animación de entrada | Escalón de 48 px el primero y 64 más por cada siguiente, hasta el quinto |
| ✨ Petición | **Separadores de la rejilla de items**, campo `auto / on / off`: en `auto` no se pintan sobre superficie de marca —donde el hairline no separa, solo ensucia— y sí sobre blanco o crema | `sek-content-list` | Receta `lista-separadores` |
| ✨ Petición | **Acordeón, cambio global**: el `+`/`×` va con **menos trazo** (1 en vez de 1,25) y el título se alinea con su icono — centrado en el eje si ocupa una línea, pegado al alto del icono si ocupa dos | `sek-programas`, `sek-accordion` | La columna del título toma el alto del icono (48 / 64) y centra su contenido: resuelve los dos casos sin condicionales |
| 🐞 Bug | **La foto de una card a sangre debe cubrir toda la card**: si la imagen solo ocupa la mitad superior, el velo de la caja de texto se aplica sobre el fondo del bloque y sale un rectángulo gris en vez de la foto difuminada | `sek-cross` | La media de la variante alpha va en `position:absolute; inset:0` |
| 🐞 Bug | El **Cross publica su cabecera sin overtitle**: no hay nodo donde escribirlo | `sek-cross` | Campo de overtitle con su regla, como el resto de módulos |
| 📐 Medidas | **El Cross no cuadra con Figma**: el heading debe medir **584 px** (hoy nace a dos columnas, con el titular al 50 %) y el reel es una **rejilla de tres columnas de 437,33 px con 24 de calle**, no un carrusel de slides de 322. Las cards arrancan a **64 / 40 / 0 px** y miden **636 / 614 / 656** | `sek-cross` | Variante "rejilla" del Cross con esas medidas; hoy hay que neutralizar el carrusel (clases `swiper-*`) y el efecto de ola (`data-sek-wave-col`) para que no pisen la retícula |
| 🎛️ Desviación | En esa rejilla, el **numeral va en la línea del título**, a la derecha, y sustituye al enlace de la card | `sek-cross` | Campo de numeral por card |
| ✨ Petición | La **agenda no trae media**: la guía la pide con la doble tira de foto a la derecha | `sek-agenda` | Slot de media en el bloque |
| ✨ Petición | El bloque de **galería con controles** deja la cabecera en una columna de 437 px, así que no sirve para el módulo de contenido + galería de la guía | `sek-content-grid` | Galería con controles bajo una cabecera a ancho completo |
| 🎛️ Desviación | **Media al otro lado**: ningún bloque publicado la pone a la izquierda. Alternar el lado entre secciones consecutivas es el campo `media_side` de `content-feature-list` | `sek-content-list` | Pendiente de la receta ya abierta |
| 🐞 Bug | Al clonar un item de lista/cross, **el clon arrastra el contenido del anterior** si ya se había rellenado (descripciones repetidas, numeral fijo en 01) | repeaters | Renderizar cada item desde plantilla limpia |
| 🎛️ Desviación | En el bloque de **superficie de marca**, el cuerpo hereda el gris secundario y no se lee: hay que forzar el color inverso | `sek-content-list` inverso | Que el color del cuerpo dependa de la superficie |

## 2026-08-19 · Educación Infantil, v4 (layouts de Figma)

| Tipo | Qué | Dónde | Qué hacer en dev |
|---|---|---|---|
| 🐞 Bug | **El velo de las cards a sangre no es el de Figma**: hoy son un gradiente `from-black/45 via-black/15` y un `.sek-progressive-blur` de 24 px planos con máscara. Un blur único enmascarado no progresa: en la franja intermedia se ven a la vez la foto nítida y la foto desenfocada | `.sek-progressive-blur`, cards `Color=Alpha` | Token **Overlay/Card/Bottom** (`rgba(29,31,33,0)→.40`, `multiply`) y blur **progresivo 0→24 px** apilando capas con máscara escalonada. Receta `card-scrim-overlay` |
| ⚠️ Contraste | Con el overlay de Figma (0.40) el titular blanco baja de AA sobre fotos claras; el del theme (0.45 + parada 0.15) tapaba más | cards del cross | Decidir: subir la opacidad, ampliar la altura del velo o dar `text-shadow` al titular. Está en la receta |
| ✨ Petición | **Escalón que se resuelve al hacer scroll**: las celdas nacen escalonadas y quedan alineadas por arriba cuando la tira llega a la mitad del viewport | tiras de highlights | Receta `highlights-escalon-scroll`; en la maqueta va con un script propio |
| ✨ Petición | **Title Section a dos columnas con el overtitle en fila propia** (`4:1459`) | `sek_c_section_heading` | Receta `section-heading-split` |
| ✨ Petición | **Tira de highlights de más de cuatro celdas**: hoy caen a 155 px y el texto se parte en tiras | `sek_c_stats` | Receta `highlights-tira-larga` |
| 🎛️ Desviación | **Controles del carrusel visibles en escritorio** (`1:2256`). El bloque los oculta a partir de 640 px | `sek-content-grid` | Campo para mostrarlos siempre, con su indicador de progreso |
| 🐞 Bug | **Clonar un item del acordeón arrastra sus `id`**: cuatro paneles con el mismo `id`/`aria-controls` dejan el acordeón inutilizable para lector de pantalla | `sek-programas` | Los `id` deben generarse por índice al renderizar el repeater |
| ✨ Petición | El módulo de **contenido con par de imágenes** (`1:2256`) lleva en Figma **controles de carrusel y barra de progreso**; el bloque publicado (`sek-content-lg` de Ideario) trae las dos fotos fijas, sin controles | `sek-content-lg` | Que el par de imágenes sea un carrusel con sus controles, como en la referencia. En la maqueta van sin controles: no se ponen botones que no hacen nada |
| 🎛️ Desviación | **Recursos para la familia** (`669:45238`) pide texto a la izquierda y media a la derecha a la misma altura. El bloque de lista deja la media en una fila propia, debajo del texto | `sek-content-list` sin lista | Que la media pueda ir en la fila del contenido cuando el bloque no lleva items |
| 🐞 Bug | El hero de "Dónde sucede el aprendizaje" **no trae bajada**: al volcar el subtítulo se perdía sin avisar | `sek-hero` | La bajada debe existir siempre en el bloque, aunque nazca vacía |
| 🎛️ Desviación | La superficie de la celda de highlights se decide por el fondo de la sección (crema sobre blanco, blanca sobre crema). Hoy es siempre crema y sobre fondo crema desaparece | `sek_c_stats` | Campo de superficie, o que herede del fondo |
| 🎛️ Desviación | El `svg` de las banderas circulares no trae `width`/`height` y dentro de un flex se colapsa | maqueta | Si se vendorizan, darles tamaño explícito |

## 2026-08-19 · Educación Infantil, v3 (segunda tanda)

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🆕 Petición | **Tarjetas escudo en rejilla escalonada** (Figma `922:39254`) | "Preparados para dar el siguiente paso" | Receta [`cards-escudo`](new/cards-escudo.md). `sek-cert` es un carrusel de logos sueltos: no tiene tarjeta de dos mitades, ni texto dentro, ni escalonado |
| 🆕 Assets | **Banderas circulares** en `assets/banderas/` (circle-flags) | cifras del modelo lingüístico | El icono genérico de traducción no dice nada; la bandera sí. Dos códigos se solapan para el modelo bilingüe. En `lib.mjs`, `banderas()` |
| 📐 Criterio | **`sek-agenda` para cualquier secuencia numerada**, no solo la jornada | metodología y "un día en Infantil" | Es el módulo que trae la numeración (Figma `254:31037`) |
| 📐 Criterio | **`sek-doble-card` tiene dos usos**: con sus cards (Figma `23:1454`) o solo con media (`669:45238`) | Infantil, dos módulos | En el primero las cards son el contenido; en el segundo sobran y se retiran. Ojo: el bloque solo publica **una** imagen, así que la segunda card se queda sin foto |
| 📐 Criterio | **Una sección y su resumen van juntos** (Figma `1334:39205`) | "Crecer acompañado" | Cabecera con el texto y, debajo, la rejilla de cuatro. Mismo criterio que en "Preparados" |

## 2026-08-19 · Educación Infantil, revisión v3

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🔴 Nuestro | **Dos líneas en el overtitle** | todas las páginas | Varios bloques ya publican la suya y nosotros añadíamos otra: quedaba la larga del bloque y un trozo corto al lado. Ahora se reestiliza la existente y solo se crea si falta. Una sola, a ancho del contenedor y al 50 % de opacidad |
| 🔴 Nuestro | **Cards del bloque origen sin retirar**: SEK-Les Alpes y la Goleta aparecían en Infantil y en Residencias | `sek-doble-card` | El bloque viene de *Dónde sucede el aprendizaje* y trae dos cards propias. Se retiran junto con su copy |
| 📐 Criterio | **El testimonio se alinea a la izquierda por dentro; lo que se centra es su caja** | testimonial | Centrar también el contenido descolocaba comillas, cita y atribución entre sí |
| 📐 Criterio | El badge de `sek-agenda` viene en **azul claro del calendario**: fuera de ese contexto va en blanco | "Un día en Educación Infantil" | Igual que su bajada y sus descargables de meses, que tampoco aplican |

## 2026-08-19 · Educación Infantil, revisión v2

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🔴 Nuestro | **Las celdas de highlights salían solo con el icono** | Infantil, cuatro módulos | El volcado reutilizaba los nodos de la plantilla y el texto no llegaba a pintarse. Ahora la celda se reconstruye entera: icono, título y descripción |
| 📐 Criterio | **`sek-agenda` es el módulo con numeración** (Figma `254:31037`) | "Así es un día en Educación Infantil" | Badge con el número, título del momento y su descripción. Ojo: viene del calendario del curso y arrastra su bajada y los descargables de meses |
| 📐 Criterio | **Un módulo de cabecera y su resumen son un solo bloque** | "Preparados para dar el siguiente paso" | Se fusionan en el highlights con texto previo (Figma `820:35493`), en vez de encadenar editorial y rejilla |
| 📐 Criterio | La línea del overtitle va **al 60 % de opacidad** | todas | Con el token a plena opacidad seguía pesando demasiado |
| 📐 Criterio | El **testimonial va centrado**: caja, comillas, cita y atribución | Infantil | Suelto a la izquierda el bloque queda descompensado |

## 2026-08-19 · UCJC, revisión v2

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| ⚠️ Desviación | **Bloque de cifras sobre el granate de la marca**, con cifras, etiquetas e iconos en blanco | UCJC, titulaciones | El color va **en línea**: las clases de texto del bloque y de sus contenedores ganan a la de la sección, y las cifras se quedaban en oscuro sobre el granate |
| ⚠️ Desviación | **Cards del prefooter sin foto, con color de paleta** en vez del negro del sistema | prefooter, todas | Junto a las que sí llevan foto, el negro canta. La de colegios va al azul de marca; el resto, a los tonos claros. El fondo se aplica en línea porque no siempre lo pinta la misma utilidad |
| ⚠️ Desviación | **Rejilla fija 3 × 2 en La Colmena**, sin mandos | UCJC | Seis retos se leen mejor de una vez que pasando carrusel |
| 📐 Criterio | Los titulares admiten **salto de línea explícito** (`<br>`) | UCJC, Estudios y Life Long Learning | Un titular de dos palabras largas se come el ancho de la columna. El volcado detecta el `<br>` y usa `html()` en vez de `text()` |
| 📐 Criterio | Sobre el granate, la línea del overtitle va en **blanco translúcido**, no en el gris apagado | UCJC, Estudios | El `border-static-disabled` es para fondos claros |

## 2026-08-19 · Content Feature List

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🆕 Petición | **Contenido y media a dos columnas, con el lado de la imagen alternante** (Figma `669:45238`) | Educación Infantil, Residencias | Receta [`content-feature-list`](new/content-feature-list.md). Es el módulo con el que UX quiere abrir sección después del hero. Hoy se monta con `sek-doble-card`, que publica la rejilla pero trae su propio copy, admite una sola imagen y no deja elegir el lado |

## 2026-08-19 · Residencias

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 📐 Criterio | **`sek-colegio-info` es el módulo Location de la librería** (Figma `20:3345`): cabecera con tabla de datos y dos mapas | Residencias, Logros | En staging se usa con el teléfono en el overtitle, y por eso no parecía el mismo módulo. El overtitle es para la etiqueta de sección |
| ⚠️ Desviación | **Galería en carrusel también en escritorio** | Residencias, "Vivir en SEK" | Igual que en La Colmena: el `content-grid` pasa a rejilla a partir de 640 px y esconde los mandos |
| ⚠️ Desviación | **Logo de marca en línea, no como `<img>`** | banner de SEK Sport | Los `-mono` están dibujados con `currentColor`: como `<img>` no heredan color y además vienen a `width:100%`, sin ancho intrínseco, así que se ven a 0 px. En `lib.mjs`, `logo()` |

## 2026-08-19 · el prefooter, unificado en las siete páginas

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🔴 Nuestro | **Estábamos usando un `sek-cross` que no es el prefooter** | las 7 páginas | Varias páginas usan `sek-cross` como bloque de contenido propio (los campus en *Dónde sucede*, los idiomas en *Dimensión internacional*). De ahí venían las cards descuadradas y el sello de B Corp donde no tocaba |
| 📐 Criterio | **Hay dos prefooters y no son intercambiables** | todas | `sek-schools`: Colegios · Por qué SEK · Bienestar · Etapas educativas · SEK Learning Model · Servicios (instancia de *Bienvenida*). `sek` institucional: UCJC · Bachillerato Internacional · Colegios internacionales · Ideario · Proyectos Fundación (instancia de *Alumni*). En `lib.mjs`, `prefooter({ marca, excluir })` |
| 📐 Criterio | El prefooter **se autoexcluye**: no lleva la card de la página que lo muestra | Etapas, Por qué SEK, UCJC | Lo pedía ya la nota UX de Etapas educativas |

## 2026-08-19 · revisión de Educación Infantil

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🔴 Nuestro | El **h2 del primer módulo repetía el h1 de la página** | Educación Infantil | El titular de sección es el programa (PEP); el nombre de la etapa baja a overtitle y el destacado pasa a ser el dato de los dos ciclos |
| 🆕 Falta token | **No hay `surfaces-tertiary`** (el crema algo más oscuro para cards sobre fondo crema) | cards sobre crema | Solo existen `accent-cream` (#f4f3ee, más claro que el fondo) y el `#e8e6dd` que el theme usa suelto en el testimonial. Se usa ese; convendría que fuese token |
| ⚠️ Desviación | **Línea del overtitle inyectada** en `content-lg` | Educación Infantil | El `content-grid` publica su divider y el `content-lg` no, así que el mismo overtitle se ve distinto según el bloque. Va con `border-static-disabled` |
| 📐 Criterio | Los **resúmenes de sección van como highlights con icono** (Figma `1685:20601`), no como rejilla de cards sueltas | Educación Infantil | Se leen de un vistazo y comparten fondo con la sección que resumen, para que se asocien |
| 📐 Criterio | El **texto corrido con varias ideas pasa a lista con un título por punto** | Educación Infantil, metodología | Mismo formato que "Así es un día en Educación Infantil" |

## 2026-08-19 · revisión de UCJC

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🔴 Bug de staging | La card **"Etapas educativas y Programas IB" del `sek-cross` lleva el sello de B Corp** como imagen | prefooter, todas las páginas | No le corresponde: es contenido cargado, no del componente. En la maqueta se le pone una foto normal. Conviene corregirlo en el editor |
| ⚠️ Desviación | **Subrayado de enlace siempre visible** en el prefooter | `sek-cross` | `.sek-underline` pinta por defecto una línea gris fija (#cfd3d5) y solo toma el color del texto al pasar por encima: sobre las cards oscuras se pierde. Se fuerza `--sek-ul-fill:100%` para que sea del color del propio texto |
| ⚠️ Desviación | **La Colmena sigue siendo carrusel en escritorio** | UCJC | El `content-grid` pasa a rejilla a partir de 640 px y por eso esconde flechas y líneas. Con seis retos interesa la galería completa; se mantiene el modo scroller y los controles dejan de ocultarse |
| ⚠️ Desviación | Bloque de **Estudios con la marca UCJC** (fondo granate, texto e iconos en blanco) | UCJC | La oferta académica es de la universidad, no del colegio |
| 📐 Criterio | **Trazo de icono 1,25** (antes 1,5) y tamaños más contenidos | todas | El icono acompaña al dato, no compite con él |
| 📐 Criterio | La regla del overtitle puede ir apagada con el token **`border-static-disabled`** | UCJC, Experiencia | La utilidad `bg-` de ese token no está emitida: se aplica por variable CSS |

## 2026-08-19 · revisión de Logros y calificaciones

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🆕 Petición | **Rejilla de logos con nombre y enlace externo** (antes se planteó como slider) | Universidades de destino | Receta [`grid-logos`](new/grid-logos.md). Con 18 destinos, el carrusel esconde la mayoría. **Los 18 logos ya están** en `output/assets/img/universidades/` con su procedencia en `FUENTES.md` — son marcas registradas: confirmar versión autorizada antes de publicar |
| 📐 Criterio | **Ritmo del cuerpo: normal, destacado, normal** | todas las páginas | El párrafo destacado en medio da respiro vertical. Cuando la sección tiene bajada, la destacada es la bajada y va la primera. En `lib.mjs`, `cuerpo(..., { destaca })` |
| 📐 Criterio | **Cabecera a dos columnas** (Title Section 02, Figma `4:1385`) en bloques que solo traen overtitle | testimonial | Sin ella el texto de sección se estira a todo el ancho del bloque y la línea se hace ilegible. `cabeceraDoble()` antepone el `sek-section-heading` del `content-lg` |
| 📐 Criterio | Enlaces que salen del sitio: `target="_blank"` + `rel="noopener noreferrer"`, flecha diagonal decorativa y aviso en texto para lector de pantalla | rejilla de universidades | La flecha sola no dice nada a quien no la ve |
| 🔴 Nuestro | **Párrafos colgados de la fila del heading** → cada uno se volvía una columna de ~100 px | las 5 páginas nuevas | El `sek-section-heading` es una fila de dos columnas a partir de 981 px, y ya trae su columna de texto. `lib.mjs` la localiza (`columna()`) y `cuerpo()` vuelca ahí |
| 🔴 Nuestro | **La foto de la plantilla, repetida por toda la página** (hasta 11 veces en Por qué SEK) | páginas con `content-lg` como cabecera | `sek-content-lg` de Curso 25-26 trae `schools-banner.jpg`. `sinMedia()` la retira, y también su contenedor, que vacío dejaba un rectángulo negro de 810 px |
| 🔴 Nuestro | **Etiquetas de cifra de 50 caracteres** en celdas de 164 px (siete líneas) | Logros, Educación Infantil, Espacios deportivos | La etiqueta de una cifra es una etiqueta: el detalle vive en el texto de la sección. `verify-page.mjs` avisa si supera 45 caracteres dentro de una celda `max-w-[…px]` |
| ⚠️ Desviación | El panel de resultados 2×2 con cards de cifras no se puede montar | Logros | `sek-cert` colorea sus slides por posición y las deja desalineadas; el bloque de cifras pierde la agrupación por área. Va como cabecera + fila de cifras + accesos por área |
| 🔴 Nuestro | **Iconos corruptos**: 15 SVG eran la página de redirección del CDN, no el icono | todas las páginas | `curl` sin `-L` guardó "Redirecting to…" dentro del `.svg`. Rescatados; `lib.mjs` ahora revienta si un icono no contiene `<svg>` |
| 🔴 Nuestro | **Copy de la plantilla sin sustituir** en tres sitios de Logros | hero, Evolución, Universidades | El volcado buscaba `h3`/`p` en bloques que usan `span`, y reescribía solo el primer nodo de la card. `verify-page.mjs` compara ahora **cada texto de la página contra el catálogo de bloques** y lo caza solo |

## 2026-08-18 · tarde (cuatro páginas nuevas)

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🆕 Petición | **No hay bloque de tabs** en todo el catálogo (30 bloques) | Etapas educativas | Receta [`tabs-seccion`](new/tabs-seccion.md). Mientras tanto va con `sek-programas` y las cards de "La experiencia SEK" se agrupan en un carrusel único |
| 🆕 Petición | **Rejilla de logos con nombre y enlace** (SEK-CON-006) | Logros y calificaciones | Receta [`grid-logos`](new/grid-logos.md). Va con `sek-cert` y un icono genérico: **faltan los 18 logotipos de universidad**, no se inventan |
| 🆕 Petición | Acordeón en **variante FAQ**: sin imagen y con respuesta en texto | Etapas educativas, Educación Infantil | Receta [`accordion-faq`](new/accordion-faq.md). La única instancia publicada es la de actividades, con foto y etiquetas |
| ⚠️ Desviación | **`sek-stats` no tiene titular ni texto**: es solo la fila de cifras | Logros (IB, PAU, universidades), Educación Infantil | Se compone `sek-content-lg` + `sek-stats` con el mismo fondo, igual que en SISA. Si el bloque tuviera cabecera propia, sobraría el apaño |
| ⚠️ Desviación | Párrafos inyectados bajo el titular | todas las páginas nuevas | Los bloques exponen **un** slot de texto y los wireframes traen dos o tres párrafos por sección. Mismo caso que [`section-heading-bajada`](new/section-heading-bajada.md) |
| ⚠️ Desviación | `sek-doble-card` **no lleva enlace**: el CTA se añade con el tratamiento de link del sistema | Residencias | Si el bloque va a usarse como cierre con llamada a la acción, necesita su slot de CTA |
| ⚠️ Desviación | `sek-cert` reutilizado como **cards de icono + título** | Residencias, Por qué SEK, Educación Infantil | Es el bloque de acreditaciones (logo suelto). Para "N cards con icono y título" es lo más cercano que hay publicado |
| 📐 Criterio | Textos que el wireframe marca **pendientes de redactar** se dejan visibles como tales | Educación Infantil (la jornada), Logros (evolución) | No se inventa copy: el hueco tiene que verse en la maqueta para que el cliente lo rellene |

## 2026-08-18

| Tipo | Qué | Dónde | Por qué / qué hacer |
|---|---|---|---|
| 🔴 Bug de staging | **`sek-banner-cta` se ha quedado sin heading**: el titular es un `div.font-title` | `banner-cta` en todas sus instancias | La sección desaparece del árbol de encabezados y del salto por landmarks. Ocurre en **5 sitios** del catálogo. Receta [`banner-cta-heading`](new/banner-cta-heading.md). En las maquetas el titular vuelve a `h2` |
| 🔴 Bug de staging | `bg-sekSchools-surfaces-accent-greendeep` **no existe**: la utilidad emitida es `greenDeep`, con D | `tailwind-built.css` | Quien escriba la clase en minúsculas se queda sin fondo y sin aviso. Conviene emitir también el alias en minúsculas o documentarlo |
| ⚠️ Desviación | Bajada de sección inyectada en `sek-testimonial` | Espacios deportivos, Etapas educativas | El bloque no tiene slot para la bajada y el wireframe la trae. Receta [`section-heading-bajada`](new/section-heading-bajada.md) |
| ⚠️ Desviación | Las cards de "La experiencia SEK" se agrupan en un carrusel único, con la etapa como overtitle | Etapas educativas | Sin bloque de tabs no hay dónde repartirlas por etapa. Al construir [`tabs-seccion`](new/tabs-seccion.md), cada card vuelve a su panel |
| ⚠️ Desviación | `sek-accordion` sin imagen y con el panel en texto corrido | Etapas educativas (FAQs) | La única instancia publicada es la de actividades, con foto y etiquetas. Receta [`accordion-faq`](new/accordion-faq.md) |
| ⚠️ Desviación | Icono `kayak` de Lucide en línea | Espacios deportivos | El set del theme no tiene piragua. Receta [`icono-piraguismo`](new/icono-piraguismo.md) |
| ⚠️ Desviación | CTA convertido en card sólida dentro del carrusel | Espacios deportivos, prefooter | Receta [`card-cta-solida`](new/card-cta-solida.md) |
| ⚠️ Desviación | Regla corta en el overtitle (ancho fijo en vez de `flex-1`) | Espacios deportivos (banner) | Receta [`section-heading-regla-corta`](new/section-heading-regla-corta.md). Pendiente decidir si se propaga |
| ⚠️ Desviación | Galería sin autoplay y testimonial sin vídeo | Espacios deportivos | El theme no expone ninguna de las dos cosas. Recetas [`slider-autoplay`](new/slider-autoplay.md) y [`testimonial-video`](new/testimonial-video.md) |
| 🐞 Bug de UI, ya corregido | **Las anclas no llevaban a la sección: el arrastre de la barra se comía el clic** | `_staging/lib.mjs`, todas las páginas con anchor bar | Era nuestro, no del theme. El gesto de arrastrar la barra pedía `setPointerCapture` en el `pointerdown`, y eso redirige a la barra **todos** los eventos de puntero, incluido el `click` que el navegador genera al soltar: el enlace no lo recibía nunca, ni se ponía el hash. Solo pasa con ratón o trackpad; un `.click()` sintético no atraviesa los eventos de puntero, y por eso las pruebas daban verde. Ahora la captura se pide cuando el gesto supera el umbral de arrastre (4 px), así que un clic limpio llega entero. Vigilado por `clic-no-capturado`. |
| 🐞 Bug de staging | **El salto del anchor bar lo cancela cualquier `wheel`** | `assets/js/sek-ui.js` | Lenis aborta su `scrollTo` ante cualquier evento de rueda, y la inercia del trackpad sigue emitiendo `wheel` segundos después de soltar. Medido: un solo `wheel` de 1 píxel lo cancela. **Arreglo probado**: `lock: true, force: true` en las dos llamadas a `window.lenis.scrollTo()` (`smoothScrollToEl` y `correctTo`, ~2557 y ~2573). Aplicado ya en la copia de UI para poder revisar; falta llevarlo al theme. |
| 📐 Criterio | **El subrayado animado necesita contraste en la línea base** | migas de todas las páginas | `.sek-underline` pinta la base en gris fijo (`#cfd3d5`) y encima el `currentColor` que crece al hover. Sobre el hero eso es blanco creciendo sobre gris claro: la animación ocurre y no se ve. La maqueta sube esa base a blanco al 35 % solo dentro de `.sek-brc`. Si el theme parametriza el color de la base, mejor que el override. |
| 📐 Criterio | **La rejilla, al número de datos** | UCJC, Espacios deportivos, Logros | Los bloques traen las columnas de su ejemplo (el de cifras venía con cinco). Montado con cuatro, la quinta se queda vacía a la derecha y el grupo se lee corrido a la izquierda; `justify-content:center` no salva nada porque las columnas sí llenan. Lo ajusta `columnasSegunDatos()` en `pulido()`, que solo baja y solo escribe la clase si el CSS precompilado la emite. Vigilado por `columnas-fantasma`. |
| 📐 Criterio | **Quien pinta un fondo de marca, pone la tinta** | UCJC y las que traigan color de cliente | El granate de UCJC no es una superficie del sistema: se pinta con `style` inline, y por eso ningún helper de tinta lo veía. Tres bloques llevaban texto negro sobre granate. Ahora lo resuelve `superficieDeMarca()` (`_staging/lib.mjs`), que pinta **y** tiñe, decide por luminancia y respeta las piezas con fondo claro propio. Vigilado por `tinta-sobre-marca` y `superficie-sin-tinta`. |
| 📐 Criterio | **Las migas, en blanco** | todas las páginas | Van siempre sobre el hero, que lleva foto con velo. No lo declaraba ninguna de las siete: heredaban el negro del theme y quedaban gris sobre gris. `migasEnBlanco()` en `pulido()`; el nivel actual y el separador, en `inverseMuted`. |
| 📐 Criterio | **Iconos a trazo 1,25** en todo lo que inyecta UI | todas las maquetas | Lucide viene a 2 y canta al lado del texto. El valor lo fijó Guille a mano en UCJC el 24/08 y pasa a ser el del sistema: vive en `TRAZO_ICONO` (`_staging/lib.mjs`), no en cada build |
| 📐 Criterio | **Overtitle corto, titular largo** | todas las páginas nuevas | Cambio de criterio de UX: el overtitle es una etiqueta (registro del anchor bar) y la frase larga va en el `h2` |
| 📐 Criterio | **Ritmo de fondos**: nunca dos secciones seguidas con el mismo | todas las páginas nuevas | Alterna cream `#f0eee5` / light `#fbfbfb`, con el testimonial en `#e8e6dd` |

### Nota sobre el CSS precompilado

`tailwind-built.css` está **precompilado**: una utilidad arbitraria que no esté ya emitida no
existe, y el elemento sale a su tamaño intrínseco sin ningún aviso. Las maquetas se verifican
con `preview/_staging/verify-page.mjs`, que compara **todas** las clases de la página contra el
CSS del theme. Si dev añade utilidades nuevas, ese chequeo deja de dar falsos positivos solo
con volver a descargar `assets/theme/`.
