/* Pestañas de los términos y condiciones: FUTUR FESTIVAL / WAY TO THE FUTUR.
 *
 * Las cargan `/t-c` y `/t-c-way-to-the-futur`. Cada pestaña es una página
 * propia, así que es navegación y no un tablist: la activa lleva
 * `aria-current="page"`.
 *
 * La barra va FUERA de `#main`. En `/t-c` React rehidrata `#main` desde el
 * chunk de Framer y se lleva por delante cualquier cosa que se le meta dentro
 * (ver «Las cuatro trampas» en el README). Por eso va en absoluto justo debajo
 * del hero —`.framer-2q60xi` mide 400px en los dos breakpoints— y al bloque de
 * texto se le agranda el padding de arriba para hacerle hueco. El `!important`
 * es porque Framer vuelve a inyectar su CSS al montarse.
 *
 * `/t-c-way-to-the-futur` es una copia de `/t-c` SIN el runtime de Framer: si
 * hidratara, pintaría encima el texto de Futur Festival, que es el que trae el
 * chunk. Para `build_i18n.py` es una página «mano»: su `/en` sale del
 * diccionario como las demás.
 *
 * El estilo copia las pestañas de día de `/lineup` (texto suelto, subrayada la
 * activa), con la tipografía del título del hero.
 */

.tc-tabs {
    position: absolute;
    top: 400px;
    left: 0;
    right: 0;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 38px;
    padding: 44px 20px 0;
}

.tc-tabs a {
    padding: 6px 2px;
    border-bottom: 2px solid transparent;
    color: #636363;
    font-family: "NT Dapper Bold", "NT Dapper Bold Placeholder", sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-decoration: none;
    text-transform: uppercase;
    transition: color 160ms ease, border-color 160ms ease;
}

.tc-tabs a:hover {
    color: #0b0b0b;
}

.tc-tabs a[aria-current="page"] {
    border-bottom-color: #0b0b0b;
    color: #0b0b0b;
}

.tc-tabs ~ #main .framer-1bbdn4j {
    padding-top: 130px !important;
}

/* Los títulos de sección van en mayúsculas como en los de Futur Festival,
   pero el documento de Way to the Futur los trae en minúsculas: se dejan tal
   cual en el HTML y se suben aquí, para no reescribir el texto legal. */
.tc-seccion {
    text-transform: uppercase;
}

@media (max-width: 1199.98px) {
    .tc-tabs {
        padding-top: 28px;
    }

    .tc-tabs ~ #main .framer-1bbdn4j {
        padding-top: 104px !important;
    }
}