/* lineas.css — lo único que las subpáginas de línea añaden sobre el sitio. Se carga DESPUÉS de componentes.css y solo en /lineas//. Se escribe aparte y no dentro de componentes.css por dos razones: la home no usa ni una de estas reglas (serían ~3 KB que baja todo el mundo para nada), y así queda claro qué pertenece a la página única y qué a las subpáginas. Aquí NO hay ni un hex: el color de cada línea entra por --color-pagina, que la propia página fija en su con el token que ya existe en tokens.css (--color-linea-capsulas, --color-linea-fibras…). Cambiar la paleta sigue siendo tocar un solo bloque de tokens.css. */ /* ===================== 1. CABECERA DE LA SUBPÁGINA ===================== Ocupa el lugar del hero de la home. Va sobre la banda de color de su línea, así que el texto se aclara A MANO: sin esto hereda --tinta-suave y queda petróleo sobre petróleo, que es el fallo que ya se pagó en las escenas de producto (ver el bloque .giro de componentes.css). */ /* ⚠️ El selector va con `main > section.` y NO con `.cabecera-linea` a secas, y no es estilo: es especificidad. El ritmo de bandas del sitio se pinta con `main > section:not(.seccion--lineas)` (componentes.css, bloque 20), que pesa 0-1-2 y le gana a una clase suelta (0-1-0). Escrito a secas, esta cabecera salía con el fondo hueso de las bandas y el texto blanco encima quedaba ilegible — medido en el navegador: rgb(242,246,248) en vez del color de línea. Es la misma trampa que ya se pagó con `main > .planta`. Toda sección que quiera fondo propio se declara con este peso. */ main > section.cabecera-linea { background-color: var(--color-pagina, var(--acento-hondo)); color: var(--hueso); padding-block: calc(var(--pad-seccion) * 0.85) var(--pad-seccion); } .cabecera-linea__interior { display: flex; flex-direction: column; gap: var(--e-6); max-width: var(--medida); } .cabecera-linea__eyebrow { font-family: var(--fuente-utilidad); font-size: var(--txt-sm); letter-spacing: 0.08em; text-transform: uppercase; /* Mismo aclarado que .giro__clave, y por el mismo motivo medido: `--acento` a secas da 4.36:1 sobre la banda de jarabes y líquidos —la más clara de las seis— y REPRUEBA AA por poco. Al 85 % sube a 4.68:1 en ese peor caso. */ color: color-mix(in srgb, var(--acento) 85%, white); margin: 0; } .cabecera-linea__titulo { font-family: var(--fuente-display); font-size: var(--txt-3xl); line-height: var(--alto-display); color: var(--hueso); margin: 0; } .cabecera-linea__entrada { font-size: var(--txt-lg); line-height: var(--alto-lead); color: var(--hueso); margin: 0; } .cabecera-linea__acciones { display: flex; flex-wrap: wrap; gap: var(--e-4); } /* ============================ 2. MIGAS ============================ Va en