/* Desktop nav 3D depth: hover/focus-visible lift on the link row, and a
   permanent forward Z on the active ("you are here") link. Scoped to
   templates/partials.html.tmpl's "nav" define — the .hidden.md:flex link
   row (perspective context, .n3d-links) and each <a> inside it (.n3d-link).
   Kept out of mobile-nav.css: this is a desktop hover/focus concern,
   unrelated to the #mobile-nav :target overlay mechanics that file owns.
   No new colors — shadows are plain black at low opacity. Reuses
   Tailwind's own default easing (cubic-bezier(.4,0,.2,1), the same curve
   behind transition-colors/transition-all) so the new motion doesn't read
   as a separate design language. `color` is included in the transition
   list on purpose: without it, loading after tailwind.css would reset
   transition-property and silently kill the existing hover:text-white
   color fade on inactive links. */

.n3d-links {
  perspective: 700px;
}

.n3d-link {
  display: inline-block;
  transform: translateZ(0) rotateX(0deg);
  transition:
    transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1),
    color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
}

.n3d-link:hover,
.n3d-link:focus-visible {
  transform: translateZ(12px) rotateX(-5deg);
  box-shadow: 0 8px 14px -6px rgba(0, 0, 0, 0.5);
}

.n3d-link-active {
  transform: translateZ(8px) rotateX(0deg);
  box-shadow: 0 5px 10px -6px rgba(0, 0, 0, 0.4);
}

.n3d-link-active:hover,
.n3d-link-active:focus-visible {
  transform: translateZ(16px) rotateX(-4deg);
  box-shadow: 0 10px 16px -6px rgba(0, 0, 0, 0.55);
}

@media (prefers-reduced-motion: reduce) {
  .n3d-link,
  .n3d-link-active {
    transition: none;
  }
  .n3d-link:hover,
  .n3d-link:focus-visible,
  .n3d-link-active,
  .n3d-link-active:hover,
  .n3d-link-active:focus-visible {
    transform: none;
    box-shadow: none;
  }
}