/* Pie — el mismo en todas las páginas hechas a mano.
 *
 * Es copia del pie del home, que es de Framer, medido en vivo el 28/09/2026 a
 * 320, 390, 600, 810, 1000, 1199 y 1440 px: mismos cortes (810 y 1200), mismas
 * proporciones (marca 1/3, enlaces 2/3), mismos iconos y el mismo hover del
 * botón de Italia. Si el pie del home cambia, se vuelve a medir allí.
 *
 * Vive aparte de `lineup.css` por lo mismo que `menu.css`: lo cargan páginas
 * que no traen `lineup.css` (el open call). El markup lo escribe
 * `build_footer.py`; no se edita a mano en cada página.
 */

@font-face {
    font-family: "NT Dapper Bold";
    src: url("/assets/lg8pGDhHXkXCwpzc4qbeWBUI.woff2") format("woff2");
    font-display: swap;
    font-style: normal;
    font-weight: 700;
}

.ff-footer {
    display: flex;
    align-items: center;
    gap: 342px;
    width: 100%;
    margin: 30px 0 0;
    /* 1200 px de caja centrada con 50 de relleno, como el home; el fondo
       ocupa todo el ancho. */
    padding: 50px max(50px, calc((100% - 1200px) / 2 + 50px));
    background: #fafafa;
    color: #666;
    font-family: Inter, Arial, sans-serif;
    font-feature-settings: "cv03", "cv04", "cv09", "cv11";
    letter-spacing: -0.02em;
    text-align: left;
    -webkit-font-smoothing: antialiased;
}

.ff-footer-brand {
    display: flex;
    flex: 1 0 0;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}

/* El borde va como sombra interior para que no mueva nada al irse: en el home,
   al pasar el ratón entra el degradado y el borde se desvanece. */
.ff-footer-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 41px;
    padding: 0 12px;
    border-radius: 10px;
    box-shadow: inset 0 0 0 2px #222;
    color: #222;
    font-family: "NT Dapper Bold", Inter, Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-align: center;
    text-decoration: none;
    transition: box-shadow 0.3s ease;
}

.ff-footer-cta:hover,
.ff-footer-cta:focus-visible {
    background: linear-gradient(82deg, #ebae4c 2%, #edad42 17.3863%, #94c8ea 43%, #aed7f5 55%, #408abe 97%);
    box-shadow: inset 0 0 0 0 #222;
}

.ff-footer-logos {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.ff-footer-logo {
    display: block;
    flex: 1 0 0;
    min-width: 0;
}

.ff-footer-logo img {
    display: block;
    width: 100%;
    height: auto;
}

.ff-footer-copy {
    align-self: flex-start;
    color: #888;
    font-size: 12px;
    line-height: 1.6;
}

.ff-footer-links {
    display: flex;
    flex: 2 0 0;
    gap: 10px;
    min-width: 0;
}

.ff-footer-links > div {
    display: flex;
    flex: 1 0 0;
    flex-direction: column;
    min-width: 0;
}

/* Sin cortes de línea, como en el home: a 320 px «REDES SOCIALES» y
   «Preguntas frecuentes» son más anchos que su columna y se salen hacia el
   hueco de al lado en vez de partirse. */
.ff-footer-links h2 {
    align-self: flex-start;
    margin: 0;
    color: #666;
    font-family: Inter, Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    white-space: nowrap;
}

.ff-footer-links a {
    display: flex;
    align-items: center;
    gap: 2px;
    color: #666;
    font-size: 12px;
    line-height: 1.6;
    text-decoration: none;
    white-space: nowrap;
}

.ff-footer-links svg {
    flex: none;
    width: 16px;
    height: 16px;
}

/* ------------------------------------------------------------ tableta ---- */

@media (max-width: 1199.98px) {
    .ff-footer {
        gap: 73px;
        padding: 25px;
    }
}

/* -------------------------------------------------------------- móvil ---- */

/* Una columna; los enlaces en dos: FUTUR y LEGAL a la izquierda, redes a la
   derecha. Las dos filas miden lo mismo, como en el home. */
@media (max-width: 809.98px) {
    .ff-footer {
        flex-direction: column;
        align-items: stretch;
        gap: 30px;
        padding: 26px 25px;
    }

    .ff-footer-copy {
        align-self: center;
    }

    .ff-footer-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 1fr;
        gap: 10px 40px;
    }

    .ff-footer-links > :nth-child(2) {
        grid-area: 2 / 1;
    }

    .ff-footer-links > :nth-child(3) {
        grid-area: 1 / 2;
    }
}