/* CIVIQ · accesibilidad base
   V47.14 -- hasta esta versión el sitio no declaraba ningún estilo de foco para
   teclado. Varios botones incluso lo apagaban explícitamente (`outline:0` en las
   sugerencias de giro y en los resultados de ubicación de market-study.css) sin
   poner nada en su lugar: alguien navegando con Tab no podía ver dónde estaba.
   Se usa :focus-visible para que el anillo aparezca con teclado y no al hacer clic
   con el ratón, que es lo que llevó a apagarlo en primer lugar. */

:root {
  --civiq-focus: #1769e0;
  --civiq-focus-contrast: #ffffff;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
details:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible {
  outline: 3px solid var(--civiq-focus);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Sobre fondos oscuros (CTA azul, encabezados de color) el anillo azul se pierde:
   ahí se dibuja blanco con un halo azul por fuera. */
.header-cta:focus-visible,
.market-submit:focus-visible,
.button-primary:focus-visible,
.submit-v5:focus-visible {
  outline: 3px solid var(--civiq-focus-contrast);
  outline-offset: 2px;
  box-shadow: 0 0 0 6px rgba(23, 105, 224, .45);
}

/* Enlace para saltar al contenido: invisible hasta que recibe foco. */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  padding: 12px 18px;
  background: #0f2c4a;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  border-radius: 0 0 8px 0;
}
.skip-link:focus {
  left: 0;
}

/* Quien pide menos movimiento no debería recibir animaciones de decoración. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}
