/* ============================================================ SPORTS TRAVEL COLOMBIA — páginas por deporte Cada página declara su acento en el , y son CUATRO variables, no una. Suena a exceso hasta que se mira lo que hace cada trabajo: | Token | Para qué | Contra qué se mide | |-----------|-----------------------------------|---------------------| | --sp | superficie: rellenos, filetes, | nada, es el brillo | | | brillos, bordes, sombras | | | --sp-t | TINTA sobre el papel crema | ≥4,5:1 vs. el crema | | --sp-f | relleno de botón cuando --sp no | ≥4,5:1 vs. --sp-ink | | | aguanta la tinta (sólo F1) | | | --sp-ink | tinta que va ENCIMA del relleno | ≥4,5:1 vs. --sp/-f | El porqué de --sp-t está contado largo en stc.css, junto a los seis tokens --c-*-t. En corto: el acento de marca brilla —para eso se eligió— y por eso mismo no sirve como tinta sobre crema. Cinco de los seis daban entre 2,2 y 3,4 donde hacen falta 4,5. La regla al escribir una regla nueva es de una línea: **acento SOBRE el crema → --sp-t · acento DEBAJO de algo → --sp.** ⚠️ --sp-f lleva respaldo (`var(--sp-f, var(--sp))`) a propósito: cinco de las seis páginas no lo declaran y heredan su acento sin enterarse. Sólo F1 lo necesita, porque su rojo con blanco encima da 4,49 — 4,5 pelado. ============================================================ */ /* Nav sobre fondo claro: en estas páginas el hero ya es crema, así que los enlaces van en tinta oscura desde arriba (no sólo al hacer scroll). Mayor especificidad (body …) para ganar sin depender del orden de carga. La barra va crema desde arriba, no sólo al hacer scroll. Antes podía ser transparente porque el degradado del hero desteñía la foto hasta casi crema justo debajo del nav; al cambiarlo por un corte duro (ver hero-diagonal.css) la foto llega entera hasta el borde superior y los enlaces que caen sobre ella —«Moto GP», «Tenis», «Otros» según el ancho— se quedaban en tinta oscura sobre foto oscura. Con la barra opaca el contraste no depende de qué foto tenga cada página, y de paso el nav deja de cambiar de aspecto al empezar a bajar. */ body .stc-nav { background: rgba(245, 236, 214, 0.9); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border-bottom-color: var(--line); } body .stc-nav .nav-links a { color: var(--text-2); } body .stc-nav .nav-links a:hover, body .stc-nav .nav-links a.active { color: var(--cream); } /* El desplegable «Otros» es un