/* ==========================================================================
   a11y.css — GFS-Group 3サイト共通 アクセシビリティ
   v1.0 / 2026-04-20

   - skip-to-content リンク
   - :focus-visible 統一スタイル
   - prefers-reduced-motion 対応
   ========================================================================== */

/* ---------- Skip to content ---------- */
.skip-link {
  position: absolute;
  top: 0;
  left: 0;
  padding: var(--space-md) var(--space-lg);
  background-color: var(--primary);
  color: var(--bg);
  font-weight: 700;
  z-index: var(--z-toast);
  transform: translateY(-100%);
  transition: transform var(--transition-fast);
}

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

/* ---------- Focus visible（共通スタイル） ---------- */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* フォーム要素は outline を内側寄せ */
.form-control:focus-visible {
  outline-offset: -2px;
}

/* ---------- reduced motion  ---------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
    transition-duration: 0.01ms;
    scroll-behavior: auto;
  }
}

/* ---------- Screen-reader only content ---------- */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- noscript fallback ---------- */
.noscript-notice {
  padding: var(--space-md);
  text-align: center;
  background-color: var(--warning-sub);
  color: var(--gray-900);
  font-size: var(--fs-sm);
}
