/* ==========================================================
   Ergotherapie con Amor
   accessibility.css

   Enthält:
   - Sprunglink
   - sichtbare Fokusmarkierung
   ========================================================== */


/* ==========================================================
   1. Sprunglink
   ========================================================== */

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 9999;

  padding: 10px 16px;

  color: var(--color-white);
  background: var(--color-violet);

  border-radius: var(--radius-small);

  transform: translateY(-160%);
  transition: transform 0.2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}


/* ==========================================================
   2. Fokusdarstellung
   ========================================================== */

:focus-visible {
  outline: 3px solid var(--color-orange);
  outline-offset: 3px;
}