/* ==========================================================================
   AITANA TOUR · FOOTER (rediseño 2027)
   Compartido por todas las páginas. Se carga después de styles-v3.css.
   ========================================================================== */

.ft {
    --ft-rojo: #cc3300;
    --ft-negro: #0a0a0a;
    --ft-blanco: #ffffff;
    --ft-linea: #333333;
    --ft-texto: #cfcfcf;
    --ft-tenue: #a8a8a8;
    --ft-gutter: clamp(16px, 4vw, 48px);

    background: var(--ft-negro);
    color: var(--ft-blanco);
    font-family: 'Barlow', 'Poppins', system-ui, sans-serif;
    line-height: 1.55;
    text-align: left;
    padding: clamp(56px, 8vw, 96px) 0 40px;
}

/* La marquesina (countdown) es fija abajo: deja sitio cuando está en la página */
.countdown-banner ~ .ft,
.countdown-banner ~ #footer .ft { padding-bottom: 100px; }

.ft *,
.ft *::before,
.ft *::after { box-sizing: border-box; }

.ft ul { list-style: none; margin: 0; padding: 0; }
.ft li { margin: 0; padding: 0; }
.ft li::before { content: none !important; }
.ft a { color: inherit; text-decoration: none; }
.ft p { margin: 0; font-family: inherit; }

.ft__wrap {
    max-width: calc(1344px + 2 * var(--ft-gutter));
    margin: 0 auto;
    padding: 0 var(--ft-gutter);
    display: flex;
    flex-direction: column;
    gap: clamp(40px, 6vw, 56px);
}

/* ---------- Marca gigante ---------- */
.ft__marca {
    display: block;
    font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif;
    font-weight: 800;
    font-size: clamp(64px, 15.5vw, 216px);
    line-height: .8;
    letter-spacing: .01em;
    text-transform: uppercase;
    color: var(--ft-blanco) !important;
}
.ft__punto { color: var(--ft-rojo); }
.ft__marca:hover .ft__punto { color: var(--ft-blanco); }

/* ---------- Rejilla de columnas ---------- */
.ft__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px 24px;
    border-top: 1px solid var(--ft-linea);
    padding-top: 40px;
}
.ft__intro { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 10px; max-width: 460px; }
.ft__intro p { font-size: 16px; color: var(--ft-texto); }

@media (min-width: 1024px) {
    .ft__grid { grid-template-columns: 5fr 2fr 2fr 3fr; gap: 40px 32px; }
    .ft__intro { grid-column: auto; }
}

.ft__titulo {
    margin: 0 0 16px;
    font-family: 'IBM Plex Mono', ui-monospace, Menlo, monospace !important;
    font-weight: 400 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase;
    color: var(--ft-tenue) !important;
}
.ft__col ul:not(.ft__redes) { display: flex; flex-direction: column; gap: 4px; }
.ft__col ul:not(.ft__redes) a {
    display: inline-block;
    padding: 4px 0;
    font-size: 15px;
    color: var(--ft-blanco);
    transition: color .2s ease;
}
.ft__col ul:not(.ft__redes) a:hover { color: var(--ft-rojo); }

/* Redes */
.ft__redes { display: flex; flex-wrap: wrap; gap: 8px; }
.ft__redes a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--ft-linea);
    color: var(--ft-blanco);
    transition: background-color .2s ease, border-color .2s ease;
}
.ft__redes a:hover { background: var(--ft-rojo); border-color: var(--ft-rojo); }

.ft__whatsapp {
    display: inline-flex;
    flex-direction: column;
    margin-top: 20px;
    font-weight: 600;
    font-size: 16px;
    color: var(--ft-blanco);
}
.ft__whatsapp-label {
    font-family: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
    font-weight: 400;
    font-size: 12px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ft-tenue);
}
.ft__whatsapp:hover span:last-child { color: var(--ft-rojo); }

@media (max-width: 1023px) {
    .ft__grid > .ft__col:last-child { grid-column: 1 / -1; }
}

/* ---------- Pie ---------- */
.ft__pie {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px 24px;
    border-top: 1px solid var(--ft-linea);
    padding-top: 24px;
    font-family: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
    font-size: 12px;
    color: var(--ft-tenue);
}
.ft__pie p { font-family: inherit; font-size: inherit; color: inherit; }
.ft__idiomas { display: flex; gap: 4px; }
.ft__idiomas a,
.ft__idiomas span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0 6px;
}
.ft__idiomas span { color: var(--ft-blanco); }
.ft__idiomas a:hover { color: var(--ft-rojo); }

.ft a:focus-visible { outline: 3px solid var(--ft-rojo); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
    .ft * { transition: none !important; }
}