/* ─────────────────────────────────────────────────────────────────────────────
   Hintlab Accessibility
   Skip link, visually-hidden utility, reduced-motion, forced-colors, print.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Skip link ───────────────────────────────────────────────────────────────── */

.skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  background: var(--ink);
  color: var(--paper);
  padding: 6px 12px;
  font-family: var(--font-mono);
  font-size: .85rem;
  text-decoration: none;
  z-index: 9999;
}

.skip-link:focus {
  top: 8px;
}

/* ── Visually hidden — screen-reader-only text ───────────────────────────────── */

.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;
}

/* ── Reduced motion ──────────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: no-preference) {
  .card { transition: box-shadow .1s; }
  .btn  { transition: box-shadow .1s; }
  .card-cta { transition: background .1s, color .1s; }
  .nav-logo { transition: background .1s, color .1s; }
  .nav-links a { transition: border-color .1s; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ── Hover effects — require motion preference check ────────────────────────── */

@media (prefers-reduced-motion: no-preference) {
  .btn-primary:hover,
  .btn-primary:focus,
  .btn-secondary:hover,
  .btn-secondary:focus {
    box-shadow: var(--shadow);
  }

  .card:hover {
    box-shadow: var(--shadow);
  }
}

/* ── Forced colours mode ─────────────────────────────────────────────────────── */

@media (forced-colors: active) {
  .skip-link {
    forced-color-adjust: none;
    background: ButtonText;
    color: ButtonFace;
    border: 2px solid ButtonText;
  }

  .btn-primary {
    forced-color-adjust: none;
    background: ButtonText;
    color: ButtonFace;
    border: 2px solid ButtonText;
  }
}

/* ── Print ───────────────────────────────────────────────────────────────────── */

@media print {
  .site-header,
  .skip-link {
    display: none;
  }

  footer {
    border-top: 1px solid #000;
    background: none;
    padding: 1rem 0;
  }

  .hero {
    background: none;
    border: 1px solid #000;
  }

  a::after {
    content: " (" attr(href) ")";
    font-size: .8em;
  }

  a[href^="#"]::after,
  a[href^="mailto"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }
}
