/* Clay-style link hover: a thin underline that draws in left→right on hover
   and sweeps out to the right on leave. Text color never changes. Applies to
   header/footer text links across all pages. Brand/logo (first link) and
   project cards are intentionally excluded. The big contact links keep their
   own permanent underline and are intentionally NOT included here. */

.zr-head a:not(:first-child),
.site-head a:last-child,
.site-foot a {
  position: relative;
}

.zr-head a:not(:first-child)::after,
.site-head a:last-child::after,
.site-foot a::after {
  content: '';
  position: absolute;
  left: 0;
  right: auto;
  top: auto;
  bottom: -3px;
  width: 100%;
  height: 1px;
  background: currentColor;
  opacity: 1;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .45s cubic-bezier(.16, 1, .3, 1);
  pointer-events: none;
}

.zr-head a:not(:first-child):hover::after,
.site-head a:last-child:hover::after,
.site-foot a:hover::after {
  transform: scaleX(1);
  transform-origin: left center;
}

/* color must not change on hover (clay behaviour) */
.zr-head a:not(:first-child):hover { color: #1f1f1f !important; }
.site-head a:last-child:hover { color: #1f1f1f !important; }
.site-foot a:hover { color: #6e6e6e !important; }