/* A quiet ink fill keeps labels still and the full hit area available. */
.button,.header nav>.nav-contact {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:color 240ms ease,border-color 240ms ease;
}
.button::before,.header nav>.nav-contact::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:var(--ink-fill,#173b67);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform 240ms cubic-bezier(.2,.65,.3,1);
}
.header nav>.nav-contact { --ink-fill:var(--navy); }
.contact .button-primary { --ink-fill:#e8e6df; }
.button:is(:hover,:focus-visible)::before,
.header nav>.nav-contact:is(:hover,:focus-visible)::before { transform:scaleX(1); }
.button:is(:hover,:focus-visible) { background:var(--navy);border-color:#173b67;color:var(--paper); }
.header nav>.nav-contact:is(:hover,:focus-visible) { background:transparent;border-color:var(--navy);color:var(--paper); }
.contact .button-primary:is(:hover,:focus-visible) { background:var(--paper);border-color:#e8e6df;color:var(--navy); }

.text-link { position:relative;border-bottom-color:var(--line); }
.text-link::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform 240ms ease;
}
.text-link:is(:hover,:focus-visible)::after { transform:scaleX(1); }

@media(prefers-reduced-motion:reduce) {
  .button,.header nav>.nav-contact,
  .button::before,.header nav>.nav-contact::before,.text-link::after { transition:none; }
  .hero-frame:hover img,.work:hover img,.gallery-item>button:hover img { transform:none; }
}