/* Nuevo diseño de Vuelokey (2026): cabecera, pie y cards de ofertas de la home. Solo CSS: se carga después de StyleSheet.foundation.css y no toca el HTML. */
@import url("https://fonts.googleapis.com/css?family=Dosis:500,700,800&display=swap");
@import url("OfertasVK.css?v=26100701"); /* páginas de ofertas: cada bloque se activa solo en su página */
@import url("ResultadosVK.css?v=26100703"); /* página de resultados de vuelos */
:root { --vk-rojo: #F33A3A; --vk-oscuro: #333; }

/* ---------- CABECERA ---------- */
.header-rsp { background: var(--vk-rojo); border-top: 0; font-family: 'Dosis', sans-serif; }
.header-rsp .top-bar { background: transparent !important; box-shadow: none; max-width: 75rem; padding: 1rem 1rem .5rem; align-items: center; }
.header-rsp .top-bar, .header-rsp .top-bar ul, .header-rsp .top-bar li { background-color: transparent; }

/* Logo blanco: cambia la imagen sin tocar el <img> */
.header-rsp .top-bar-title img[src*="logo_vk"] { content: url("/cdn/all/logo_vk_blanco.png"); max-height: 60px !important; margin-left: 0 !important; }
.header-rsp .top-bar-title, .header-rsp .top-bar-title a.black { color: #fff; }
.header-rsp .menu-icon.dark::after { background: #fff; box-shadow: 0 7px 0 #fff, 0 14px 0 #fff; }

/* Arriba a la derecha: "Atención al cliente | Resido en:" en una línea */
.header-rsp .top-bar-right { display: flex; align-items: center; justify-content: flex-end; color: #fff; font-size: 1.25rem; margin-right: 0; }
.header-rsp .top-bar-right > .text-right:first-child { order: 2; padding-left: 1rem; margin-left: 1rem; border-left: 1px solid #fff; }
.header-rsp .top-bar-right > .text-right:last-child { order: 1; }
.header-rsp .top-bar-right ul.menu > li:nth-child(n+2) { display: none; } /* email, WhatsApp y teléfono: no salen en el diseño */
.header-rsp #attclientes { font-size: 1.25rem; }
.header-rsp #attclientes a { color: #fff; padding: 0; }
.header-rsp #attclientes img { display: none; }
.header-rsp .top-bar-right a[data-toggle="banderas"] { color: #fff; }
.header-rsp .arrow-down { border-top-color: #fff; }

/* Menú */
#responsive-menu { background: var(--vk-rojo); }
#responsive-menu .dropdown.menu { background: none; display: flex; justify-content: space-between; flex-wrap: wrap; }
#responsive-menu .dropdown li a { color: #fff; border: 0; text-transform: uppercase; font-family: 'Dosis', sans-serif; font-size: 1.05rem; padding: .45rem 1.75rem; }
#responsive-menu .dropdown li:last-child a { border: 0; }
#responsive-menu .dropdown li:first-child a,
#responsive-menu .dropdown li a:hover { background: #fff; color: var(--vk-oscuro); }

@media screen and (max-width: 39.9375em) {
    .header-rsp .top-bar { padding: .5rem; }
    #responsive-menu .dropdown.menu { display: block; }
    #responsive-menu .dropdown li { border: 0; border-top: 1px solid rgba(255,255,255,.4); }
}

/* ---------- PIE ---------- */
#site-footer { background: #fff; color: var(--vk-oscuro); padding: 0 0 2rem; margin-top: 2rem; font-family: 'Dosis', sans-serif; }

/* Fila 1: las dos listas de enlaces en una banda roja a todo el ancho; la tercera columna (contacto) debajo */
#site-footer > .row:first-child { display: flex; flex-wrap: wrap; justify-content: center; }
#site-footer > .row:first-child > .columns:nth-child(-n+2) {
    flex: 0 0 100%; max-width: 100%; padding: .4rem 0; background: var(--vk-rojo);
    box-shadow: 0 0 0 100vmax var(--vk-rojo); clip-path: inset(0 -100vmax); /* banda a todo el ancho sin tocar el HTML */
}
#site-footer > .row:first-child > .columns:first-child { padding-top: 1.25rem; }
#site-footer > .row:first-child > .columns:nth-child(2) { padding-bottom: 1.25rem; margin-top: -1px; } /* -1px: sin línea entre las dos bandas */
#site-footer > .row:first-child > .columns:nth-child(-n+2) ul { display: flex; flex-wrap: wrap; justify-content: center; list-style: none; margin: 0; }
#site-footer > .row:first-child > .columns:nth-child(-n+2) li { margin: 0 .9rem; }
#site-footer > .row:first-child > .columns:nth-child(-n+2) li::before { content: "\2022"; color: #fff; margin-right: .4rem; }
#site-footer > .row:first-child > .columns:nth-child(-n+2) a { color: #fff; font-size: 1.1rem !important; }

/* Contacto: email | teléfono | Síguenos en + iconos, en una línea con texto rojo */
#site-footer > .row:first-child > .columns:nth-child(3) {
    flex: 0 0 100%; max-width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    padding: 1.5rem 0 1rem; color: var(--vk-rojo);
}
#site-footer > .row:first-child > .columns:nth-child(3) > * { margin: 0; padding: 0 1rem; }
#site-footer > .row:first-child > .columns:nth-child(3) > p + p,
#site-footer > .row:first-child > .columns:nth-child(3) > .contenedor_icon { border-left: 1px solid #ccc; }
#site-footer > .row:first-child > .columns:nth-child(3) p:has(> a > img[src*="WhatsApp"]),
#site-footer > .row:first-child > .columns:nth-child(3) .WhatsAppES { display: none; } /* imagen grande de WhatsApp */
#site-footer .resaltarTexto, #site-footer .resaltarTexto a { color: var(--vk-rojo); font-size: 1.1rem; font-weight: normal; }
#site-footer .contenedor_icon { display: flex; align-items: center; gap: .5rem; }
#site-footer .contenedor_icon p { margin: 0; }
#site-footer ul.icono_redes { display: flex; gap: .2rem; margin: 0; list-style: none; }
#site-footer ul.icono_redes a { color: var(--vk-rojo); font-size: 1.2rem; padding: 0 .2rem; }

/* Datos legales en oscuro */
#site-footer .nota { border-top: 0; color: var(--vk-oscuro); padding-top: 0; }
#site-footer .nota a, #site-footer > .row:not(:first-child) a { color: var(--vk-oscuro); }
#site-footer > .row:not(:first-child) p { color: var(--vk-oscuro) !important; } /* el bloque de fondos UE trae color:#fff en línea */

@media screen and (max-width: 39.9375em) {
    #site-footer > .row:first-child > .columns:nth-child(3) > * { border-left: 0 !important; padding: .25rem 0; flex: 0 0 100%; justify-content: center; }
}

/* ---------- CARDS DE OFERTAS (home: Flight/<sitio>/Default.aspx) ---------- */
/* Imagen arriba y una barra roja con: PAÍS a la izquierda y "Desde 580€ i/v" a la derecha */
.home-offers {
    display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
    margin-top: 1.5rem; padding: 0 1.25rem .45rem; background: var(--vk-rojo); border: 0; border-radius: 10px; overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,.15); font-family: 'Dosis', sans-serif; text-align: left; transition: transform .2s;
}
.home-offers:hover { transform: translateY(-3px); }
.home-offers div.i { flex: 0 0 calc(100% + 2.5rem); margin: 0 -1.25rem .45rem; height: auto; aspect-ratio: 2.2 / 1; border: 0; background-size: cover; background-position: center; }
.home-offers a, .home-offers a:hover { padding: 0; margin-right: .5rem; white-space: nowrap; color: #fff; font-size: 1.45rem; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; }
.home-offers > div:last-child { white-space: nowrap; color: #4a0d0d; font-size: 1.15rem; font-weight: 700; }
.home-offers strong { color: #fff; font-size: 1.45rem; font-weight: 800; }
@media screen and (max-width: 63.9375em) { /* tablet: precio siempre en otra línea, así todas las cards miden igual y el grid (float) no se descoloca */
    .home-offers a { flex: 0 0 100%; overflow: hidden; text-overflow: ellipsis; }
    .home-offers a, .home-offers strong { font-size: 1.2rem; }
    .home-offers > div:last-child { font-size: 1rem; }
    #responsive-menu .dropdown li a { padding: .45rem .8rem; font-size: .95rem; }
}