/* Volamos Travel — fichas y variables comunes a todas las paginas.
   Colores del manual de marca.
   OJO: no usar el azul marino #1B3D7A, que es de TravelDesk y es otra empresa.

   El sistema visual es el mismo que el de la landing volamostravel.es: mismo violeta
   profundo, mismo naranja, misma Playfair Display para los titulares. Son la misma
   marca y tienen que parecerlo. Si algun dia se cambia un color alli, se cambia aqui.

   La fuente la carga functions/_middleware.js, no cada pagina: asi ninguna se publica
   sin ella por olvido. */

:root {
  /* Marca */
  --violeta: #4814A0;
  --lavanda: #9164CC;
  --naranja: #FF8200;
  --naranja-claro: #FF9526;   /* solo para el :hover de los botones */
  --ambar:   #FFB548;
  --azul:    #4EC3E0;

  /* Violetas profundos, casi navy: fondos oscuros y veladuras sobre foto */
  --oscuro:   #221650;
  --oscuro-2: #170E38;
  --negro:    #120C26;

  /* Neutros. No son grises cualquiera: llevan una pizca del violeta de marca, para
     que el texto secundario y los bordes pertenezcan a la misma familia. */
  --texto:  #2B2440;
  --gris:   #6B6580;
  --crema:  #FAF9FD;
  --linea:  #E9E4F4;

  /* Tipografia. Serif para titulares y citas, sans del sistema para el resto:
     es lo que da el aire editorial sin cargar dos ficheros de fuente. */
  --serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  color-scheme: light;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--sans);
  color: var(--texto);
  background: #fff;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--violeta); }

/* El atributo hidden tiene que ganar siempre. Sin esta regla, cualquier bloque con
   display propio ignora hidden y se sigue viendo: .lista-articulos es grid, asi que
   las secciones vacias del indice del blog quedarian a la vista, igual que el aviso
   de "se abre WhatsApp" del formulario antes de enviarlo. */
[hidden] { display: none !important; }

/* ══════════ Banner de consentimiento ══════════ */
/* Una barra sobria abajo, no una tarjeta redondeada con sombra: el briefing las
   prohibe y ademas aqui estorbarian. Filete violeta arriba para que se despegue del
   contenido sin gritar.

   LOS DOS BOTONES SON IGUALES A PROPOSITO. Rechazar tiene que costar lo mismo que
   aceptar: mismo tamano, misma altura, sin equis que consienta por omision. Es el
   punto por el que sancionan, y no se toca al rediseniar. */
.consentimiento {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 999;
  background: #fff;
  border-top: 3px solid var(--violeta);
  box-shadow: 0 -2px 12px rgba(43, 36, 64, .10);
  padding: 1rem 0;
}

.consentimiento .contenedor {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .9rem 1.6rem;
}

.consentimiento-texto {
  margin: 0;
  max-width: 62ch;
  font-size: .95rem;
  line-height: 1.55;
  color: var(--texto);
}

.consentimiento-acciones {
  display: flex;
  gap: .6rem;
  flex-shrink: 0;
}

.consentimiento-acciones .boton { margin: 0; }

.boton-neutro {
  background: #fff;
  color: var(--texto);
  border: 1px solid var(--linea);
}
.boton-neutro:hover { border-color: var(--violeta); color: var(--violeta); }

@media (max-width: 560px) {
  .consentimiento .contenedor { display: block; }
  .consentimiento-acciones { margin-top: .8rem; }
  .consentimiento-acciones .boton { flex: 1; text-align: center; }
}