/* Trayecta EU · Europa > país > carrera (10/10/2026): migas de pan, subpestañas por carrera, pastillas de estado y
   tarjetas de país. Solo variables de /assets/tokens.css (sin colores ni medidas literales). */

/* Migas de pan: «Europa › España › Odontología» */
.migas { padding: var(--e-3) 0 0; font-size: var(--tam-s); color: var(--c-texto-suave); }
.migas ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--e-1) 0; }
.migas li { display: inline-flex; align-items: center; }
.migas li + li::before { content: "\203A"; padding: 0 var(--e-2); color: var(--c-texto-suave); }
.migas a { color: var(--c-texto-suave); text-underline-offset: var(--separacion-subrayado); padding: var(--e-1) 0; }
.migas a:hover { color: var(--c-texto); }
.migas [aria-current="page"] { color: var(--c-texto); font-weight: var(--peso-medio); }

/* Subpestañas por carrera: se parten en líneas (todas visibles) y cada una se pulsa con el dedo (alto mínimo) */
.subpestanas { margin: var(--e-3) 0 var(--e-4); }
.subpestanas ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--e-2); }
.subpestanas li + li { margin-top: 0; }
.subpestanas a,
.subpestanas__pronto {
  display: inline-flex;
  align-items: center;
  gap: var(--e-2);
  min-height: 2.75rem;
  padding: 0 var(--e-4);
  border: var(--borde-fino) solid var(--c-linea);
  border-radius: var(--radio-pastilla);
  background: var(--c-superficie);
  color: var(--c-texto);
  font-size: var(--tam-s);
  text-decoration: none;
}
.subpestanas a:hover { background: var(--c-acento-tinte); }
.subpestanas a[aria-current="page"] {
  background: var(--c-acento);
  border-color: var(--c-acento);
  color: var(--c-sobre-acento);
  font-weight: var(--peso-medio);
}
.subpestanas a[aria-current="true"] {
  border-color: var(--c-acento);
  border-width: var(--borde-medio);
  font-weight: var(--peso-medio);
}
.subpestanas__pronto { background: var(--c-superficie-2); color: var(--c-texto-suave); border-style: dashed; }
.subpestanas__pronto small { font-size: var(--tam-xs); }

/* Menú principal: el país en el que estás queda marcado */
.nav a[aria-current="true"] { color: var(--c-texto); border-bottom-color: var(--c-linea); font-weight: var(--peso-medio); }

/* Pastillas de estado de un país */
.estado {
  display: inline-block;
  padding: 0 var(--e-2);
  border-radius: var(--radio-pastilla);
  font-size: var(--tam-xs);
  font-weight: var(--peso-medio);
  line-height: var(--interlineado);
  white-space: nowrap;
}
.estado--completa { background: var(--c-hecho-fondo); color: var(--c-hecho-texto); }
.estado--marcha { background: var(--c-indicio-fondo); color: var(--c-indicio-texto); }
.estado--pronto { background: var(--c-superficie-2); color: var(--c-texto-suave); border: var(--borde-fino) solid var(--c-linea); }

/* Tarjetas de país (portada) */
.paises { list-style: none; padding: 0; margin: var(--e-5) 0 0; display: grid; gap: var(--e-4); }
.paises li + li { margin-top: 0; }
.pais {
  display: block;
  height: 100%;
  padding: var(--e-5);
  background: var(--c-superficie);
  border: var(--borde-fino) solid var(--c-linea);
  border-radius: var(--radio-l);
  color: var(--c-texto);
  text-decoration: none;
}
.pais strong { display: block; margin: var(--e-2) 0 var(--e-1); font-size: var(--tam-h3); line-height: var(--interlineado-titulo); color: var(--c-acento); }
.pais span:not(.estado) { display: block; color: var(--c-texto-suave); }
.pais:hover { border-color: var(--c-acento); }
.pais:hover strong { text-decoration: underline; text-underline-offset: var(--separacion-subrayado); }
@media (min-width: 48rem) { .paises { grid-template-columns: repeat(3, 1fr); } }

/* Carrera todavía sin página (Alemania): tarjeta sin enlace */
.ruta--pronto { color: var(--c-texto-suave); }
.ruta--pronto strong { color: var(--c-texto-suave); }
